从您的release JavaScript中删除console.log和其他调试代码的最佳实践？

Question

我见过一些控制台包装器，它们可以通过控制台在浏览器中停止错误，而更高级的包装器可以在较旧的浏览器中启用日志记录。但我没有看到任何帮助打开和关闭调试代码的帮助。

目前，我做了一个查找和替换来注释掉调试代码。一定有更好的办法吗？

我使用的是Combres，它使用YUI来缩小JavaScript。我看过一些帖子提到使用双分号来标记缩小化过程中要删除的线条。这是一种技巧还是良好的实践？

Answer 1

也许您应该在console.log()周围有自己的包装器，并通过该包装器记录您的调试信息。这样，一旦部署到生产环境中，就可以用空函数替换单个函数，这样控制台就不会充斥着调试信息。您也可以将实际的console.log函数替换为空函数，但这将阻止任何Javascript输出到控制台，而不仅仅是您的。

Answer 2

如果你看看YUI框架是如何做到这一点的，你会发现他们实际上使用了一个正则表达式，并从源代码生成了3个文件。一个包含日志记录-debug，一个剥离了日志记录，只有文件名，还有一个没有日志记录的精简版本。然后，您可以设置一个全局配置来说明您想要哪个版本。我过去就是这样工作的，而且工作得很好。

Answer 3

定义您自己调试函数，该函数将包装在console.log或您想要的任何其他东西周围，并确保minifier可以很容易地推断出，如果您将其设置为空，则它是无操作的。在那之后，一旦你注释掉了函数体，大多数缩略器应该检测到没有什么可以调用或内联，并完全删除对你的函数的引用。

示例如下：

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

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

   main()
})()

我已经把它放到匿名函数中，以限制debug的作用域，并且不让它被赋值给window --这使得minifier可以很容易地决定是否需要它。当我将这段代码粘贴到online 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!")})();

...removing所有痕迹的调试代码完全！