angualr项目引入icon报错及解决办法Uncaught Error:[@ant-design/icons-angulan]:the icon snippets-o does not exist

angualr项目中想用ng-zorro库里的icon和图片两种方法

【1】在angualr.json中去动态引入

"assets": [
              "src/favicon.ico",
              "src/assets",
              {
                "glob": "**/*",
                "input": "./node_modules/@ant-design/icons-angular/src/inline-svg/",
                "output": "/assets/"
              }
            ],

【2】静态引入,适用于angualr项目打包后想直接套用到其它项目动态引入依然报错的解决办法

在app.modules.ts文件中去静态引入你想要使用的每一个icon

import {
  UserOutline,
  DollarCircleOutline,
  SnippetsOutline,
  SolutionOutline,
  CloseCircleTwoTone,
  PlusOutline,
  DeleteOutline,
  DownloadOutline,
  ContainerOutline,
  CheckCircleOutline,
  FileSearchOutline,
  FormOutline,
  AuditOutline,
  FileDoneOutline,
} from "@ant-design/icons-angular/icons";
import { NzIconModule } from "ng-zorro-antd/icon";


@NgModule({
  declarations: [AppComponent],
  imports: [
    NzIconModule.forChild([
      UserOutline,
      DollarCircleOutline,
      SnippetsOutline,
      SolutionOutline,
      CloseCircleTwoTone,
      PlusOutline,
      DeleteOutline,
      DownloadOutline,
      ContainerOutline,
      CheckCircleOutline,
      FileSearchOutline,
      FormOutline,
      AuditOutline,
      FileDoneOutline,
    ]),
  ],
})

对应这里面的iconNG-ZORRO - Angular UI component library

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值