Vue 导入 iconfont图标显示方块

琢磨很久，都不知道哪里有问题，然后重新写和粘贴代码走了一遍

把iconfont图标，放进自己新建的iconfont.css里面

iconfont.css内容

@font-face {
    font-family: "iconfont";
    src: url('//at.alicdn.com/t/font_2429860_od9norre75.eot');
    src: url('//at.alicdn.com/t/font_2429860_od9norre75.eot?#iefix') format('embedded-opentype'),
        url('//at.alicdn.com/t/font_2429860_od9norre75.woff2') format('woff2'),
        url('//at.alicdn.com/t/font_2429860_od9norre75.woff') format('woff'),
        url('//at.alicdn.com/t/font_2429860_od9norre75.ttf') format('truetype'),
        url('//at.alicdn.com/t/font_2429860_od9norre75.svg#iconfont') format('svg');
}

.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

图标获取的阿里云url（减少本地文件夹存储）

在main.js 全局引用

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

import './style/iconfont.css'

createApp(App).use(store).use(router).mount('#app')

class名 一定要写对 iconfont ， 是图标代码

<div class="docker_item">
      <div class="iconfont">&#xe67d;</div>
      首页
    </div>
</div>

最终效果：