使用阿里图标库Iconfont生成字体图标

时间:2024-02-16 08:02:32

1.上传svg图标

在这里插入图片描述

2.将做好的svg图标拖拽到指定位置

在这里插入图片描述
根据需求选择无填充色上传

3.下载上传好的文件到本地

在这里插入图片描述

4.解压后,将iconfont.css复制到项目指定位置

在这里插入图片描述

5.在根目录下index.html引入

在这里插入图片描述

6.webpack打包配置项

plugins: [
    happy_pack(\'js\', [\'babel-loader?cacheDirectory=true\']),
    new MiniCssExtractPlugin({
      filename: `${resource}/css/[name].[hash].css`,
      chunkFilename: `${resource}/css/[id].[hash].css`
    }),
    //iconfont.css 拷贝到指定位置
    new CopyWebpackPlugin([{
      from: path.resolve(\'src/assets/iconfont.css\'),
      to:`${resource}`,
      ignore: [\'.*\']
    }]),
],