局部安裝webpack，使用 npx webpack進(jìn)行打包
使用 npx webpack --watch進(jìn)行監(jiān)聽(tīng)打包

使用webpack.config.js,來(lái)指定相關(guān)配置： entry, output, mode,
output:通過(guò)filname,來(lái)指定打包文件名稱(chēng)，path指定輸出地址
path：通過(guò) const path = require('path'),來(lái)取得絕對(duì)路徑， 通過(guò)path.resolve(__dirname, './dist'),來(lái)指定輸出目錄
claen:true 來(lái)清除上次生成的文件

mode: 'development', 區(qū)分生成，開(kāi)發(fā)， none
devtool: 'inline-source-map' 打開(kāi)sourcemap，便于追蹤代碼

devServer:進(jìn)行webpack的熱更新
static:'./dist' devServer 指向的物理路徑

webpack-dev-server : 進(jìn)行webpack的熱更新（本身沒(méi)有輸出任何物理文件，把打包好的文件放在內(nèi)存了，）

webpack生產(chǎn)流程：

image.png

插件：plugins

html-webpack-plugin: {
  template:'./index.html',  依賴(lài)模板
  filename:'fff.html',  輸出文件
  inject:'body' 放置位置
}