Question

我正在尝试为我的reactjs应用程序的状态加载JSON文件，但是webpack不断抛出此错误：

ERROR in ./src/data/questions.json
Module parse failed: C:\Users\[...]\myApp\src\data\questions.json
Unexpected token (2:9)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (2:9)
...

JSON文件是有效的，我使用json-loader作为webpack，所以我不确定是什么问题。

这是我的webpack.config.json文件：

module.exports = {
  entry: __dirname + '/src/index.js',
  output: {
    filename: 'bundle.js',
    path: __dirname + '/dist/js'
  },
  cache: true,
  debug: true,
  devtool: 'source-map',
  module: {
    loaders: [{
      test: /\.jsx?$/,
      exclude: /(node_modules|\.c9)/,
      loader: 'babel',
      query: {
        presets: ['react', 'es2015', 'stage-0']
      }
    }, {
      test: /\.json$/,
      loader: 'json-loader'
    }]
  }
};

这就是我导入JSON文件的方式：

const quizes = [
  require('./data/questions.json')
];

如果我将上述行更改为：

const quizes = [
  require('json!./data/questions.json')
];

我得到了一个不同的错误：

ERROR in ./~/json-loader!./src/data/questions.json
Module build failed: SyntaxError: Unexpected token m
    at Object.parse (native)
    at Object.module.exports (C:\Users\[...]\myApp\node_modules\json-loader\index.js:7:48)

更奇怪的是，使用上面的方法（json!前缀），错误会立即抛出（在初始构建期间）。但是，如果我将它留在webpack配置加载器中，初始构建完成没有错误，但后续构建会抛出错误。

尽管如此，我的应用仍然可以在大部分时间内使用。这里发生了什么？

Answer 1

旧问题，但您已指定了两次加载程序：一次在webpack.config.js，另一次在require。使用其中一个，这应该删除错误。

即使使用json loader，webpack也无法解析json

1 个答案: