sass - 如何配置 Next.js 以从 SCSS 文件导入数据 URL？

Question

我正在尝试将 Next.js 配置为与 Zurb 的基础站点一起使用。

基础 SCSS 包括一些背景图像的数据 URL。下面是一个例子：

background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="32" height="24" viewBox="0 0 32 24"><polygon points="0,0 32,0 16,24" style="fill: #{$rgb}"></polygon></svg>');

当 Next.js 编译 SCSS 时，它会尝试将文件路径添加到数据 URL，从而创建以下错误：

Module not found: Can't resolve './foundation/util/data:image/svg+xml;utf8,<svg xmlns="http:/www.w3.org/2000/svg" version="1.1" width="32" height="24" viewBox="0 0 32 24"><polygon points="0,0 32,0 16,24" style="fill: rgb(138, 138, 138)"></polygon></svg>'

有没有办法配置 Next.js 以便在编译 SASS 文件时将数据 URL 用作背景图像？

标签： sassnext.jszurb-foundation