vue打包后出现的bug http://localhost:3000/static/css/static/fonts/mui-icons-extra.683f395.ttf 404

本文介绍了解决在使用Webpack进行项目打包时遇到的ttf字体文件加载失败问题的方法。通过在webpack.base.config.js配置文件中正确设置loader,可以有效处理不同类型的静态资源,确保项目正常运行。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

ERROR in ./static/mui/fonts/mui.ttf 1:0
Module parse failed: Unexpected character ‘’ (1:0)
You may need an appropriate loader to handle this file type.
(Source code omitted for this binary file)
@ ./static/mui/css/mui.css (./node_modules/css-loader!./static/mui/css/mui.css) 7:103162-103189
@ ./static/mui/css/mui.css
@ ./src/index.js
通过webpack打包是包上述错误。解决方案:在配置文件webpack.base.config.js中添加ttf结尾的文件依赖的loader


module:{
    rules:[
        {
            test:/\.css$/,
            use:[
                'style-loader',
                'css-loader'
            ]
        },
        {
            test:/.(png|gif|jpg|svg|ttf)$/,
            use:[
                'file-loader'
            ]
        }
]

}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值