我无法使用 webpack 将编译后的 scss 转换为单个 css 文件答案

【问题标题】：I can't get compiled scss to single css-file using webpack我无法使用 webpack 将编译后的 scss 转换为单个 css 文件
【发布时间】：2018-12-02 19:13:45
【问题描述】：

这是我的 webpack.config.js：

在我运行 npm run watch 之后

 const MiniCssExtractPlugin = require("mini-css-extract-plugin");
    module.exports = {
      mode: 'production',
      entry: './catalog/view/theme/default/sas/common.scss',
      plugins: [
        new MiniCssExtractPlugin({
          // Options similar to the same options in webpackOptions.output
          // both options are optional
          filename: "./catalog/view/theme/default/stylesheet/stylesheet.css",


        })
      ],
      module: {
        rules: [
          {
            test: /\.scss$/,
            use: [
              MiniCssExtractPlugin.loader,
              {
                loader: "css-loader",
                options: {
                  modules: true,
                  sourceMap: true,
                  importLoader: 2
                }
              },
              'postcss-loader',
              "sass-loader"
            ],
          }
        ]
      }
      ,
      watch: true,
    }

我已经阅读了很多示例，但仍然感到困惑 - 没有一个不起作用。谷歌只是给你一堆有用的信息。

【问题讨论】：

标签： webpack webpack-2 webpack-style-loader

【解决方案1】：

问题已经通过在config中添加解决了：

 output: {
path: path.resolve(__dirname, "catalog/view/theme/default/css"),

我没有注意到带有 css 的文件已保存到 './src/.../catalog/view/theme/default/sas/common.scss' 文件夹，所以“output.path” - 是强制属性。

【讨论】：