Webpack SCSS配置

时间:2019-03-10 18:27:30

标签: webpack mini-css-extract-plugin

我有以下Webpack设置:

let config= {
    mode: 'development',
    entry:  {
        'templates': '/usr/local/var/www/project/src/ts/entry/templates.ts',
        'templates2': '/usr/local/var/www/project/src/ts/entry/templates2.ts',
        'main_scss': '/usr/local/var/www/project/src/sass/entry/main_scss.scss',
        'templates': '/usr/local/var/www/project/src/sass/entry/templates.scss'
    },
    output: {
        path:  path.resolve(__dirname, 'public/assets'),
        filename: '[name].bundle.js'
    },
    module: {
        rules: [
            {
                test: /\.(ts)$/,
                use: [
                    'ts-loader',
                ],
            },
            {
                test: /\.(scss)$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    'css-loader',
                    'sass-loader',
                ],

            },
        ]
    },
    plugins:[
        new MiniCssExtractPlugin({
            filename: "[name].css",
        })
    ]


};

结果是一个文件夹,其中每个.ts文件都有.js文件,每个.scss文件都有2个文件。 (main_scss.scss生成main_scss.bundle.js和main_scss.css)

为什么?我希望将.scss文件仅捆绑到.css中。

谢谢 雅伦

0 个答案:

没有答案