JavaScript
@font-face {
font-family: "Effra-Regular";
src: url("~/assets/fonts/Effra-Regular.woff");
}
这种写法能加载字体,但是无法应用字体
JavaScript
@font-face {
font-family: "Effra-Regular";
src: url("@/assets/fonts/Effra-Regular.woff");
}
这种写法会报错,甚至无法通过编译
JavaScript
@font-face {
font-family: "Effra-Regular";
src: url("~@/assets/fonts/Effra-Regular.woff");
}
这种写法可以加载并应用字体
解释:
"~"是webpack中css-loader提供的导入资源语法
"@"是jsconfig.json/tsconfig.json配置的资源路径