模块构建失败:SyntaxError:位于0的JSON中的意外令牌

时间:2017-02-17 22:51:14

标签: javascript json node.js webpack

我这里有一个webpack配置,我正在尝试添加moment-timezone并回答How should I use moment-timezone with webpack?,这导致我Webpack - Error: Cannot define 'query' and multiple loaders in loaders list

var webpack = require('webpack');

module.exports = {
  //devtool: 'inline-source-map',
  entry: [
    'webpack-hot-middleware/client',
    './client/main.js'
  ],
  output: {
    path: require("path").resolve('./assets'),
    filename: 'bundle.js',
    publicPath: '/'
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin()
  ],
  externals: {
      jquery: 'var jQuery'
  },
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        loaders: ['json-loader', 'babel-loader?presets[]=react,presets[]=es2015,presets[]=react-hmre'],
        exclude: /node_modules/
      }
    ]
  }
};

我目前的尝试是在上面。

1 个答案:

答案 0 :(得分:1)

您告诉webpack将您的JavaScript文件传递给json-loader。但由于JavaScript文件不是有效的JSON,因此您会收到第一个字符处已存在意外令牌的错误。

{
  test: /\.jsx?$/,
  loaders: ['json-loader', 'babel-loader?presets[]=react,presets[]=es2015,presets[]=react-hmre'],
  exclude: /node_modules/
}

因此,您需要从json-loader配置中删除.jsx?。另外{web} 2中json-loader不再需要,JSON文件应该只是开箱即用。

您可以将module部分更新为:

module: {
  rules: [
    {
      test: /\.jsx?$/,
      loader: 'babel-loader?presets[]=react,presets[]=es2015,presets[]=react-hmre',
      exclude: /node_modules/
    }
  ]
}

但是,万一它不应该工作,你必须为以json-loader结尾的文件添加.json

{
  test: /\.json$/,
  loader: 'json-loader'
}