我正在使用Parcel进行打包,我想将自定义字体包含到我的项目中
在我的SCSS文件中
@font-face {
font-family: "Storytella";
src: url("./fonts/Storytella.otf") format("otf");
}
然后我会在某个地方使用它,就像这样
字体族:'Storytella',衬线字体;
package.json
{
"name": "pr",
"version": "1.0.0",
"description": "",
"main": "index.js",
"dependencies": {
"normalize.css": "^8.0.1",
"parcel-bundler": "^1.12.3"
},
"devDependencies": {
"node-sass": "^4.12.0",
"parcel-plugin-static-files-copy": "^2.2.0",
"pug": "^2.0.4"
},
"scripts": {
"dev": "parcel index.pug",
"build": "parcel build index.pug --out-dir dist"
},
"staticFiles": {
"staticPath": "dist",
"watcherGlob": "**"
},
"keywords": [],
"author": "",
"license": "ISC"
}
在运行
npm run dev
时,字体文件会被放置在 dist
文件夹中,但字体本身不会加载到页面中。在 Chrome 的网络面板中没有错误或其他任何加载字体的信息。