Scss文件无法编译

Question

我在src/css下有scss文件，想通过webpack进行编译。 看来不行。 可能的根本原因是什么？ 谢谢

    var webpack = require('webpack');
    var path = require('path');
    const ExtractTextPlugin = require("extract-text-webpack-plugin");
    var CopyWebpackPlugin = require('copy-webpack-plugin');
    var HtmlWebpackPlugin = require('html-webpack-plugin');

    const extractCustomCss = new ExtractTextPlugin('./custom.css');

    const scssCompileOption = {
        test: /\.scss$/,
        include: [
            path.resolve(__dirname, 'src/css')
        ],
        loader: ExtractTextPlugin.extract({
            use: [{
                loader: 'css-loader'
            }, {
                loader: 'sass-loader'
            }],
            fallback: 'style-loader'
        })
    }


    module.exports = {
        entry: {
            index: "./src/App.tsx"
        },
        output: {
            path: path.join(__dirname, "/dist/"),
            filename: "[name].js"
        },

        devtool: 'source-map',
        resolve: {
            extensions: ['.ts', '.tsx', '.js', '.json', '.scss']
        },

        module: {
            loaders: [
                {test: /\.json$/, exclude: /node_modules/, loader: 'json'},
            ],
            rules: [
                scssCompileOption

            ]
        },
        devServer: {
            stats: 'errors-only',
            hot: true
        },
        plugins: [
            extractCustomCss
        ]
        // target: 'node'
    };

Answer 1

我强烈建议对所有CSS预处理程序编译（例如，更少，sass或scss）使用Compass。

通过Ruby下载Compass：

$ gem update --system
$ gem install compass

然后访问您的文件目录，

cd your/file/directory

并设置指南针环境：

compass init
compass watch

现在，所有.scss / .sass / etc ..扩展文件都已编译。

有关将来的说明，请访问这些参考文献，或询问我！

如何安装Compass Compass文档