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

【问题标题】：How to include Bootstrap in container specific scss?如何在容器特定的 scss 中包含 Bootstrap？
【发布时间】：2018-03-22 13:16:50
【问题描述】：

我正在努力升级到最新版本的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"; 之类的引导项？还是我做错了？

【问题讨论】：

标签： javascript node.js twitter-bootstrap reactjs reactstrap

【解决方案1】：

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

【讨论】：