Css Webpack Sass和基金会如何操纵变量

我正在使用webpack进行一个项目，以加载我的所有资产

我在

app.js

中这样加载我的资产，并使用

ExtractTextPlugin

对它们进行压缩：

导入'foundation sites/scss/normalize.scss'；
导入“foundation sites/scss/foundation.scss”；
导入“/../sass/app.scss”

我在某个地方读到，webpack将读取每一行，并逐个编译为CSS，然后将它们附加到我的dist文件中

我的问题是，我想从App.SCSS中访问基础中的变量和MIXIN，但是因为它们是一个接一个地被编译和追加的，所以访问这些混合变量和变量似乎是不可能的。任何人都有解决方案吗？
您需要在
app.scss
中加载依赖的
.scss
文件

使用webpack执行此操作。我已将我的
app.scss
配置为：

@import '~foundation-sites/scss/foundation';
@import 'settings';
@include foundation-everything($flex: true);
// the rest of my imports now have access to Foundation mixins
@import 'mycomponent.scss'

~
告诉
sass加载程序
告诉
网页