Webpack執(zhí)行命令參數詳解
一、概述
前面的章節(jié)我們講解了webpack的安裝、webpack.config.js的 基本配置、webpack執(zhí)行命名以及require方法的使用,不 知道大家有沒有發(fā)現,當我們每次修改或者新增一個js文件的時候,就會重新執(zhí)行一下webpack 命令進行編譯,這種方式非常的麻煩,這樣整個項目下來豈不是要執(zhí)行百萬次。接下來我們會講解webpack相關的參數,避免這個情況。
二、參數詳解
在webpack執(zhí)行命令之后可以添加一些參數,這些參數都有自己的作用,下面是參數列表:
$ webpack --config XXX.js //使用另一份配置文件(比如webpack.config2.js)來打包 $ webpack --watch //監(jiān)聽變動并自動打包 $ webpack -p//壓縮混淆腳本,這個非常非常重要! $ webpack -d//生成map映射文件,告知哪些模塊被最終打包到哪里了其中的 $ webpack --progress //顯示進度條 $ webpack --color //添加顏色
-p 是很重要的參數,曾經一個未壓縮的 700kb 的文件,壓縮后直接降到 180kb (主要是樣式這塊一句就獨占一行腳本,導致未壓縮腳本變得很大) 。
這里我們重點說一下 webpack --watch這個參數,這個參數就要的作用就是監(jiān)聽文件是否有改變,有改變就會重新編譯有改變的文件。這個命令非常有用,下面我們還是一個webpackDemo這個項目作為演示。
首先,在 終端執(zhí)行webpack --watch這個命令:

通過截圖可以看到執(zhí)行命令之后,webpack就會一直運行,而不是 像webpack命令執(zhí)行之后就會停止。下面我們修改一下login.js內容,看看終端會有什么改變:
var userName="68kejian.com";
module.exports.userName=userName;
module.exports.sayName=function(){
return userName;
};
module.exprots.login=function(){
};
增加了login()方法,這個時候終端就會發(fā)生變化:

和上個截圖想對比,這里多出了只針對login.js文件編譯的記錄。
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
相關文章
詳解Javascript中document.execCommand()的用法以及指令參數列表
execCommand方法是執(zhí)行一個對當前文檔,當前選擇或者給出范圍的命令。在HTML5中,execCommand可以通過JavaScript代碼來調用,使得開發(fā)者可以在網頁中實現一些復雜的文本操作。在HTML編輯器中這個命令用得很多,酷炫的強大功能。2023-07-07
微信jssdk踩坑之簽名錯誤invalid signature
這篇文章主要介紹了微信jssdk踩坑之簽名錯誤invalid signature,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2020-05-05
JavaScript中如何跳出forEach循環(huán)代碼示例
循環(huán)遍歷一個元素是開發(fā)中最常見的需求之一,下面這篇文章主要給大家介紹了關于JavaScript中如何跳出forEach循環(huán)的相關資料,文章通過代碼介紹的非常詳細,需要的朋友可以參考下2024-06-06
如何利用Web Speech API之speechSynthesis實現文字轉語音功能
Web Speech API使你能夠將語音數據合并到Web應用程序中,SpeechSynthesisUtterance是HTML5中新增的API,用于將指定文字合成為對應的語音,這篇文章主要介紹了利用Web Speech API之speechSynthesis實現文字轉語音功能,需要的朋友可以參考下2024-06-06

