Question

在我的网络应用程序中（在客户端很重，在服务器端轻松），在开发过程中，我需要进行大量调试，console.log非常有用，但理想情况下在生产中，一定不能是显示的任何调试消息，所以我打算添加以下代码：

window.production = false;  // set to true when in production mode.

if(window.production){    
    window.log = function(){};
}else{
    window.log = function(){
        console.log.apply(console, arguments);
    };
}    
//then replace all console.log(a, b, c, ...) into window.log(a, b, c, ...) in my code.

这是一种使调试可配置的好方法，还是我只需要grunt删除所有console.log生产线？

Answer 1

因此，如果你唯一的目标是不在生产中显示调试消息，那么你有大量的选择可供选择！您还应该决定以下内容对您是否重要：

能够在日志语句之外执行其他也不应在生产中运行的工作。
最大限度地减少生产中的文件大小，而不是发送日志记录代码。
多个日志级别或不同的日志记录组。
能够在生产中打开/关闭这些日志记录级别或组。
最大限度地减少每个日志语句必须输入的金额。

在一个非常基本的层面上简单地调用

if (window.console && window.console.log)
{
    window.log = console.log.bind(console); // function devnull() { };
}
else
{
    window.log = function() { };
}

log('This is a log!');

足以让您打开/关闭登录。这将实现上面列表中的目标（5）并且运行良好。

一个替代解决方案适用于像uglify这样可以删除死代码的缩放器，可以用类似的方式包围你的日志记录语句（但是你可能不想污染全局命名空间）：

window.LogLevels =
{
    Off:        0x00000000,
    Error:      0x00000001,
    Warning:    0x00000002,
    Timing:     0x00000004,
    Data:       0x00000008,
    Status:     0x00000010,
    ...
    Verbose:    0x04000000,
};

window.LogLevel = LogLevels.Error | LogLevels.Warning;

window.ShouldLog = function(mask)
{
    return ((window.LogLevel & mask) === mask);
};

if (ShouldLog(LogLEvels.Error)) { log('This is an error!'); }

这将满足条件（1），（3）和（4），并以（5）为代价设置解决（2）。

结合预定义的DEBUG常量（或类似），在构建步骤中，您可以使用正则表达式替换日志语句：

productionCode = debugCode.replace(/ShouldLog\(((?!LogLevels\.Error|LogLevels\.Warning)[^)]*)\)/g, 'DEBUG');

这将完全删除代码中的非错误和非警告级别日志记录并满足（2）。你真的不希望有人偷看你的日志..加上更好的性能！：）

<强>加成如果您想获得额外的时髦，可以使用以下内容（至少在Chrome中）为控制台中的每个日志记录语句获取堆栈跟踪。没有更多'为什么这个日志被击中'！

window.log = function ()
{
    console.groupCollapsed.apply(console, arguments);
    var stack = new Error().stack.split('\n');
    for(var i = 2; i < stack.length; i ++)
    {
        // Trim and remove 'at ';
        console.log('%c' + stack[i].trim().substring(3), 'padding-left: 10px; color: #777');
    }
    console.groupEnd();
};

Answer 2

如果您使用的是Gulp.js或Grunt.js等构建工具，则可以使用以下模块：

如何使console.log可配置

2 个答案: