如何使用 nextjs 和 sass 导出到静态网站？

Question

我最近开始学习 nextjs/react，但在尝试将我的应用程序导出到静态站点时，无法遵循官方 nextjs 网站上的教程：

我正在使用 sass 来设置应用程序的样式，当我尝试运行 npm run build 脚本时，它抛出一个错误

Module parse failed: Unexpected token (1:0) You may need an appropriate loader to handle this file type.

我检查了我的代码结构和设置，但无法找出问题所在。看起来错误与 sass 加载程序有关？任何指针将不胜感激。

下面是我的设置的一些屏幕截图。

Answer 1

您需要添加 sass-loader 依赖项。

npm i -D sass-loader

然后像这样添加：

config.module.rules.push(
  {
    test: /\.s(a|c)ss$/,
    use: ['babel-loader', 'raw-loader',
      { loader: 'sass-loader' },
    ],
  },
);

Answer 2

您的 next.config.js 中有两个 module.exports 无效。

也许尝试将配置传递给 withSass 并导出它...

module.exports = withSass({ exportPathMap: /* ... etc ... */ })

how to export to static website using nextjs and sass?