image.png

一开始我是直接这样安装的：

cd project
npm init -y
mkdir src  dist
在 src下建个 index.js
cnpm i webpack -D
npm  i cnpm -g // 全局运行
cnpm i webpack-cli -D（webpack版本是4.x）
touch webpack.config.js // 配置文件
cnpm i webpack-dev-serve -D
... 开始报错...

webpack.config.js 配置文件

//  向外暴露一个打包的配置对象;
// 因为 webpack 是基于Node构建的；所以 webpack 支持所有的Node API 和 语法
module.exports  =  {
    mode :'development' // 生产环境
}
    // webpack 4.x 中，有一个很大的特性，就是约定大于配置，
    // 约定，默认的打包入楼路径是 src -> index.js
    //  mode :'production' // 开发环境 //  代码进行压缩
    // 也可以直接配置 entry ，这样就会覆盖约定

原因就是版本问题！
解决办法：卸载，重装指定版本的

//  重装 
cnpm i webpack@4 -D
cnpm i webpack-cli@3 webpack-dev-server@3 -D

image.png