reactjs - 从 Next JS 中的节点模块导入 css 文件？

Question

我对 next.js 非常陌生。将其用于我的应用程序的服务器端渲染。

根据文档，您可以从应该位于根目录中的静态文件夹导入css文件，但我想从node_modules导入css，因为我已经扩展了 Bootstrap 并创建了自己的包。

Answer 1

这可能是您正在寻找的解决方案:

3 个简单步骤:

1. 安装 next-css 插件:

npm install --save @zeit/next-css

在根目录中创建 next.config.js，其中包含以下内容:

// next.config.js 
const withCSS = require('@zeit/next-css')

module.exports = withCSS({
  cssLoaderOptions: {
    url: false
  }
})

现在您应该能够从 node_modules 导入样式表，如下所示:

import 'bootstrap-css-only/css/bootstrap.min.css';

注意:使用 Next v 8+

其他解决方案是 next-css 可用之前的解决方案，但如上所示，现在有一个简单且受支持的解决方案。 它由核心团队成员之一提供:https://spectrum.chat/next-js/general/ignoring-folders-files-specifically-fonts~4f68cfd5-d576-46b8-adc8-86e9d7ea0b1f