初始化项⽬
# 创建项⽬⽬录
mkdir myproject
cd myproject
# 初始化项⽬
npm init -y
# 安装包
npm i -D webpack webpack-cli html-webpack-plugin webpack-dev-server
copy-webpack-plugin clean-webpack-plugin mini-css-extract-plugin
css-loader style-loader postcss-loader autoprefixer babel-loader @
babel/core @babel/preset-env
声明 src
index.js
// 暂时留空（不屑任何内容，但 index.js 这个⽂件必须存在）
index.ejs
<!DOCTYPE html>
lang=“en”>
charset=“UTF-8”>
http-equiv=“X-UA-Compatible” content=“IE=edge”>
name=“viewport” content=“width=device-width, initial-scal
e=1.0”>
<%</font><font style="color:rgb(255,0,0);">= </font><font style="color:rgb(111,66,193);">htmlWebpackPlugin.options.title %</font><font style="color:rgb(34,134,58);">></</font><font style="color:rgb(255,0,0);">title></font>
<font style="color:rgb(34,134,58);"><link </font><font style="color:rgb(111,66,193);">rel</font><font style="color:rgb(89,89,89);">=</font><font style="color:rgb(102,153,0);">“shortcut icon” </font><font style="color:rgb(111,66,193);">href</font><font style="color:rgb(89,89,89);">=</font><font style="color:rgb(102,153,0);">“./public/favicon.ico” </font><font style="color:rgb(111,66,193);">type</font><font style="color:rgb(89,89,89);">=</font><font style="color:rgb(102,153,0);">“ima </font>
<font style="color:rgb(102,153,0);">ge/x-icon”</font><font style="color:rgb(34,134,58);">></font>
<font style="color:rgb(34,134,58);"></</font><font style="color:rgb(255,0,0);">head> </font>
<font style="color:rgb(34,134,58);"><body> </font>
<font style="color:rgb(34,134,58);"><button </font><font style="color:rgb(111,66,193);">type</font><font style="color:rgb(89,89,89);">=</font><font style="color:rgb(102,153,0);">“button” </font><font style="color:rgb(111,66,193);">class</font><font style="color:rgb(89,89,89);">=</font><font style="color:rgb(102,153,0);">“btn btn-primary”</font><font style="color:rgb(34,134,58);">></font><font style="color:rgb(89,89,89);">Primary</font><font style="color:rgb(34,134,58);"></button> </font>
<font style="color:rgb(34,134,58);"><a </font><font style="color:rgb(111,66,193);">href</font><font style="color:rgb(89,89,89);">=</font><font style="color:rgb(102,153,0);">“index.html”</font><font style="color:rgb(34,134,58);">></font><font style="color:rgb(89,89,89);">⾸⻚</font><font style="color:rgb(34,134,58);"></a> </font>
<font style="color:rgb(34,134,58);"><a </font><font style="color:rgb(111,66,193);">href</font><font style="color:rgb(89,89,89);">=</font><font style="color:rgb(102,153,0);">“about.html”</font><font style="color:rgb(34,134,58);">></font><font style="color:rgb(89,89,89);">关于</font><font style="color:rgb(34,134,58);"></a> </font>
<font style="color:rgb(34,134,58);"><img </font><font style="color:rgb(111,66,193);">src</font><font style="color:rgb(89,89,89);">=</font><font style="color:rgb(102,153,0);">“<%= require(‘./image/icon/ok-black.png’) %>” </font><font style="color:rgb(111,66,193);">alt</font><font style="color:rgb(89,89,89);">=</font><font style="color:rgb(102,153,0);">“”</font><font style="color:rgb(34,134,58);">> </font>
<font style="color:rgb(34,134,58);"><script </font><font style="color:rgb(111,66,193);">src</font><font style="color:rgb(89,89,89);">=</font><font style="color:rgb(102,153,0);">“<a rel="nofollow" href="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jqu">https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jqu</a> </font>
<font style="color:rgb(102,153,0);">ery.min.js”</font><font style="color:rgb(34,134,58);">></script> </font>
<font style="color:rgb(34,134,58);"></body></font>
<font style="color:rgb(34,134,58);"></</font><font style="color:rgb(255,0,0);">html></font>
<font style="color:rgb(255,0,0);"></font>
<font style="color:rgb(255,0,0);"></font>
