css - SCSS Webfont (Font Awesome) 使用 Webpack 编译损坏
问题描述
在 SCSS 中编译字体内容声明时,输出已损坏。sass-loader 并没有像我期望的那样输出字符转义序列,而是content: \f26e;
输出单个无法显示的字符,表示为正方形,例如,content: "";
这些字符既可以在 js 包中找到,也可以在提取的 CSS 中找到。
您可以在 Font Awesome 节点包附带的 CSS 中清楚地看到它应该如何写入文件
.fa-500px:before {
content: "\f26e"; }
它是如何写入我的文件的
.fa-500px:before {
content: "";
}
当我发现这个问题时,我正试图从 Font Awesome 样式中构建样式。我决定尝试重新编译 Font Awesome,但问题仍然存在。我四处搜索并没有找到任何表明我做错的资源,但这是我的假设,而不是 Webpack sass-loader 有问题。
我创建了一个演示该问题的存储库:https ://github.com/rlvandaveer/sass-loader-fontawesome-gist
解决方案
深入研究这一点,我确定这实际上不是问题。上述两种情况是等价的。第一个是 ASCII 转义码,第二个是相应的文字 unicode 字符(未正确呈现)。示例 repo 使用 dart sass 实现,它的运行方式与我习惯的 node-sass 实现不同。这个 dart-sass 问题证实了两种实现之间的差异。
希望这个答案可以使某人免于类似的 n00by 困惑。
推荐阅读
- python - Pandas 滚动 Python 以创建新列
- php - 如何使用 2 个输入文件创建多个上传文件
- javascript - firebase 函数通过流从网络上传文件仅部分工作
- groovy - groovy:: 复合 if 语句不评估为真
- javascript - 如何获取角度可观察的状态码
- installation - 错误:grub-efi-amd64-已在 Ubuntu 20.04 中签名。尝试安装软件包
- r - 如何在 R 中获取具有长格式数据框的组之间的差异?
- json - 无法进入 json 数据对象
- javascript - 如何从前端使用 AWS CloudWatch Logs 提交简单日志?
- javascript - 插入 HTML 时Javascript 将“ ”更改为“ ”的问题