我刚刚安装了font-awesome-webpack。我使用以下方式导入它：require("font-awesome-webpack");
我的webpack配置在模块加载器数组中包含以下内容：
{ test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader?limit=10000&minetype=application/font-woff" },
{ test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "file-loader" }
问题是我在开发人员控制台中遇到此错误：
localhost/:1 GET http://localhost/mysite/app/db812d8a70a4e88e888744c1c9a27e89.woff2
localhost/:1 GET http://localhost/mysite/app/a35720c2fed2c7f043bc7e4ffb45e073.woff
localhost/:1 GET http://localhost/mysite/app/a3de2170e4e9df77161ea5d3f31b2668.ttf 404 (Not Found)
问题是，这些文件是在根目录（在mysite目录中）创建的。如何配置这些woffs和ttf在mysite / app目录中输出？
我最近想用用的WebPack V1字体真棒，我已经安装了NPM模块font-awesome不font-awesome-webpack
您必须在以下位置安装一些装载机：
npm i css-loader file-loader style-loader url-loader
并在webpack.config.js中添加使用它们：
module: {
loaders: [{
test: /\.css$/,
loader: 'style!css?sourceMap'
}, {
test: /\.woff(\?v=\d+\.\d+\.\d+)?$/,
loader: "url?limit=10000&mimetype=application/font-woff"
}, {
test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/,
loader: "url?limit=10000&mimetype=application/font-woff"
}, {
test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
loader: "url?limit=10000&mimetype=application/octet-stream"
}, {
test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
loader: "file"
}, {
test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
loader: "url?limit=10000&mimetype=image/svg+xml"
}]
}
现在，如果您包括在entry.js：
require('font-awesome/css/font-awesome.css');
通常，您可以在模板中使用font-awesome：
<i class="fa fa-times"></i>
这个要点帮助了我：https : //gist.github.com/Turbo87/e8e941e68308d3b40ef6
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句