報錯信息如下:
Uncaught Error: Cannot find module '../fonts/sell-icon.eot?k5xf13' at webpackMissingModule (index.scss?9c8b:7) at eval (index.scss?9c8b:7) at Object../node_modules/css-loader/index.js?!./node_modules/postcss-loader/src/index.js?!./node_modules/sass-loader/lib/loader.js?!./src/common/scss/index.scss (app.js:4837) at webpack_require (app.js:724) at fn (app.js:101) at eval (index.scss?ab6e:4) at Object../src/common/scss/index.scss (app.js:10066) at webpack_require (app.js:724) at fn (app.js:101) at eval (main.js:13)
網上查了下,原來 woff2桶蝎、eot驻仅、ttf、otf登渣,在webpack中配置的是url-loader噪服,然而在icon-font.scss中卻寫的是url,只要都改成url-loader就可以了胜茧。
@font-face {
font-family: 'sell-icon';
src: url-loader('../fonts/sell-icon.eot?k5xf13');
src: url-loader('../fonts/sell-icon.eot?k5xf13#iefix') format('embedded-opentype'),
url-loader('../fonts/sell-icon.ttf?k5xf13') format('truetype'),
url-loader('../fonts/sell-icon.woff?k5xf13') format('woff'),
url-loader('../fonts/sell-icon.svg?k5xf13#sell-icon') format('svg');
font-weight: normal;
font-style: normal;
}
Tips:vue-cli3 對webpack進行了處理粘优,它不會把配置文件暴露出來,你可以通過 vue inspect > output.js 將配置信息輸出到一個文件進行查看呻顽,但要修改其中配置需要在vue.config.js中修改覆蓋默認設置