如何最佳地从发布的JavaScript中删除console.log和其他调试代码?

7
我看过一些阻止浏览器控制台中的错误以及启用旧版浏览器中日志记录功能的控制台包装器,但没有看到有帮助开关调试代码的。

目前我使用查找和替换来注释调试代码。肯定有更好的方法吧?

我正在使用Combres,它使用YUI来压缩JavaScript。我看过一些文章提到在缩小过程中使用双分号标记要删除的行。这是一个技巧还是好习惯?


1
相关链接:https://dev59.com/I2s05IYBdhLWcg3wB9af。 - Frédéric Hamidi
4个回答

2

也许你应该编写一个自己的包装器来使用console.log()记录调试信息。这样一来,在部署到生产环境后,你可以用一个空函数替换该包装器中的单个函数,以避免控制台被调试信息淹没。你也可以用一个空函数替换真正的console.log函数,但这会阻止所有JavaScript输出到控制台,而不仅仅是你的代码。


1
我想重点是完全删除console.log/wrapper调用,以生成更小的压缩JS文件。 - Fluffy

1

如果您看一下YUI框架的实现方式,他们实际上使用了正则表达式并从源代码生成了3个文件。一个具有记录-debug的文件,一个仅包含文件名而去除了日志记录,以及一个没有记录的压缩版本。然后,您可以设置全局配置来确定要使用哪个版本。我曾经以这种方式工作过,效果很好。


1

定义自己的调试函数,它可以是对console.log或任何你想要的东西进行包装,并确保缩小器可以轻松推断出如果使其为空,则它是无操作。之后,一旦您注释掉函数体,大多数缩小器应该会检测到没有调用或内联的内容,并完全删除对您的函数的引用。

这是一个示例:

(function() {
   function debug() {
      console.log(arguments)
   }

   function main() {
      debug(123)
      alert("This is production code!")
      debug(456)
   }

   main()
})()

我将它放入匿名函数中以限制debug的作用域,不让它被分配到窗口 - 这样可以让缩小器轻松决定是否需要它。当我将这段代码粘贴到在线GCC时,我得到:

(function(){function a(){console.log(arguments)}a(123);alert("This is production code!");a(456)})();

但是一旦我在console.log之前添加//,使debug为空,GCC就会将其编译为:

(function(){alert("This is production code!")})();

...完全删除所有调试代码的痕迹!


0
使用 Y.log() 替代,然后您可以使用 gallery-log-filter 过滤您想要查看的日志消息。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接