當輸入命令：webpack .\src\main.js .\dist\bundle.js
報錯如下：
這是為什么呢？原因是我的webpack版本過高，原來的命令已經(jīng)不適用了
如下查詢版本號：
那應該如何解決?
更換打包命令為: webpack ./src/main.js -o ./dist/bundle.js
其中 bundle.js是打包后生成的文件的文件名
可以看到main.js已經(jīng)被打包為了bundle.js文件卜高，但是，這個并沒有打包成功！
?因為打包的時候沒有出現(xiàn)紅色的error了候址，但是還有黃色的警告，如下圖.
黃色警告:是因為webpack4引入了模式,有開發(fā)模式,生產(chǎn)模式,無這三個狀態(tài)
可以看到末尾并沒有生成我們所打包的main.js的信息
黃色部分的警告的意思是伍纫，沒有設置模式,有開發(fā)模式和生產(chǎn)模式兩種宗雇，
接下來，找到package.json.添加上”dev”和”build”這兩個信息以及他們的值：
? “scripts”: {
??? “test”: “echo \”Error: no test specified\” && exit 1”,
???"dev":"webpack --mode development",
??? "bulid":"webapck --mode production"
? },
再全局安裝?webpack-cli：
npm i --save-dev webpack-cli -g
安裝完成后, 輸入命令? npm run dev
但是結(jié)果還是有很多報錯莹规，
原因是赔蒲，你輸入命令 npm run dev 的時候，會默認打包src文件夾下的index.js文件良漱，打包完成后是main.js文件(放在dist)舞虱，你有沒有發(fā)現(xiàn)我們一開始安裝webpack的時候并沒有這個文件生成，所以更別提什么index.js文件了母市，所以這些我們需要手動創(chuàng)建
我們先創(chuàng)建src文件矾兜，還有一個dist文件，存放默認的打包生成的文件, 然后在src里再創(chuàng)建index.js文件
重新輸入命令：npm run dev 患久，如下圖椅寺，dist文件夾里會自動生成一個mian.js文件，并且無任何警告或報錯出現(xiàn)蒋失，說明我們的問題已經(jīng)解決了
在看main.js尾部返帕，也把index.js的代碼放進去了
到了這一步，打包main.js(不是默認的文件的時候),篙挽，黃色警告還是出現(xiàn)!那么應該怎么解決呢荆萤？那就是webpack的版本問題，命令不同了
應該使用如下命令進行打包：
webpack ./src/main.js -o ./dist/bundle.js --mode development
很神奇吧? 黃色警告沒有了
查看打包后的bundle.js文件，末尾也出現(xiàn)了main.js代碼了
注意：運行npm run dev后链韭，index.js打包正常偏竟，但是自己手動創(chuàng)建的main.js打包后雖然出現(xiàn)bundle.js，但還是會報黃色警告：The 'mode' option has not been set, webpack will fallback to 'production' for this value.....敞峭，解決此問題踊谋，只需新建一個webpack.config.js，在module.exports配置對象里加上mode: 'development'儡陨，再打包就顯示正常了
