vue-cli引入外部字体，自定义名称应用到全局

vue-cli引入外部字体，自定义名称应用到全局

1、src/assets下新建文件夹fonts，将所有外部字体文件放入其中

2、fonts下新建与字体同级的文件font.css，引入字体并定义名称：

@font-face {
    font-family: 'Montserrat-Regular';  /* 自定义字体名称 */
    src: url('Montserrat-Regular-8.otf');  /* 字体文件名 */
}

@font-face {
    font-family: 'MicrosoftYaHei-Bold';
    src: url('MSYH_Bold.ttf');
}

3、在main.js中引入该css文件：

import './assets/fonts/font.css'

4、应用字体到全局，直接书写定义好的名称：

h1 {
  font-family: 'MicrosoftYaHei-Bold'; 
}