1.安装loader

npm install -save-dev json-loader

2.在webpack.config.js中创建个model

 module: {
        rules: [
            {
                test: /\.json$/,
                type:'javascript/auto',
                loader: 'json-loader'
            }
        ]
    }
//注意我这里加了个type,具体什么原因我也不太清楚,根据字面意思应该是类型。不加我会报错,博主使用的是json-loader 0.5.7

3.创建config.json

{
  "text":"this is loader"
}

4.在js中写入以下代码

const config=require('./config.json');
console.log(config.text);

5.运行即可看到结果

小结:在学这个的时候根据视频上使用的以下代码配置webpack.config.js时会出现loaders报错,百度了2中解法

//第一种,视频上面的
module: {
    loaders: [
      {
        test: /\.json$/,
        loader: 'json-loader'
      }
    ]
  }
//第一种报错后改代码为一下内容
module: {
    rules: [
      {
        test: /\.json$/,
        loader: 'json-loader'
      }
    ]
  }
//改完之后一值json报错,但是仔细一看没有任何错误。然后百度了很久都没有找到解决方案,然后在群里面问了很多人,终于找到一个大牛的解决方案。加上type类型,改最终代码如下
 module: {
        rules: [
            {
                test: /\.json$/,
                type:'javascript/auto',
                loader: 'json-loader'
            }
        ]
    }

标签: Webpack

添加新评论