webpack.config.js:意外字符'@'

时间:2018-10-23 17:51:20

标签: webpack package.json node-sass mini-css-extract-plugin webpack.config.js

我正在尝试创建一个代码,以作为下一个项目的参考。

webpack.config.js:

const path = require('path')
const webpack = require('webpack')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const CompressionPlugin = require('compression-webpack-plugin')
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')

//convert all .scss files in a single file in **dist/css** folder
module.exports = {
    entry: './src/sass/main.scss',
    output: {
        path: path.resolve(__dirname, './dist/css'),
        filename: 'styles.css'
    },
    plugins: [
        new webpack.LoaderOptionsPlugin({
            options: {}
        }),
        new MiniCssExtractPlugin({
            filename: 'cmscore.css'
        }),
        new UglifyJsPlugin(),
        new CompressionPlugin({
            test: /\.(js|css)/
        })
    ],
    module: {
        rules: [{
                test: /\.scss$/,
                include: [path.resolve(__dirname, './src/sass')],
                exclude: /node_modules/,
                use: [MiniCssExtractPlugin.loader,
                    {
                        loader: 'css-loader',
                        options: {
                            minimize: true,
                            sourceMap: true
                        }
                    }, {
                        loader: 'sass-loader'
                    }
                ],
            },

        ],
    },
}

//convert all .js in a single file in **dist/script** folder
module.exports = { 
    entry: './src/js/index.js',
    output: {
        path: path.resolve(__dirname, './dist/scripts'),
        filename: 'bundle.js'
    },
    plugins: [
        new webpack.LoaderOptionsPlugin({
            options: {}
        }),
        new UglifyJsPlugin(),
        new CompressionPlugin({
            test: /\.(js|css)/
        })
    ],
    module: {
        rules: [{
            test: /\.js$/,
            include: [path.resolve(__dirname, './src/js')],
            exclude: /node_modules/,
            use: [{
                loader: 'babel-loader',
                options: {
                    presets: ['@babel/preset-env'],
                    sourceMap: true
                }
            }]
        }],

    }
}

我试图将所有代码统一在一个块中(module.exports)

my package.json

error when I try to run the command - npm run dev-server

  • 无法转换文件并将文件发送到 ./ dist 文件夹。我试图以几种方式格式化 webpack.config.js 代码。删除: extract-text-webpack-plugin ,并替换为 mini-css-extract-plugin

0 个答案:

没有答案