vue工程中使用iconfont在线CDN不生效的问题

最新推荐文章于 2022-10-11 16:19:23 发布

adz41455

最新推荐文章于 2022-10-11 16:19:23 发布

阅读量1.3k

点赞数

文章标签： javascript 运维 ViewUI

原文链接：http://www.cnblogs.com/wenqiangit/p/10535736.html

版权

为什么在vue工程中引入iconfont有时候不生效呢？

请依次使用以下方法

1. 在index.html中引入在线资源

<!DOCTYPE html>
<html lang="en" style='height: 100%;'>

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
  <link rel="icon" href="<%= BASE_URL %>favicon.ico">
  <!-- 引入下面这个cdn资源 -->
  <link rel="icon" href="//at.alicdn.com/t/font_918300_q5yxfof3wjo.css">

  <title>vue-shop-front</title>
</head>

<body style='height: 100%;'>
  <noscript>
    <strong>We're sorry but vue-shop-front doesn't work properly without JavaScript enabled. Please enable it to
      continue.</strong>
  </noscript>
  <div id="app"></div>
  <!-- built files will be auto injected -->
</body>

</html>

2. 在mainjs中使用Vue.use()引入

Vue.use('//at.alicdn.com/t/font_918300_q5yxfof3wjo.css')

3. 在App.vue中import引入（前提是你得使用了预处理器）

<style lang="scss" scoped>
@import url("//at.alicdn.com/t/font_918300_q5yxfof3wjo.css");
#wrap-box {
  height: 100%;
  // height: 1000px;
}
</style>

转载于:https://www.cnblogs.com/wenqiangit/p/10535736.html

adz41455

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
vue工程中使用iconfont在线CDN不生效的问题

为什么在vue工程中引入iconfont有时候不生效呢？请依次使用以下方法1. 在index.html中引入在线资源<!DOCTYPE html><html lang="en" style='height: 100%;'><head> <meta charset="utf-8"> <meta http-equi...
复制链接

扫一扫