无法在 Gatsby 项目中使用 react-suite

如何解决无法在 Gatsby 项目中使用 react-suite

我刚刚开始使用 Gatsby 进行开发（或一般做前端），我想使用 React Suite 向我的网站添加导航栏。但是，在我的 index.js 中导入相应的样式表时：

import 'rsuite/lib/styles/index.less';

我在运行 gatsby develop 时收到以下消息：

ERROR #98124  WEBPACK
Generating development JavaScript bundle Failed
Can't resolve 'rsuite/lib/styles/index.less' in '/Users/.../src/pages'

If you're trying to use a package make sure that 'rsuite/lib/styles/index.less' is installed. If you're trying to use a local file make sure that the path is correct.

File: src/pages/index.js:14:0

Failed Building development bundle - 7.237s
ERROR in ./src/pages/index.js 14:0-38
Module not found: Error: Can't resolve 'rsuite/lib/styles/index.less' in '/Users/.../src/pages'
@ ./.cache/_this_is_virtual_fs_path_/$virtual/async-requires.js 31:11-33:5
@ ./.cache/app.js 17:0-52 28:0-70 30:27-40 28:0-70

webpack compiled with 1 error

我已经尝试了很多东西：安装和重新安装rsuite，安装和重新安装gatsby-plugin-less和less，清除缓存，尝试gatsby-config.js中的各种配置，但我真的别无选择。

同时，安装react-bootstrap并通过

类似的方式导入样式表

import "bootstrap/dist/css/bootstrap.min.css";

不会产生错误并且样式表被应用。

非常感谢您的帮助！

解决方法

我认为你应该使用：

import '~rsuite/lib/styles/index.less';

注意 ~，因为它是从 the docs 推断出来的。

,

你可以试试这个：

import "rsuite/src/styles/themes/default/index.less"

https://github.com/rsuite/rsuite/blob/next/examples/with-gatsby/src/pages/index.js#L4