选取一个空目录来试验
全局安装webpack4.1之后
创建目录
mkdir webpacktest && cd webpacktes
初始化package.json
npm init -y;
然后文件目录中安装webpack
npm i webpack@next --save-dev @next我也不知道是什么意思
安装cli工具
npm i webpack --save-dev
再在package.json中配置script
"script":{
"build":"webpack"
}
这个时候直接运行webpack肯定是会报错的。之前的版本需要webpack.congfig.js里面配置一大堆东西;
现在不需要了
直接建立你想要的文件
例如./src/index.js
随笔写几句代码 console.log(‘new webpack 4.0 is so easy‘);
npm run build
可以看到直接打包好了放在./dist/main.js中
index.js运行结果和main.js一样。说明咱们的操作是对的;庆祝下吧。
之前参考一些文章。例如 :入门webpack这篇文章就够了;按照上面的步骤根本走不下来。
还遇到错误提示
WARNING in configuration
The ‘mode‘ option has not been set. Set ‘mode‘ option to ‘development‘ or ‘production‘ to enable defaults for this environment.
只需要在package.json中添加配置项:
"scripts": {
"dev": "webpack --mode development",
"build": "webpack --mode production"
}
然后npm run dev 这个时候dist里面的文件的不是压缩过的
但是npm run build 这个时候dist的main.js就是压缩了的。哈哈 很高兴吧