最近在學習webpack打包過程中遇到的一個問題向大家分享下!
創建了一個webpacksty的目錄,目錄下放着dist,src子目錄,然后通過node環境下,npm init -y 初始化項目出現package.json文件,src子目錄下又存放着index.html和main.js文件,接下來嘗試着在main.js輸入一句代碼當驗證打包后續是否成功的過程:
console.log("ok");
接下就是執行webpack打包命令了
把src下的main.js打包到dist下的bundle.js,執行命令:
webpack .\src\main.js .\dist\bundle.js
執行后:
報錯了!此時也可以直接看出我的webpack版本號:4.30.0 ,算是新版本了。
當然此時查看結構目錄下dist肯定沒有bundle.js的文件出現,然后自己也是看別人的博客查詢到了原來是版本過高,以前的命令已經不適用了,只要加-o就輕松解決原來。
webpack .\src\main.js -o .\dist\bundle.js
此時就執行成功了!
在dist目錄下也自動生成了bundle.js的文件。
然后在index.html導入這個生成的文件,運行在瀏覽器查看
打包成功!
有人會問,解決辦法的博客這么多,你為什么不在出問題的時候看別人的博客解決問題或者是轉載別人的,但是我自己堅持只有你真正動手了才會印象更深刻,開發這條路容不得偷懶,想要不被這個時時刻刻都在技術變更的時代不被淘汰,那就努力吧!一個小小的問題別嫌它小,小也有小的解決辦法!加油!