Webpack 在网页包中使用@extend

我在我的webpack设置中使用bootstrap节点包，并在我的入口点

app.js

将其与其他模块一起导入，如下所示：

import 'bootstrap';
import 'font-awesome-loader';
import './assets/scss/app.scss';
console.log('Its working just fine!');

我的

/assets/scss/app.scss

文件导入其他

.scss

文件，并在这些文件中使用

@extend

扩展引导

.container

类：

 .banner {

  @extend .container;

  &__logo-holder {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 2rem 0;
  }

  // and so on ...
}

我在编译时遇到以下错误：

@extend .container;
         ^
      ".banner" failed to @extend ".container".
The selector ".container" was not found.

---

使用Webpack时是否可以使用@extend？我认为使用gulp是理所当然的。

您需要在

/assets/scss/app.scss

中直接导入引导，我认为gulp sass在传递给sass的

数据

选项中包含每个文件的源代码，使所有内容都可以全局访问。