提取文本插件在 Webpack 4 中不起作用

样式文件未添加到 dist

包.json

{
  "name": "jelly-effect",
  "version": "1.0.0",
  "description": "Jelly Effect on Canvas",
  "main": "index.js",
  "scripts": {
    "build": "webpack --mode production",
    "watch": "webpack-dev-server --mode development --open"
  },
  "author": "CreativeRusBear",
  "license": "ISC",
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-preset-env": "^1.7.0",
    "babel-preset-stage-3": "^6.24.1",
    "css-loader": "^2.1.0",
    "extract-text-webpack-plugin": "^4.0.0-beta.0",
    "path": "^0.12.7",
    "webpack": "^4.29.0",
    "webpack-cli": "^3.2.1",
    "webpack-dev-server": "^3.1.14"
  }
}

webpack.config.js

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

let conf = {
    entry: './src/js/script.js',
    output: {
        path: path.resolve(__dirname,'./dist/js'),
        filename: 'app.js',
        publicPath: 'dist/js/'
    },
    devServer: {
        overlay: true
    },
    module: {
        rules: [
            {
                test: /\.js$/,
                loader: 'babel-loader'
            },{
                test: /\.css$/,
                use: ExtractTextPlugin.extract({
                    use: 'css-loader'
                })
            }
        ]
    },
    plugins: [
        new ExtractTextPlugin('css/styles.css'),
    ]
};

module.exports=(env, options)=>{
    let prod = options.mode === 'production';
    conf.devtool = prod ? 'source-map' : 'eval-sourcemap';
    return conf;
};