前言: 其他资源可以有两种解读: 这里以图标为例: 阿里图标官网: https://www.iconfont.cn/ 在阿里图标官网下载你想要的字体图标 说明: 代码如下:1. webpack打包其他资源流程
1.1 webpack打包其他资源说明
1.2 下载字体图标
1.3 使用字体图标
<span class="iconfont icon-weixin"></span>
<span class="iconfont icon-ziyuan"></span>
<span class="iconfont icon-wodejianying"></span>
<span class="iconfont icon-shouyejianying"></span>
<span class="iconfont icon-sirendingzhi"></span>
1.4 字体图标的打包配置
module.exports = {
// ...
module:{
rules:[
{
test: /\.css$/,
use:["style-loader","css-loader"]
},
{
// 打包其他资源
// exclude 排除, 除了html,css,js文件外所有文件
// 都是用file-loader来处理, 包括字体图标
exclude: /\.(html|css|js)$/,
loader:"file-loader"
}
]
},
// ...
}