webpack.config.js
const path = require('path');
module.exports = {
entry: './src/index.js',
mode: 'development',
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'dist'),
},
module: {
rules: [
{
test: /\.css/,
use: [
'style-loader',
'css-loader'
]
},
{
test: /\.(woff|woff2|eot|ttf|otf)$/,
use: [
'file-loader',
]
},
],
},
};
src/style.css 问题出在这里,原来设置的是format('ttf') 后来改成format('truetype') 就好了。
@font-face {
font-family: 'MyFont';
src: url('./FuturaBT_Light.woff.ttf') format('truetype');
font-weight: bold;
font-style: normal;
}
.hello {
color: red;
font-size: 24px;
font-family: 'MyFont';
background: url('./icon.png');
}