vuecli3引入外部字体


1:

 

font.scss文件

@font-face {
font-family: 'kuhei'; //重命名字体名
src: url('./kuhei.ttf') ; //引入字体
font-weight: normal;
font-style: normal;
}
 
2:main.js
import '@/assets/fonts/font.scss'; // 引入字体样式
3:vue.config.js
const utils = {
assetsPath: function (_path) {
const assetsSubDirectory = process.env.NODE_ENV === 'production'
// 生产环境下的 static 路径
? 'static'
// 开发环境下的 static 路径
: 'static'
 
return path.posix.join(assetsSubDirectory, _path)
},
resolve: function(dir) {
return path.join(__dirname, '..', dir)
}
}

 

module:{
rules:[
{
test:/\.(woff2?|eot|ttf|otf)(\?.*)$/,
loader:'url-loader',
options:{
limit: 10000,
name: utils.assetsPath('fonrs/[name].[hash:7].[ext]')
}
}
]
},

 

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM