小编lia*_*ris的帖子

字体加载器 postcss

我无法使用 postcss 加载字体。

我的 src 目录中有字体文件,如下所示: https ://i.stack.imgur.com/KYCym.png

我的 css 文件如下所示:

@font-face{
    font-family: Boxley ;
    src: url(./fonts/Boxley.ttf), format('ttf');
}
@font-face{
    font-family: Boxley-Bold;
    src: url(./fonts/Boxley-Bold.ttf), format('ttf');
}
Run Code Online (Sandbox Code Playgroud)

等等。我的 Postcss.config.js 看起来像这样:

module.exports = {
    plugins: [
        require('precss'),
        require("css-mqpacker"),
        require("postcss-cssnext"),
        require("cssnano"),
        require("rucksack-css"),
        require("postcss-font-magician")({
        hosted: ['./src/css/fonts']
    })]
}
Run Code Online (Sandbox Code Playgroud)

我的 webpack 文件如下所示:

module: {
    rules: [{   
            test: /\.js$/,
            exclude: /node_modules/,
            use: {
                loader: "babel-loader"
            }
        },
        { 
            test: /\.(png|woff|woff2|eot|ttf|svg|otf)(\?v=[0-9]\.[0-9]\.[0-9])?$/, 
            loader: 'url-loader?limit=100000' 
        },
        {
            test: /\.css$/,
            loaders:ExtractTextPlugin.extract(['css-loader', 'postcss-loader']),
        },
        {
            test: /\.scss$/,
            loaders: ExtractTextPlugin.extract(['css-loader', 'postcss-loader']),               
        }, …
Run Code Online (Sandbox Code Playgroud)

css fonts reactjs webpack postcss

5
推荐指数
1
解决办法
5691
查看次数

标签 统计

css ×1

fonts ×1

postcss ×1

reactjs ×1

webpack ×1