webacp4.0

'use strict';
const path = require('path');

var APP_PATH = path.resolve(__dirname, 'src');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');

// const autoprefixer = require('autoprefixer');

const ENV = process.env.npm_lifecycle_event;
const isProd = ENV === 'build';

module.exports = function () {
const config = {

mode:'development',
devtool : 'module-source-map',

context: path.resolve(__dirname, 'src'),

entry: {
'app': path.resolve(APP_PATH ,'index.js'),
//
// 'vendor': [
// 'angular',
// '@uirouter/angularjs',
// // 'angular-resource',
// // 'mobile-angular-ui',
// // 'ng-dialog',
// // 'ngtouch',
// // 'angular-ui-utils',
// // 'moment',
// // 'baidumap',
//
// ]
},
output: {
path: path.resolve(__dirname,'dist'),
publicPath: '/',
filename: isProd ? '[name].[hash:8].js' : '[name].bundle.js',
chunkFilename: isProd ? '[name].[hash:8].js' : '[name].bundle.js'
},
module: {

rules: [
{
test: /\.js$/,
exclude: '/node_modules/',
use: {
loader: 'babel-loader'
}
},

{
test: /\.css$/,
use: ['style-loader', 'css-loader']
},

{test: /\.html$/, loader: 'raw-loader'},

{
test: /\.(png|jpg|gif)$/,
use: [
{
loader: 'url-loader',
options: {
limit: 8192
}
}
]
}

]

},
optimization: {
runtimeChunk: {
name: "manifest"
},
splitChunks: {
cacheGroups: {
commons: {
test: /[\\/]node_modules[\\/]/,
name: "vendor",
chunks: "all"
}
}
},
},

plugins: [

new HtmlWebpackPlugin({
template: path.resolve( APP_PATH, 'index2.html'),
//inject : 'body',
chunks: ['commons.chunk', 'vendor', 'app'],
chunksSortMode: 'dependency'
}),
new CleanWebpackPlugin(['dist']),

],

devServer: {
contentBase: 'src',
historyApiFallback: true,
port: 7070
},
resolve: {
alias: {
_components: path.resolve(APP_PATH, 'components'),
_config: path.resolve(APP_PATH, 'config'),
_assets: path.resolve(APP_PATH, 'assets'),
_pages: path.resolve(APP_PATH, 'pages'),
_services: path.resolve(APP_PATH, 'services')
}
}
};

return config;
}();