logo标签列表

在一个Vue组件中仅引入外部CSS库

cssvue.jsfont-awesomevue-component
4

我有一个包含许多组件的Vue应用程序。目前，在index.html文件的头部中已经包含了Font-Awesome，但实际上只有一个页面或组件需要它。是否可能将其移动到组件本身中，以便仅在需要时加载？

将其移动到组件中

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">

TO THIS

<template></template>
<link rel="stylesheet" href="../../static/css/font-awesome-4.7.0/css/font-awesome-min.css"></link>
<script>
    export default {
        name: 'SingleComponent',
        data: function() {
            return{}
        }
    }
</script>
<style scoped>
</style>

我尝试下载 Font-Awesome 并在组件中添加类似上面的链接标签^^^^，没有出现任何错误，但图标仍然无法工作。

如何在Vue中添加这段代码？<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css"> - josue
3个回答
11

在App.js的style标签中导入CSS文件

<style>
@import './static/css/style.css';
</style>
0

如果你只有一个页面或组件，那么在<template />和<html />标签中创建所需内容会更容易吧？

不，我有许多组件，但只有一个需要Font-Awesome。 - Linx
-5

与其尝试直接在组件中包含 Font-Awesome，我发现已经有一个名为vue-awesome的 Vue 包装器，所以我使用了它。

这不是一个答案。 - Hybrid web dev
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接