小编use*_*814的帖子

使用webpack为SCSS加上变量

这里是Webpack业余爱好者...我正在尝试theme.scss通过遵循此处指定的指示来合并文件以自定义React Toolbox使用的主题:

如果将Webpack用作模块捆绑程序,则可能也使用sass-loader。我们要做的是在每个SASS文件编译之前添加一堆要覆盖的变量,这可以使用data选项来完成。例如:

sassLoader:{数据:'@import“'+ path.resolve(__ dirname,'theme / _theme.scss')+'”;' }

在这种情况下,我们会将主题导入添加到每个SASS编译的前面,以便在每个样式表中更改原色。

我在使用当前的webpack配置执行该指令时遇到问题,如下所示:

const webpack = require('webpack');
const path = require('path');
let ExtractTextPlugin = require('extract-text-webpack-plugin');

module.exports = {
    context: path.join(__dirname, 'client'),
    entry: [
        './main.js',
    ],
    output: {
        path: path.join(__dirname, 'www'),
        filename: 'bundle.js',
    },
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                use: [
                    'babel-loader',
                ],
            },
            {
                test: /\.css$/,
                use: [
                    "style-loader",
                    {
                        loader: "css-loader",
                        options: {
                            modules: true,
                            sourceMap: true,
                            importLoaders: 1,
                            localIdentName: "[name]--[local]--[hash:base64:8]"
                        }
                    }, …
Run Code Online (Sandbox Code Playgroud)

sass reactjs webpack react-toolbox

3
推荐指数
1
解决办法
1621
查看次数

标签 统计

react-toolbox ×1

reactjs ×1

sass ×1

webpack ×1