javascript - 如何在 Next.js 中关闭 CSS 模块功能？

Question

Next.js 只允许在 _App.js 中导入全局 CSS。但是我们不能在每个组件中都导入全局 CSS，因为我们必须按照 Next.js 的限制使用 CSS 模块。
现在我正在将一个大型元素迁移到 Next.js，并且很难将每个模块的 css 转换为 CSS 模块。 有什么办法可以消除这个限制吗？
限制文档链接: https://nextjs.org/docs/messages/css-global

Answer 1

我希望回答这个问题不会让我们迟到。您实际上可以通过编辑 next.config.js 来篡改 Webpack 配置。文件如下:

const path = require('path');

const nextConfig = {
  webpack(config) {
    // if not work, try `config.module.rules[2]...`
    config.module.rules[3].oneOf.forEach((one) => {
      if (!`${one.issuer?.and}`.includes('_app')) return;
      one.issuer.and = [path.resolve(__dirname)];
    });
    return config;
  },
};

module.exports = nextConfig

这是引用: Disable CSS Modules in Next.js project