webpack的CLI安裝和命令html
$ npm install webpack -g
The webpack
command is now available globally. 執行完上面命令,webpack命令在全局可用node
webpack <entry> <output>
entry
Pass a file or a request string. You can pass multiple entries (every entry is loaded on startup). 傳入一個文件或者請求字符串,你能夠傳遞多個entries(每一個entry都會在初始的時候加載)webpack
If you pass a pair in the form <name>=<request>
you can create an additional entry point. 若是傳一個一對值,你就能夠建立額外的entrygit
It will be mapped to the configuration option entry
. 會被映射到配置的entry選項github
output
Pass a path to a file. 傳入一個文件路徑web
It will be mapped to the configuration options output.path
andoutput.filename
. 會被映射到配置選項的output.path
和output.filename
.npm
Many configuration options are mapped from CLI options. I. e. --debug
maps to debug: true
, or --output-library-target
to output.libraryTarget
.json
You see a list of all options, if you don’t pass any option. 許多配置選項是從cli選項映射來的。 --debug對象debug:true,--output和 --output-library-target對應
apioutput.libraryTarget
.若是你不傳參數,你就會看到全部選項的列表
Some plugins are mapped to CLI options. I. e. --define <string>=<string>
maps to the DefinePlugin
.app
You see a list of all options, if you don’t pass any option. 一些插件也對應CLI的選項,--define <string>=<string>
對應 DefinePlugin
.若是你不傳參數,你就會看到全部選項的列表
-d
Equals to --debug
--devtool source-map
--output-pathinfo 等同於
--debug
--devtool source-map
--output-pathinfo
-p
Equals to --optimize-minimize
--optimize-occurence-order
--watch
Watches all dependencies and recompile on change. 觀測全部依賴,若有變更,從新編譯。(經常使用的選項)
--config example.config.js
Specifies a different configuration file to pick up. Use this if you want to specify something different than webpack.config.js
, which is the default.
選擇不一樣配置的文件,當你想指向別的配置文件而不是默認的webpack.config.js的時候用。(經常使用的選項)
--progress
Display a compilation progress to stderr. 在stderr中顯示編譯進度。
--json
Write JSON to stdout instead of a human readable format. 輸出JSON格式而不是人類可讀的格式
Hint: Try to put the result into the analyse tool.
--no-color
Disable colors to display the statistics. 展現統計信息的時候禁用顏色。
--sort-modules-by
, --sort-chunks-by
, --sort-assets-by
Sort the modules/chunks/assets list by a column. 按列排序模塊/塊/assets列表。
--display-chunks
Display the separation of the modules into chunks. 展現分離爲chunks的模塊
--display-reasons
Show more information about the reasons why a module is included. 展現一些爲啥這個模塊被包含的信息。
--display-error-details
Show more information about the errors. I. e. this shows which paths are tried while resolving a module. 展現更多的錯誤信息。好比展現解析模塊時嘗試的路徑
--display-modules
Show hidden modules. Modules are hidden from output by default when they live inside directories called["node_modules", "bower_components", "jam", "components"] 顯示隱藏模塊,當他們在["node_modules", "bower_components", "jam", "components"]中被調用時,模塊默認被隱藏。
If you wish to have a more in-depth idea of what is taking how long, you can use the --profile
switch. This will cause WebPack to display more detailed timing informations. Combine this with the switches above to get a very detailed message and information set, which will contain the timings of your modules. 若是你但願有一個什麼是多久的想法,你能夠用--profile來選擇,他會讓webpack展現更多的時間信息。結合以上的選擇,會獲得一個詳盡的信息,包含你模塊的耗時。
factory
: The time it took to build the module information.構建模塊信息的時間。building
: The time that was spent building the module (loaders, for example).構建模塊的時間(好比loaders)dependencies
: The time that was spent gathering and connecting the dependencies. 整合和鏈接模塊依賴的時間。When using the CLI it’s possible to have the following options in the configuration file. They passed in other ways when using the node.js API.
當使用CLI,可能會用到下面配置文件中的選項,當用nodejs API的時候會以其餘方式被傳入。
watch
Enter watch mode, which rebuilds on file change. 進入觀察模式,文件改變觸發從新構建
watchOptions.aggregateTimeout
Delay the rebuilt after the first change. Value is a time in ms. 第一次改變後延遲重建的時間,值是時間毫秒數。
Default: 300
watchOptions.poll
true
: use polling
number: use polling with specified interval 在指定區間使用輪詢
Default:
undefined
stats
Display options. See node.js API Stats.toString()
for more details.