1、創(chuàng)建列表隔行變色項(xiàng)目
- 創(chuàng)建項(xiàng)目
2鉴嗤、在項(xiàng)目中配置 webpack
- 項(xiàng)目配置
2.1 mode值
- mode可選值
3、webpack.config.js 文件的作用
- webpack.config.js 是 webpack 的配置文件。webpack 在真正開(kāi)始打包構(gòu)建之前遗增，會(huì)先讀取這個(gè)配置文件张咳，從而基于給定的配置帝洪，對(duì)項(xiàng)目進(jìn)行打包。
- webpack 中的默認(rèn)約定
4脚猾、自定義打包的入口與出口
- 自定義打包的入口與出口
5葱峡、webpack 中的插件
-
webpack-dev-server
- webpack-dev-server 可以讓 webpack 監(jiān)聽(tīng)項(xiàng)目源代碼的變化，從而進(jìn)行自動(dòng)打包構(gòu)建龙助。
- npm install webpack-dev-server@3.11.2 -D
- 配置 webpack-dev-server
-
html-webpack-plugin
- html-webpack-plugin 是 webpack 中的 HTML 插件砰奕，可以通過(guò)此插件自定制 index.html 頁(yè)面的內(nèi)容。需求：通過(guò) html-webpack-plugin 插件提鸟，將 src 目錄下的 index.html 首頁(yè)军援，復(fù)制到項(xiàng)目根目錄中一份！
- npm install html-webpack-plugin@5.3.2 -D
- 在webpack.config.js文件配置
6称勋、解惑 html-webpack-plugin
- 解惑 html-webpack-plugin
7胸哥、devServer 節(jié)點(diǎn)
- 在webpack.config.js文件中的module.exports = {}配置
