angular - 如何在 Angular 组件中使用 ionicons？

Question

我正在尝试将 ionic 图标添加到我的 Angular 4 应用程序中。以下是采取的步骤:

1. 在http://ionicons.com/我下载了 zip 文件并将其解压缩。
2. 我在我的 Angular 项目中创建了一个名为 icons
的新文件夹
3. 我从将压缩包解压缩到我的新 icons 文件夹中。
4. 在项目的 index.html 文件中，我添加了 css 文件。
5. 现在在我预先创建的页脚组件中，我尝试使用图标。
6. 我在 index.html 文件中收到有关我的路径的服务器错误。

我错过了什么吗？

Answer 1

在 angular 6.3.x 和 npm 6.1.x 中获得 ionicons 的方法......

1. 打开您的项目文件夹，打开您选择的支持 npm 的命令行工具，然后调用 npm install ionicons@latest --save
2. 确保类似于 "ionicons": "^4.2.4" 的内容将自动出现在您的项目依赖项中 package.json
3. 添加"node_modules/ionicons/dist/scss/ionicons.scss"在 "styles": [] 下你的angular.json里面的部分
4. 添加<span class="ion ion-md-attach"></span>在你的app.component.html或 index.html或您选择的任何标记文件
5. 享受=)