Webpack - 无法生成编译文件,甚至无法生成dist文件夹

时间:2017-10-01 19:44:33

标签: javascript reactjs webpack

当我运行webpack-dev-server时,它会编译代码并在浏览器中显示输出 但是当我运行:webpack - p它没有生成dist文件夹中的文件时,它甚至没有创建文件夹dist

以下是我的项目的一些文件和目录结构

webpack.config.babel.js

import HtmlWebpackPlugin from 'html-webpack-plugin';
import ExtractTextPlugin,{extract} from 'extract-text-webpack-plugin';
import path,{resolve} from 'path';

module.exports = {
    devtool: 'source-map',
    entry: './src/app.js',
    output: {
        path: resolve(__dirname + 'dist'),
        filename : 'app.bundle.js' 
    },
    module: {
        rules:[
            {
                test: /\.scss$/,
                exclude: /node_modules/,
                use: extract({
                    fallback: "style-loader",
                    use: [
                        "css-loader",
                        "sass-loader",
                    ],
                    publicPath: "/dist"
                }),
            },
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: "babel-loader"
            }
        ]
    },
    devServer:{
        contentBase: path.join(__dirname, "dist"),
        compress: true,
        port: 9000,
        stats:'errors-only'
    },
    plugins: [
        new HtmlWebpackPlugin({
            title: 'Webpack starter project',
            template: './src/index.html',
            hash:true,
            minify:{
                collapseWhitespace: true,
                minifyCSS: true,
                minifyJS:true,
            }
        }),
        new ExtractTextPlugin({
            filename: "app.css",
            disable: false,
            allChunks: true
        })
    ]
}

1 个答案:

答案 0 :(得分:0)

普通的webpack文件无法理解ES6 / 7的功能。因此,如果您想在webpack配置中使用它们,您必须按照以下方式调用命令。

/settings/