選取一個空目錄來試驗

全局安裝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就是壓縮了的。哈哈 很高興吧

webpack 4.0 配置方法以及錯誤解決