How to use Ali iconfont online links in vue-cli?

use vue-cli as the project and use the Ali icon font icon.
is used as fontclass.
Link has been obtained / / at.alicdn.com/t/font_xxxx_xxxx.css

in a project, if the file is downloaded locally, then import css, is used normally in main.js.
but I don"t know how to use this online link.
has tried to import this link in main.js, and
has also tried to introduce css, in index.html in the original way.
doesn"t know how to use it.

add:
write in index.html like this
< link rel= "stylesheet" href= "/ / at.alicdn.com/t/font_xxxx_xxxx.css" >
No error, icon will be displayed as a box
in mian.js import will prompt me for npm install address, icon will not show

at all

use in tempate
< I class= "iconfont el-icon-third-profile" > < / I >

Iconfont vue-cli

Apr.14,2021

replace it with htts.

displays in the box because you did not load the CSS file. Check whether the loading failed in the console loading file

online comparison recommends the introduction of Symbol

step 1: copy the symbol code generated under the project:
/ / at.alicdn.com/t/font_xxxxxxxxx.js
step 2: add the generic css code (just introduce it once):
< style type= "text/css" >

.icon {
   width: 1em; height: 1em;
   vertical-align: -0.15em;
   fill: currentColor;
   overflow: hidden;
}

< / style >
step 3: select the appropriate icon and get the class name, and apply it to the page:
< svg class= "icon" aria-hidden= "true" >

<use xlink:href="-sharpicon-xxx"></use>

< / svg >

< link rel= "stylesheet" type= "text/css" href= "/ / at.alicdn.com/t/xxx.css" >

Previous: Linux apache is configured with ssl to enable https access successfully, but only the home page can be accessed.

Next: How to render the error message of the Django database in the foreground

How to use the symbol reference method of iconfont in vue-cli
has been using vue-cli as a project recently, and the symbol reference recommended by the Ali icon library cannot be used directly in the project. Looking at the iconfont.js file, it is found that it is an anonymous immediate execution function ,expo...

Iconfont vue-cli javascript

Mar.19,2021