webpack 配置项
image.png{
test: /\.css|scss$/,
// use: 'sass-loader'
loader: ExtractTextPlugin.extract({
use: [
{
loader: 'css-loader',
options: {
modules: true,
importLoaders:1,
localIdentName: '[name]__[local]-[hash:base64:5]'
// localIdentName: '[name]__[local]-[hash:base64:5]'
}
},
"sass-loader",
],
fallback: "style-loader",
})
},
组件中使用
image.png第一步 在所用的组件中import 要使用的样式文件
第二步 在组件的dom 中添加 class={ ${style.xxxx}
}
这里的style 对应上面的import ,xxxx 对应 style.scss 中的类名 如test
image.pngimage.png
如果ts版本遇到其他问题可以在项目添加declaration.d.ts 文件尝试
image.png
网友评论