怎样让Winston和Webpack一起工作?

10

我有一个使用node.js的electron应用程序,想在该应用程序中使用Winston进行日志记录。我已经将winston添加到我的package.json文件中,但是当我运行webpack的构建命令时,从winston的colors.js依赖项中得到了一些警告。

'...the request of a dependency is an expression...'

接着引用了winston和colors.js。忽略这些警告是行不通的,因为电子应用程序会在尝试从winston加载某些文件时出现异常。

我在Stack Overflow和GitHub网站上进行了一些调查,它们说colors.js有一些动态require语句,webpack存在问题。我也看到其他示例项目似乎在其项目中没有任何问题地使用winston。是否有人知道如何在electron应用程序中正确地使用webpack包括winston日志记录包?

1个回答

12

这个问题有两个方面:

1) winston 直接或间接依赖于 color.js,因此一旦 winston 存在,该依赖项就会自动包含。 在某些较旧的版本中,它包含了一个动态 require 语句,导致出现以下情况:

2) 一个依赖项具有 Webpack 无法处理的动态 require 语句;您可以配置 webpack 以忽略此特定情况,或升级 winston 到较新版本,以便选择没有该动态 require 的 color.js 变体(请参见https://github.com/winstonjs/winston/issues/984)。

要告诉 Webpack 处理动态 require,您需要告诉 Webpack Winston 是外部库。

以下是我webpack.config.js的示例:

 externals: {
    'electron': 'require("electron")',
    'net': 'require("net")',
    'remote': 'require("remote")',
    'shell': 'require("shell")',
    'app': 'require("app")',
    'ipc': 'require("ipc")',
    'fs': 'require("fs")',
    'buffer': 'require("buffer")',
    'winston': 'require("winston")',
    'system': '{}',
    'file': '{}'
},
为了在使用Electron的Angular 2应用程序中使用日志记录器,请创建一个logger.js文件,然后使用全局日志记录服务TypeScript文件(即logging.service.ts)对其进行包装。 logger.js文件使用所需的Winston配置设置创建logger变量。
    var winston = require( 'winston' ),
    fs = require( 'fs' ),
    logDir = 'log', // Or read from a configuration
    env = process.env.NODE_ENV || 'development',
    logger;
​


     winston.setLevels( winston.config.npm.levels );
    winston.addColors( winston.config.npm.colors );

    if ( !fs.existsSync( logDir ) ) {
        // Create the directory if it does not exist
        fs.mkdirSync( logDir );
    }
    logger = new( winston.Logger )( {
        transports: [
            new winston.transports.Console( {
                level: 'warn', // Only write logs of warn level or higher
                colorize: true
            } ),
            new winston.transports.File( {
                level: env === 'development' ? 'debug' : 'info',
                filename: logDir + '/logs.log',
                maxsize: 1024 * 1024 * 10 // 10MB
            } )
        ],
        exceptionHandlers: [
            new winston.transports.File( {
                filename: 'log/exceptions.log'
            } )
        ]
    } );
    ​
    module.exports = logger;

日志服务.ts:

export var LoggerService = require('./logger.js');

现在日志服务可以在整个应用程序中使用。

示例:

import {LoggerService} from '<path>';
...    
LoggerService.log('info', 'Login successful for user ' + this.user.email);

我无法在使用angular-cli而不是webpack本身并且没有访问webpack配置文件的情况下使用这种方法。 - meshkati
1
@invisible 你可以通过执行 ng eject 来克服 webpack,这将生成 webpack.conf.js 文件。当我使用上述配置执行此操作时,webpack 给出了编译错误,因为它无法在 logger.service.ts 文件中找到记录器。 - patz

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