javascript 字体真棒图标不显示
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/46109472/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Font awesome icon does not show
提问by Milos
I am working with Angular 4 in dev environment (localhost). I installed font awesome via npm and added:
我正在开发环境（本地主机）中使用 Angular 4。我通过 npm 安装了很棒的字体并添加了：
"./node_modules/font-awesome/css/font-awesome.css",
to my styles scripts.
到我的样式脚本。
When I check my icon in browser, everything looks fine:
当我在浏览器中检查我的图标时，一切看起来都很好：
But my icon does not appear on the page, just an empty square. What am I doing wrong?
但是我的图标没有出现在页面上，只是一个空方块。我究竟做错了什么？
回答by Chandru
its working code :
它的工作代码：
npm install font-awesome --save
npm install font-awesome --save
add font-awesome link in .angular-cli.json :
在 .angular-cli.json 中添加 font-awesome 链接：
"../node_modules/font-awesome/css/font-awesome.css"
in html file
在 html 文件中
<i class="fa fa-cog fa-spin"></i>
回答by Shanmugapriya D
link your font-awesome css and js file in your index.html or angular.cli
在 index.html 或 angular.cli 中链接你的字体很棒的 css 和 js 文件
Index.html
索引.html
<!-- Custom Fonts -->
<link href="your node font awesome location" rel="stylesheet" type="text/css">
angular-cli:
角度cli：
"styles": ['your node font awesome location']
回答by HD..
please add following code to your package.json
请将以下代码添加到您的 package.json
"dependencies": {
"font-awesome": "^4.7.0", // here I am saying use version 4.7 and above
}
if you are not using angular CLI, In your case cross check font-color I have seen the font is loaded but not appeared
如果您没有使用 angular CLI，在您的情况下交叉检查 font-color 我已经看到字体已加载但未出现
回答by distorsium
In my case I had to restart the server. In cli, where your server is running, press ctrl+cto close the server and after run ng serve --openor ng serveto open the server again.
就我而言，我不得不重新启动服务器。在运行服务器的 cli 中，按ctrl+c关闭服务器，运行后ng serve --open或ng serve再次打开服务器。
回答by Nithin mm
If you're using the free version. Try this..
如果您使用的是免费版本。试试这个..
First Delete fortawesome registry & authToken
首先删除fortawesome registry & authToken
npm config delete "@fortawesome:registry"
npm config delete "//npm.fontawesome.com/:_authToken"
Then Install the package
然后安装包
npm install --save-dev @fortawesome/fontawesome-free
After Installing the package, Add below code in your angular.json file
安装包后，在 angular.json 文件中添加以下代码
......
"styles": [
......
"node_modules/@fortawesome/fontawesome-free/css/all.css"
],
"scripts": [
....
"node_modules/@fortawesome/fontawesome-free/js/all.js"
],
.....
Note: There were twice of those blocks (styles/scripts). Add to both
注意：有两次这些块（样式/脚本）。两者都加
回答by Ab Wahab Achakzai
In case none of the above tips worked, then uninstall the latest one and install the 4th version of fontawesome and you are good to go. https://fontawesome.com/v4.7.0/icon/trash
如果上述提示均无效，请卸载最新的并安装第 4 版的 fontawesome，您就可以开始使用了。 https://fontawesome.com/v4.7.0/icon/trash
