node.js - 无法将rollbar.js构建在基于 Node/基于Webpack的项目中

我们希望在基于node / webpack / babel / ES6 / React的项目中使用Rollbar.js。目前尚不清楚100％使用正确的NPM软件包，但似乎是这样的：

https://www.npmjs.com/package/rollbar

从那里开始，说明非常简单：添加对package.json的引用，安装并开始使用。因此，这是package.json中的参考：

"rollbar": "0.6.2",

运行npm install似乎可以正常工作，但是当我运行npm start时，我在控制台中收到此错误：

ERROR in ./~/rollbar/lib/parser.js
Module not found: Error: Cannot resolve module 'fs' in [myProjectRoot]node_modules/rollbar/lib
 @ ./~/rollbar/lib/parser.js 7:9-22

ERROR in ./~/rollbar/package.json
Module parse failed: [myProjectRoot]node_modules/rollbar/package.json Unexpected token (2:9)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (2:9)
    at Parser.pp.raise ([myProjectRoot]node_modules/webpack/node_modules/acorn/dist/acorn.js:923:13)
    at Parser.pp.unexpected ([myProjectRoot]node_modules/webpack/node_modules/acorn/dist/acorn.js:1490:8)
    at Parser.pp.semicolon ([myProjectRoot]node_modules/webpack/node_modules/acorn/dist/acorn.js:1469:73)
    at Parser.pp.parseExpressionStatement ([myProjectRoot]node_modules/webpack/node_modules/acorn/dist/acorn.js:1994:8)
    at Parser.pp.parseStatement ([myProjectRoot]node_modules/webpack/node_modules/acorn/dist/acorn.js:1772:188)
    at Parser.pp.parseBlock ([myProjectRoot]node_modules/webpack/node_modules/acorn/dist/acorn.js:2009:21)
    at Parser.pp.parseStatement ([myProjectRoot]node_modules/webpack/node_modules/acorn/dist/acorn.js:1753:19)
    at Parser.pp.parseTopLevel ([myProjectRoot]node_modules/webpack/node_modules/acorn/dist/acorn.js:1666:21)
    at Parser.parse ([myProjectRoot]node_modules/webpack/node_modules/acorn/dist/acorn.js:1632:17)
    at Object.parse ([myProjectRoot]node_modules/webpack/node_modules/acorn/dist/acorn.js:885:44)
 @ ./~/rollbar/lib/notifier.js 14:18-44

我对此毫无意义。看来这表明我的webpack项目无法解析Rollbar的package.json文件，但这似乎是不可能的，因为我的webpack项目还有无数其他NPM软件包，每个软件包都有自己的package.json文件。

有人遇到这个问题吗？

更新：

如果相关，这是我们完整的webpack.config.js文件：

const path = require('path');
const webpack = require('webpack');
const glob = require('glob');

const modulesDirectories = glob.sync('src/**');
const assetsDirectories = glob.sync('assets/**');
Array.prototype.push.apply(
    modulesDirectories,
    assetsDirectories
);
modulesDirectories.push('assets');
modulesDirectories.push('/');
modulesDirectories.push('node_modules');


const modulesDirectoriesWithoutFiles = modulesDirectories.filter(directory => {
    if (directory.slice(-4, -3) === '.' || directory.slice(-3, -2) === '.') {
        return false;
    }
        return true;
});


module.exports = {
  cache: true,
  devtool: 'cheap-module-eval-source-map',
  entry: [
    'eventsource-polyfill',
    'webpack-hot-middleware/client',
    './src/index.js'
  ],
  module: {
    loaders: [
            {
          test: /\.(js|jsx)$/,
          loader: 'babel',
          query: {
              // https://github.com/babel/babel-loader#options
              cacheDirectory: true
          },
          include: path.join(__dirname, 'src'),
          exclude: /node_modules/
        },
        { test: /\.css$/, loader: 'style-loader!css-loader' },
        { test: /\.woff|.ttf|.eot|.woff2$/, loader: `file-loader` },
        { test: /\.(png|jpe?g|gif|svg)$/, loader: `url-loader?limit=8192` },
        ]
    },
  output: {
    path: path.join(__dirname, 'dist'),
    filename: 'bundle.js',
    publicPath: '/static/'
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin(),
    new webpack.DefinePlugin({
        FIREBASE_CONFIG: JSON.stringify({
                apiKey: [ourApiKey],
                authDomain: [ourDomain],
                databaseURL: [ourUrl],
                storageBucket: [ourBucket],
              })
    })

  ],
  resolve: {
    extensions: ['', '.js', '.jsx'],
    root: __dirname,
    modulesDirectories: modulesDirectoriesWithoutFiles,
  }
};

第二次更新：

仍然无法建立东西，但是我有更多信息。如果我从代码中删除Rollbar导入，则控制台错误会消失。我尝试了两种方式导入Rollbar，如下所示：

import rollbar from "rollbar";
var Rollbar = require('rollbar');

两种尝试都会产生相同的错误。如果将node: {fs: "empty"}添加到我的webpack.config.js文件中，则“ fs”错误消失，但是“适当的加载器”错误仍然存​​在。

最佳答案

我遇到了同样的问题。我通过以下方式修复它：


使用fs安装npm install --save fs。或者，您可以按照注释中的建议将node: {fs: "empty"}添加到您的webpack配置中。这两种方法都可以处理rollbar / lib / parser.js中的fs导入。
安装json loader，然后将此加载程序添加到模块->加载程序下的webpack配置中。这通知webpack在加载JSON文件时应使用json加载器。然后，Webpack应该能够在rollbar / lib / notifier.js中导入package.json。

module: {
    loaders: [
        {
            test: /\.json$/,
            loader: "json"
        },
        ...
    ],
    ...
}

关于node.js - 无法将rollbar.js构建在基于 Node/基于Webpack的项目中，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/37973086/