问题描述
我将 laravel 与 webpack.mix 一起使用,并将公共Google字体导入到 app.scss 文件中:
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500&display=swap');
(第一个字符串中没有空格或换行符!)
Webpack.mix 命令看起来很常见:
mix.js('resources/js/app.js','public/js').sourceMaps()
.sass('resources/sass/app.scss','public/css');
并将此 s css 文件转换为 css 。 但是在CSS中我得到了:
@import url(https://fonts.googleapis.com/css2?family=Rubik:wght@300;
400;500&display=swap);
这个奇怪的换行符从何而来?!浏览器无法以这种方式看到字体=
我试过npm run dev,run prod。检查原始字符串20次...
解决方法
解决方法是在链接中使用 %3b
而不是 ;
。
参考:https://github.com/JeffreyWay/laravel-mix/issues/2430#issuecomment-653915587