Question

我正在使用Webpack 4，并且尝试使用bootstrap 4 sass网格，我的方法是将Bootstrap网格类与HTML分离，以便尝试导入网格mixins和网格本身。为了在我的sass组件中使用bootstrap mixins，但是由于某些原因，当我从node__modules文件夹导入它们时，我无法到达bootstrap mixins：

这是文件（app.scss），其中，我从node_modules导入了所有文件：

 //----------------------------------*\
// BOOTSTRAP VARIABLES OVERRIDE
// AVOID BOOTSTRAP GRID TO BE GENERATED
//----------------------------------*/
$enable-grid-classes: false;

//----------------------------------*\
// BOOTSTRAP CORE
//----------------------------------*/
@import "../../node_modules/bootstrap/scss/_functions.scss";
@import "../../node_modules/bootstrap/scss/_variables.scss";
@import "../../node_modules/bootstrap/scss/_mixins.scss";

//----------------------------------*\
// BOOTSTRAP GRID
//----------------------------------*/
@import "../../node_modules/bootstrap/scss/_grid.scss";

这是grid.scss文件，我在其中尝试使用引导程序mixins.scss中的mixins：

.grid-container {
  @include make-container();
  @include make-container-max-widths; 
}

我有一个scripts.js文件，它同时导入两个文件（请注意，styles.scss导入了.grid-container：

 //----------------------------------*\
// LIBRARIES COMPONENTS
//----------------------------------*/
import "../scss/app.scss";

//----------------------------------*\
// LAYOUT, THEME & COMPONENTS
//----------------------------------*/
import "../scss/style.scss";

这是我得到的错误：

ERROR in ./src/scss/style.scss (./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js??ref--5-4!./src/scss/style.scss)
    Module build failed (from ./node_modules/sass-loader/lib/loader.js):

      @include make-container();
              ^
          No mixin named make-container
          in C:\Users\jpi\Documents\Proyectos\IMI\imienxarxa\Documentos\frontend\src\scss\layout\_grid.scss (line 2, column 12)

就像Webpack一样，我不会在任何时候导入这些引导混合，而是将所有它们都导入一个不同的文件（app.scss）中。

更新：

如果我实际上是从app.scss导入_grid.scss的（我在其中导入所有引导mixins的文件），我真的很困惑为什么它不能以其他方式工作，因为所有内容都包含在单个css文件中在末尾。任何帮助将不胜感激。

仅在使用BS Grid时Webpack 4不导入Bootstrap mixins

0 个答案: