如何在容器特定的scss中包含Bootstrap？

Question

我正在努力升级到最新版本的reactstrap和Bootstrap，我曾经在我的package.json中使用：reactstrap，并在我的client / src / styles / bootstrap目录中下载了bootstrap SCSS。

我现在在我的package.json中：

"reactstrap": "^5.0.0-alpha.3",
"bootstrap": "^4.0.0-beta",

对于我的容器和组件特定的SCSS文件，这曾经工作：

home.jsx：

import '../styles/home/Home.css'

home.scss

@import "../bootstrap/variables";
@import "../bootstrap/custom";
@import "../bootstrap/mixins/breakpoints";

@include media-breakpoint-down(sm) {
    ...
}

新的reactstrap和Bootstrap不再提供这些@import文件。如何导入像@import "../bootstrap/mixins/breakpoints";这样的引导程序？或者我这样做是错的？

Answer 1

您需要从node_modules目录中的引导程序模块导入文件。所以从你的根目录的路径将是node_modules/bootstrap/scss/mixins/breakpoints。