webpack提供了命令列介面(CLI),以便對建置過程進行設定和互動。這對於制定早期原型、輪廓、編寫 npm 腳本 或一些個人自訂需求很有用。本文將詳細介紹webpack的命令列介面
#【--help】
列出命令列所有可用的設定選項
webpack --help webpack -h
【--config】
# 指定其它的設定檔。設定檔預設為webpack.config.js,如果想使用其它配置文件,可以加入這個參數
webpack --config example.config.js
【--progress】
列印出編譯進度的百分比值
webpack --progress
【--watch】
觀察檔案系統的變化
webpack --watch webpack -w
【--colors】
開啟/關閉控制台的顏色[預設值: (supports-color)]
webpack --colors webpack --color
【-p】
壓縮混淆腳本
webpack -p
#【--profile】
記錄編譯的效能數據,且輸出。它會告訴你編譯過程中哪些步驟耗時最長,這對於最佳化建置的效能很有幫助
#
package.json檔案中有scripts字段,該字段指定了執行腳本命令的npm命令列縮寫。因此,我們可以把常用指令製作成腳本
//package.json "scripts": {"w": "webpack --progress --colors --watch","p": "webpack -p","dev":"webpack-dev-server" }
執行npm run w時,相當於執行webpack --progress --colors --watch,表示執行監視模式,使用彩色字符,並顯示出打包的百分比過程
運行npm run p時,相當於運行webpack -p,表示壓縮模組文件
運行npm run dev時,相當於運行webpack-dev -server,表示執行本機伺服器
以上是關於webpack命令列的詳細介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章!