天天看点

webpack构建React项目中遇到的报错

webpack构建React http://jspang.com/2017/10/22/react-all-01/,由于电脑安装node版本不同,可能出现的问题不同。我的机器安装node版本v8.1.3 和webpack版本4.16.5,遇到了一下问题。

One CLI for webpack must be installed. These are recommended choices, delivered as separate pack
ages:
 - webpack-cli (https://github.com/webpack/webpack-cli)
   The original webpack full-featured CLI.
 - webpack-command (https://github.com/webpack-contrib/webpack-command)
   A lightweight, opinionated webpack CLI.
We will use "npm" to install the CLI via "npm install -D".
Which one do you like to install (webpack-cli/webpack-command):
           

解决:npm install webpack-cli -g

webpack构建React项目中遇到的报错

webpack.config.js配置中loaders写法已不能再使用。把loaders改为rules

var path = require('path');
module.exports = {
    //入口文件
    entry: './app/index.js',
    //出口文件
    output: {
        filename: 'index.js',
        path: path.resolve(__dirname, 'dist'),
        publicPath: 'temp/'
    },
    devServer: {
        contentBase: './',
        host: 'localhost',
        compress: true,
        port: 
    },
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: "babel-loader",
                query: {
                    presets: ['es2015', 'react']
                }
            }
        ]
    }
}
           

具体参照官方文档

https://webpack.docschina.org/configuration/module/#module-rules

继续阅读