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

1.上传svg图标

在这里插入图片描述

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

使用阿里图标库Iconfont生成字体图标_第1张图片
根据需求选择无填充色上传

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

在这里插入图片描述

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

使用阿里图标库Iconfont生成字体图标_第2张图片

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: ['.*']
    }]),
],

你可能感兴趣的:(CSS)