使用前端框架搭建网页时，所有的小图标都无法显示，可能是什么原因？

[black11black]

如题，我是前端菜鸡，但正享受着框架+css 开发模板带来的光速开发的爽感中

遇到一个问题，我使用的框架是 vue，脚手架创建项目后，npm 安装了 css 模板，又在 mainjs 里载入，一切工作正常 但是发现所有图标都不能用，也就是红色箭头指的这部分，我在本地运行的时候是不显示的。

基础不牢地动山摇，不太懂为啥不显示，有没有带佬指点一下

css 模板地址： https://buefy.org/documentation/input

[1KN6sAqR0a57no6s]

https://buefy.org/documentation/start

看最开始的 Icons，你引入了吗。

[black11black]

@YuxiangLuo

感谢带佬，确实没有引入。还想请问一下，他的说明看不太懂，

<link rel="stylesheet" href="https://cdn.materialdesignicons.com/2.5.94/css/materialdesignicons.min.css">

为什么引入是写成这种形式的，我试了试在组件的 template 部分引入这一行的话是无法引入 css 的，正确的载入姿势是什么？

还有一个问题是，我看网上教学说

<style scoped>
</style>

加入这个属性之后父组件的样式就不会影响子组件了，子组件会恢复正常。但是我试了试发现仍然会影响子组件啊，一脸懵逼。

是不是因为我不是直接写的 css，而是使用了 @import "..."载入外部 css 文件，所以导致 scoped 失效的？

[1KN6sAqR0a57no6s]

link 标签的引入是要编辑 index.html 文件（应该在项目根目录），在 head 标签对里加上那行就行了。

第二个问题我记不太清了，等别人回答吧。

[ss098]

Bulma 引用的是第三方的 icon 图标包，所以需要额外引入 CSS，可以 npm 安装后在 scss 文件（或者 vue style 部分）中如下命令引入，或者使用 link 标签。

@import '~bulma';

[black11black]

@YuxiangLuo

index.html...vue?

[black11black]

@black11black

不好意思,确实有 index.html,都忘了