当我在 NextJs 中使用 Sass 文件时，我收到来自 mini-css-extract-plugin 的“conflicting order”警告。冲突总是搞乱我在build 上的样式。您可以看到以下链接中描述的错误：
这是一篇解决此问题的文章，但它讨论了仅为一页订购 Sass 文件。当有多个页面时，我不确定如何订购。我该如何解决conflicting order 问题？
【问题讨论】：
标签： reactjs webpack sass next.js mini-css-extract-plugin
如果您使用的是 nextjs 9.3 或更高版本，您可以像使用 css 模块一样使用它。至少这是他们建议您这样做的方式。
这是example。
您还可以查看 Next.js 文档中的 Sass support。
-- 更新
最好的方法是为每个组件创建一个不同的 scss 模块。它看起来像这样。
Components
├── Header
│ ├── Header.js
│ ├── Header.module.css
├── Footer
│ ├── Footer.js
│ ├── Footer.module.css
├── Nav
│ ├── Nav.js
│ ├── Nav.module.css
使用 css 模块的主要思想是防止您使用全局工作表。这样css将在组件代码拆分上得到优化，您不必担心两次声明同一个类，每个css模块文件都会生成一个唯一的类名。
我正在做一个使用 css 模块的项目，该项目还没有完成，但是文件结构与使用 sass 几乎相同，如果你愿意，你可以看看。
【讨论】：