我有关于这样的样式文件的项目结构:
client/
config-style.scss
------components/
------style.scss
-----------------my_component/
-----------------style.scss
在所有style.scss文件中都有特定组件的本地样式。
在config-style.scss中,所有其他文件都使用了变量,例如:
$font-size-large: 30px
实际上我使用以下方法在每个style.scss文件中导入config-style.scss文件:
@import "../style.scss";
我也在使用webpack生成一个带有ExtractTextPlugin的main.scss文件
{
test: /\.(css|scss)$/,
loader: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: [
{
loader: 'css-loader',
options: {
sourceMap: true,
modules: true,
importLoaders: 1,
localIdentName: '[name]-[local]___[hash:base64:5]'
}
},
{ loader: 'sass-loader', options: { sourceMap: true } }
]
})
}
有没有办法告诉webpack在所有其他.scss文件中自动包含 config-style.scss ?
答案 0 :(得分:0)
是的,有一种方法可以注入常见的scss文件。您可以在选项下指定导入。还可以提供includePaths。这是语法。让我知道它是否适合你:)
{
loader: "sass-loader",
options: {
data: '@import "config-styles";'
includePaths: includePaths
}
}