亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

javascript - webpack packages vue and compresses js code and an error occurs
淡淡煙草味
淡淡煙草味 2017-06-12 09:32:50
0
1
1287
'use strict'
const webpack = require('webpack')
const paths = require('./paths')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const ManifestPlugin = require('webpack-manifest-plugin')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin')
const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')

module.exports = {
    entry: paths.appEntry,
    output: {
        pathinfo: true,
        path: paths.appBuild,
        filename: '[name].[hash].js'
    },
    bail: true,
    devtool: 'source-map',
    resolve: {
        extensions: [
            '.js', '.vue', '.scss', '.css', '.json'
        ],
        alias: {
            'src': paths.appSrc
        }
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                loader: 'vue-loader',
                options: {
                    extract: true,
                    loaders: ExtractTextPlugin.extract({
                        use: [
                            {
                                loader: 'css-loader',
                                options: {
                                    minimize: true,
                                    sourcMap: true
                                }
                            }, {
                                loader: 'sass-loader',
                                options: {
                                    indentedSyntax: true,
                                    sourcMap: true
                                }
                            }
                        ],
                        fallback: 'vue-style-loader'
                    })
                }
            }, {
                test: /\.js$/,
                loader: 'babel-loader',
                exclude: /node_modules/
            }, {
                test: /\.(png|jpg|gif|svg)$/,
                loader: 'file-loader',
                options: {
                    name: '[name].[ext]?[hash]'
                }
            }
        ]
    },
    plugins: [
        new webpack.HotModuleReplacementPlugin(),
        new CaseSensitivePathsPlugin(),
        new webpack.DefinePlugin({
            PRODUCTION: JSON.stringify(process.env.NODE_ENV === 'prod')
        }),
        new HtmlWebpackPlugin({
            inject: true,
            template: paths.appHtml,
            minify: {
                removeComments: true,
                collapseWhitespace: true,
                removeRedundantAttributes: true,
                useShortDoctype: true,
                removeEmptyAttributes: true,
                removeStyleLinkTypeAttributes: true,
                keepClosingSlash: true,
                minifyJS: true,
                minifyCSS: true,
                minifyURLs: true
            }
        }),
        new webpack.optimize.UglifyJsPlugin({
            compress: {
                warnings: false,
                comparisons: false
            },
            output: {
                comments: false
            },
            sourceMap: true
        }),
        new OptimizeCSSPlugin({
            cssProcessorOptions: {
                safe: true
            }
        }),
        new ExtractTextPlugin({filename: '[name].[contenthash:8].css'}),
        new ManifestPlugin({fileName: 'asset-manifest.json'}),
        new CopyWebpackPlugin([
            {
                from: paths.appPublic,
                to: paths.appBuild,
                ignore: ['.*']
            }
        ])
    ]
}

The reason for the error seems to be that the uglifyjs plug-in does not recognize the es6 syntax

In addition, my css is not packaged into a css file independently and is still mixed with js. . .
Thank you for your help.

淡淡煙草味
淡淡煙草味

reply all(1)
阿神

Your babel configuration is correct. In this case, a common possibility is that the .babelrc file is missing from the root directory of your project, so Babel does not translate ES6, causing Uglify to fail.

Append the following content .babelrc to the project root directory:

{
  "presets": [
    ["es2015", { "modules": false }]
  ]
}
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template