webpack4 0之後在專案中的安裝配置問題

2021-09-26 15:58:53 字數 805 閱讀 7071

最近在學vue,剛好學到了webpack,因為看的教程比較老,他們用的都是webpck4.0以下的版本,我一步一步跟著教程的步驟來,發現教程裡一點問題都沒有,到我自己做的時候就遇到了幾個坑,趁著還記得比較清楚,把它記下來。

全域性安裝webpack:

命令列執行: npm i webpack -g

區域性安裝(專案中安裝):

我用的是vscode,在vscode的 powershell 終端中直接執行 cnpm i webpack -d

在專案的根目錄建立乙個名稱為 webpack.config.js 的配置檔案:

const path =

require

('path'

)module.exports =

}

在專案本地安裝webpack-dev-server:

在powershell 終端中 執行命令 cnpm i webpack-dev-server -d

安裝完畢後,不能直接執行 webpack-dev-server,因為webpack-dev-server是在本地安裝的。要在前面生成的 package.json 檔案中配置如下:

,"keywords":[

],"author":""

,"license"

:"isc"

,"dependencies":,

"devdependencies"

:}

webpack4 0基本用法

總結了一下webpack4.0基本用法,基本上所有配置都有注釋說明,超級詳細啊!dist是打包目錄 js壓縮外掛程式 const htmlplugin require html webpack plugin 實現html打包功能,引用好路徑的到html來 const glob require glo...

手寫webpack4 0的配置

webpack詳解 webpack是乙個打包工具,他的宗旨是一切靜態資源即可打包。有人就會問為什麼要webpack?webpack是現代前端技術的基石,常規的開發方式,比如jquery,html,css靜態網頁開發已經落後了。現在是mvvm的時代,資料驅動介面。webpack將現代js開發中的各種新...

webpack4 0配置記錄(1)

趁著假期閒暇,練習下webpack4.0的一些配置。let uglifyjsplugin require uglifyjs webpack plugin let optimizecssassetsplugin require optimize css assets webpack plugin op...