Webpack 在執行的時候,除了在命令行傳入參數,還可以通過指定的配置文件來執行。默認情況下,會搜索當前目錄的 webpack.config.js
文件,這個文件是一個 node.js 模塊,返回一個 json 格式的配置信息對象,或者通過 --config
選項來指定配置文件。
webpack文檔:https://webpack.github.io/docs/
1.新建一個文件夾src存放打包前的源文件,dist文件夾存放打包后的文件,新建一個webpack.config.js為webpack的配置文件
打包前的文件夾中的內容
2.新建一個index1.html引用dist下打包后的js
3.輸入命令:webpack,即可按照webpack.config.js中的配置項進行編譯
4.編譯完的文件目錄和內容如下
5.如果將webpack.config.js重命名為webpack.dev.config.js,則直接執行默認的webpack命令則會找不到相應的配置文件,需要借助於webpack的--config選項來指定配置文件
命令:webpack --config webpack.dev.config.js
6.如果要查看編譯的進度,打包的模塊之類的,可以在package.json中的scripts標簽內通過webpack的屬性值來指定
7.輸入命令:npm run webpack,來編譯打包
webpack.config.js中entry值的詳細介紹:
https://webpack.github.io/docs/configuration.html#entry
entry的值可以是一個string類型的字符串,也可以是一個數組,還可以是一個json對象
數組:這種情況會將entry定義的數組中的文件內容打包到output中定義的這一個文件
json對象:這種情況適應於多頁面時的編譯
output屬性值介紹:https://webpack.github.io/docs/configuration.html#output
使用命令:npm run webpack,編譯打包將會看到在dist/js下生成兩個文件