将css加载器添加到next.config.js

raogr8fs  于 2023-08-04  发布在  其他
关注(0)|答案(2)|浏览(99)

现在我有这个next.config.js

const withCSS = require('@zeit/next-css')
const withLess = require('@zeit/next-less')
const withSass = require('@zeit/next-sass')

if (typeof require !== 'undefined') {
  require.extensions['.less'] = () => {}
}

module.exports = withCSS(
  withLess(
    withSass({
      lessLoaderOptions: {
        javascriptEnabled: true,
      },
    })
  )
)

字符串
我试图使用react-rce,但在文档中,他们说我需要添加一个style-loader到我的webpack配置。
例如

module: {
    rules: [
      {
        test: /\.css$/i,
        use: ['style-loader', 'css-loader'],
      },
    ],
  },


但我不知道如何将其添加到我当前的文件中。有什么想法吗
谢啦,谢啦

8zzbczxx

8zzbczxx1#

您可以在文件中添加额外的css-loader模块规则,如下所示:

const withCSS = require('@zeit/next-css')
const withLess = require('@zeit/next-less')
const withSass = require('@zeit/next-sass')

if (typeof require !== 'undefined') {
  require.extensions['.less'] = () => {}
}

module.exports = withCSS(
  withLess(
    withSass({
      lessLoaderOptions: {
        javascriptEnabled: true,
      },
      webpack: config => {
        config.module.rules.push(
          {
            test: /\.css$/i,
            use: ['style-loader', 'css-loader'],
          }
        );
        return config;
      }
    })
  )
)

字符串

c0vxltue

c0vxltue2#

你需要安装css-loader,npm i css-loader。如果您使用NextJs。触摸next.config.js文件并添加以下代码,保存并重新启动服务器。

module: {
      rules: [
        {
          test: /\.css$/i,
          use: ["style-loader", "css-loader"],
        },
      ],
    },
  },

字符串

相关问题