webpack.config.js

var path                  = require('path')
var webpack               = require('webpack')
var WebpackNotifierPlugin = require('webpack-notifier')
var HtmlWebpackPlugin     = require('html-webpack-plugin')
var ExtractTextPlugin     = require("extract-text-webpack-plugin")
var FriendlyErrorsPlugin  = require('friendly-errors-webpack-plugin')

var functions             = require('./utils/functions')
var config                = require('./utils/config')

const extractStyles = new ExtractTextPlugin('[name].css?v=[hash]')

process.noDeprecation = true

module.exports = {
    entry : './src/main.js',
    output: {
        path       : path.resolve(__dirname, './../../public/static/dashboard/'),
        publicPath : config.publicPath[process.env.NODE_ENV],
        filename   : 'build.js?v=[hash]'
    },
    module: {
        rules: [
            {
                test    : /\.vue$/,
                loader  : 'vue-loader',
                // options : {
                //     loaders : {
                //         stylus: extractStyles.extract({
                //             use: ['css-loader', 'stylus-loader?paths=src/'],
                //             fallback: 'vue-style-loader'
                //         })
                //     }
                // },
                options : {
                    loaders : {
                        'stylus': 'vue-style-loader!css-loader!stylus-loader?paths=src/'
                    }
                }
            },
            {
                test: /\.css$/,

                use: extractStyles.extract({
                    use: [
                    {
                        loader: 'css-loader'
                    },

                    'stylus-loader'
                    ],
                    fallback: 'style-loader'
                })

            },
            {
                test   : /\.js$/,
                loaders : ['babel-loader'],
                exclude: /node_modules/
            },
            // {
            //     test: /\.(js|vue)$/,
            //     loaders : ['eslint-loader'],
            //     exclude: /node_modules/
            // },
            {
                test   : /(fonts|img)\/.*\.(png|jpg|jpeg|gif|eot|ttf|woff|woff2|svg|svgz)(\?.+)?$/,
                exclude: /favicon\.png$/,
                use    : [{
                     loader : 'url-loader',
                     options: {
                         limit: 10000
                     }
                 }]
            },
            {
                test: /icons\/.*\.svg$/,
                use : [
                    {
                        loader: 'raw-loader'
                    },
                    {
                        loader : 'svgo-loader',
                        options: {
                            plugins: [
                                { removeTitle      : true },
                                { convertColors    : {shorthex : false }},
                                { convertPathData  : false },
                                { removeDimensions : true }
                            ]
                        }
                    }
                ]
            }
        ]
    },
    resolve: {
        modules: [path.resolve(__dirname, "src"), "node_modules"],
        alias: {
            'vue$': 'vue/dist/vue.esm.js'
        }
    },
    devServer: {
        historyApiFallback : true,
        noInfo             : true,
        headers            : { "Access-Control-Allow-Origin": "*" },
        port               : 8020,
        quiet              : true,
        proxy : {
            '/':{
                target: 'http://local.neoauto3.com',
                changeOrigin: true
            }
        }
    },
    performance: {
        hints: false
    },
    //devtool: '#eval-source-map',
    plugins: [
        new WebpackNotifierPlugin({
            alwaysNotify: true
        }),
        new HtmlWebpackPlugin({
            template : config.html.template,
            filename : "../../../../../" + config.html.pathFile,
        }),
        new FriendlyErrorsPlugin(),
        extractStyles,


    ]
}

if (process.env.NODE_ENV === 'watch') {
    functions.generateHtmlWatch(config)
}
else{
    //module.exports.devtool = '#source-map'
    // http://vue-loader.vuejs.org/en/workflow/production.html
    module.exports.plugins = (module.exports.plugins || []).concat([
        new webpack.DefinePlugin({
            'process.env': {
                NODE_ENV : '"production"'
            }
        }),
        new webpack.optimize.UglifyJsPlugin({
            sourceMap: false,
            compress : {
                warnings: false
            }
        }),
        new webpack.LoaderOptionsPlugin({
            minimize: true
        })
    ])
}