如何修复&x201C；模块生成失败：语法错误：意外令牌”；在react中使用JSON文件时出错？

我遵循Brian holt的react教程，需要在react组件中导入.json文件，如下所示：

当我尝试构建我的项目时，我得到了

ERROR in ./data.json
Module build failed: SyntaxError: Unexpected token, expected

像这样：

起初，我认为这是一个

eslint

问题，但它似乎发生在构建步骤上，我尝试将

json加载程序添加到
webpack
中，但没有成功

网页包版本：
2.6.1

巴别塔核心版本：
6.24.1

巴别塔加载器版本：
7.0.0,
这是我的网页包配置文件：

const path = require('path')
module.exports = {
   context: __dirname,
   entry: './js/clientApp',
   devtool: 'cheap-eval-source-map',
   output: {
      path: path.join(__dirname, 'public'),
      filename: 'bundle.js',
      publicPath: '/assets/'
   },
   resolve: {
      extensions: ['.js', '.jsx', ',json']
   },
   devServer: {
      publicPath: '/public/',
      port: 2110,
      open: true,
      historyApiFallback: true
   },
   stats: {
      colors: true,
      reasons: true,
      chunks: true
   },
   module: {
      rules: [
         {
            enforce: 'pre',
            test: /\.jsx?/,
            loader: 'eslint-loader',
            exclude: /node_modules/
         },

         {
            test: /\.jsx?/,
            loader: 'babel-loader'
         }
      ]
   }
}

这是我的.babelrc文件：

{
    "presets": [
        "react", ["env", {
            "targets": {
                "browsers": "last 2 versions"
            },
            "loose": true,
            "modules": false
        }]
    ]
}

有什么建议吗？
正则表达式
test属性标识应转换的文件

问题在于规则中的正则表达式：

{ test: /\.jsx?/ }

告诉网页使用
babel loader
和任何以
.js或.jsx开头的文件扩展名

如您所见，
.json
匹配测试

解决方案
$-匹配任何内容，直到字符串结束

要解决此问题，只需将
？
替换为
$
，请参见以下示例：

 module: {
      rules: [
         {
            test: /\.jsx$/,
            loader: 'babel-loader'
         }
      ]
   }

正则表达式
test属性标识应转换的文件

问题在于规则中的正则表达式：

{ test: /\.jsx?/ }

告诉网页使用
babel loader
和任何以
.js或.jsx开头的文件扩展名

如您所见，
.json
匹配测试

解决方案
$-匹配任何内容，直到字符串结束

要解决此问题，只需将
？
替换为
$
，请参见以下示例：

 module: {
      rules: [
         {
            test: /\.jsx$/,
            loader: 'babel-loader'
         }
      ]
   }

您可以共享您的数据吗。json您可能需要使用重复的数据，请检查以下答案：@btzr我尝试安装json加载程序，但错误仍然存在！！我已经发布了错误的标题，下面是./data.json模块构建失败中的
错误：SyntaxError:Unexpected-token，expected；（2:11）1 |{>2 |“表演”：[|^3 | 4 |{5 |“标题”：“亚特兰大”，
您可以共享您的数据吗。json如果您需要使用的数据可能重复，请检查以下答案：@btzr我尝试安装json加载程序，但错误仍然存在！！我已经发布了错误的标题，这就是如何在./data.json模块构建失败：SyntaxError:预期的意外标记；（2:11）1{>2}“显示”：[|^3 | 4 |{5 | title:“亚特兰大”
非常感谢@btzr的帮助，这对我来说真是一场噩梦xd。非常感谢@btzr的帮助，这对我来说真是一场噩梦xd。