由于文件未编译，我的代码中是否存在错误答案

【问题标题】：Is there some error in my code as files aren't compiling由于文件未编译，我的代码中是否存在错误
【发布时间】：2018-09-11 12:09:54
【问题描述】：

Webpack 4 不适合我。我主要是想让它把 SCSS 编译成 CSS 这是配置文件。此外，它不会抛出任何错误，只是表明它已被编译。我确定它在撒谎:)

const path = require('path');
const webpack = require('webpack');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const autoprefixer = require('autoprefixer');

module.exports = {
  entry: {
      App: './public/javascript/index.js'
  },
  devtool: "source-map",
  output: {
    path: path.resolve(__dirname, 'public', 'dist'),
    filename: '[name].bundle.js'
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader"
        }
      },
      {
        test: /\.(scss|css)$/,
        use: [
            MiniCssExtractPlugin.loader,
            {
                loader: "css-loader"
                // options: {
                //     minimize: {
                //         safe: true
                //     }
                // }
            },
            {
                loader: "postcss-loader",
                options: {
                    autoprefixer: {
                        browsers: ["last 2 versions"]
                    },
                    plugins: () => [
                        autoprefixer
                    ]
                },
            },
            {
                loader: "sass-loader",
                options: {}
            }
        ]
    },
    ]
  },
  plugins: [
    new MiniCssExtractPlugin({
      filename: "./public/dist/style.css",
      chunkFilename: "./public/dist/[id].css"
    })
  ]
};

这也是我正在运行的脚本

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "watch": "nodemon ./start.js --ignore /public",
    "dev": "concurrently \"npm run watch\" \"npm run assets\" --names \"????,????\" --prefix name",
    "assets": "webpack-dev-server --mode development"
},

所以它没有编译，没有抛出错误，并告诉代码已经编译但在目标文件夹中看不到文件。

【问题讨论】：

webpack-dev-server 在内存中编译并打开一个网络服务器用于本地开发。您不会获得目标文件夹。为此，只需使用webpack --mode development
谢谢，但即使使用webpack --mode development，它也没有给我一个单独的 css 文件。
但是 javascript 文件构建得很好？
是的，我得到的是 JS 文件，但不是 css 文件 :(
你在哪里导入css文件？ webpack 配置应该可以工作。

标签： webpack sass webpack-dev-server webpack-style-loader

【解决方案1】：

请参考以下链接。这是我的 webpack 4 配置文件的一部分。它将 SASS 提取到 CSS。虽然我的问题是我还没有想出在 webpack 4 中删除多余 CSS 的方法。

How to remove unused CSS using webpack 4?

【讨论】：