};
process.env.BABEL_ENV = TARGET;
const common = merge(
{
// Entry accepts a path or an object of entries.
// We'll be using the latter form given it's
// convenient with more complex configurations.
entry: {
style: PATHS.style,
app: PATHS.app
},
output: {
path: PATHS.build,
filename: '[name].js'
},
resolve: {
extensions: ['', '.js', '.jsx']
}
},
parts.indexTemplate({
title: 'Kanban demo',
appMountId: 'app'
}),
parts.loadJSX(PATHS.app),
parts.lintJSX(PATHS.app)
);
var config;
// Detect how npm is run and branch based on that
var helpers = require('./helpers');
const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
module.exports = webpackMerge(commonConfig, {
devtool: 'source-map',
output: {
path: helpers.root('dist'),
publicPath: '',
filename: '[name].js',
chunkFilename: '[id].chunk.js'
},
htmlLoader: {
minimize: false // workaround for ng2
},
plugins: [
new webpack.NoErrorsPlugin(),
new webpack.optimize.DedupePlugin(),
new webpack.optimize.UglifyJsPlugin(),
new ExtractTextPlugin('[name].css'),
new webpack.DefinePlugin({
'process.env': {
'ENV': JSON.stringify(ENV)
}
})
]
});
}, {}),
module: {
loaders: [{
test: /\.css$/,
loaders: ['style','css']
},
{
test: /\.jsx?$/,
loaders: ['babel?cacheDirectory'],
include: [endpoints.server, endpoints.projects]
}]
}
};
if (target === 'start') {
module.exports = merge(client, {
devServer: {
contentBase: endpoints.clientBuild,
historyApiFallback: true,
hot: true,
inline: true,
progress: true,
stats: 'errors-only',
host: process.env.HOST,
port: process.env.PORT
},
plugins: [new webpack.HotModuleReplacementPlugin()]
});
} else {
module.exports = [client, server, components];
}
module.exports = function(env) {
return webpackMerge(commonConfig({env: ENV}), {
/**
* Switch loaders to debug mode.
*
* See: http://webpack.github.io/docs/configuration.html#debug
*/
debug: false,
/**
* Developer tool to enhance debugging
*
* See: http://webpack.github.io/docs/configuration.html#devtool
* See: https://github.com/webpack/docs/wiki/build-performance#sourcemaps
*/
devtool: 'source-map',
/**
* Options affecting the output of the compilation.
*
* See: http://webpack.github.io/docs/configuration.html#output
*/
output: {
/**
* The output directory as absolute path (required).
*
* See: http://webpack.github.io/docs/configuration.html#output-path
*/
path: helpers.root('dist'),
/**
* Specifies the name of each output file on disk.
* IMPORTANT: You must not specify an absolute path here!
*
* See: http://webpack.github.io/docs/configuration.html#output-filename
*/
filename: '[name].[chunkhash].bundle.js',
/**
* The filename of the SourceMaps for the JavaScript files.
* They are inside the output.path directory.
*
* See: http://webpack.github.io/docs/configuration.html#output-sourcemapfilename
*/
sourceMapFilename: '[name].[chunkhash].bundle.map',
/**
* The filename of non-entry chunks as relative path
* inside the output.path directory.
*
* See: http://webpack.github.io/docs/configuration.html#output-chunkfilename
*/
chunkFilename: '[id].[chunkhash].chunk.js'
},
/**
* Add additional plugins to the compiler.
*
* See: http://webpack.github.io/docs/configuration.html#plugins
*/
plugins: [
/**
* Plugin: WebpackMd5Hash
* Description: Plugin to replace a standard webpack chunkhash with md5.
*
* See: https://www.npmjs.com/package/webpack-md5-hash
*/
new WebpackMd5Hash(),
/**
* Plugin: DedupePlugin
* Description: Prevents the inclusion of duplicate code into your bundle
* and instead applies a copy of the function at runtime.
*
* See: https://webpack.github.io/docs/list-of-plugins.html#defineplugin
* See: https://github.com/webpack/docs/wiki/optimization#deduplication
*/
// new DedupePlugin(), // see: https://github.com/angular/angular-cli/issues/1587
/**
* Plugin: DefinePlugin
* Description: Define free variables.
* Useful for having development builds with debug logging or adding global constants.
*
* Environment helpers
*
* See: https://webpack.github.io/docs/list-of-plugins.html#defineplugin
*/
// NOTE: when adding more properties make sure you include them in custom-typings.d.ts
new DefinePlugin({
'ENV': JSON.stringify(METADATA.ENV),
'API_URL': JSON.stringify(METADATA.API_URL),
'HMR': METADATA.HMR,
'process.env': {
'ENV': JSON.stringify(METADATA.ENV),
'NODE_ENV': JSON.stringify(METADATA.ENV),
'HMR': METADATA.HMR
}
}),
/**
* Plugin: UglifyJsPlugin
* Description: Minimize all JavaScript output of chunks.
* Loaders are switched into minimizing mode.
*
* See: https://webpack.github.io/docs/list-of-plugins.html#uglifyjsplugin
*/
// NOTE: To debug prod builds uncomment //debug lines and comment //prod lines
new UglifyJsPlugin({
// beautify: true, //debug
// mangle: false, //debug
// dead_code: false, //debug
// unused: false, //debug
// deadCode: false, //debug
// compress: {
// screw_ie8: true,
// keep_fnames: true,
// drop_debugger: false,
// dead_code: false,
// unused: false
// }, // debug
// comments: true, //debug
beautify: false, //prod
mangle: { screw_ie8 : true, keep_fnames: true }, //prod
compress: { screw_ie8: true }, //prod
comments: false //prod
}),
/**
* Plugin: NormalModuleReplacementPlugin
* Description: Replace resources that matches resourceRegExp with newResource
*
* See: http://webpack.github.io/docs/list-of-plugins.html#normalmodulereplacementplugin
*/
new NormalModuleReplacementPlugin(
/angular2-hmr/,
helpers.root('config/modules/angular2-hmr-prod.js')
),
/**
* Plugin: IgnorePlugin
* Description: Don’t generate modules for requests matching the provided RegExp.
*
* See: http://webpack.github.io/docs/list-of-plugins.html#ignoreplugin
*/
// new IgnorePlugin(/angular2-hmr/),
/**
* Plugin: CompressionPlugin
* Description: Prepares compressed versions of assets to serve
* them with Content-Encoding
*
* See: https://github.com/webpack/compression-webpack-plugin
*/
// install compression-webpack-plugin
// new CompressionPlugin({
// regExp: /\.css$|\.html$|\.js$|\.map$/,
// threshold: 2 * 1024
// })
],
/**
* Static analysis linter for TypeScript advanced options configuration
* Description: An extensible linter for the TypeScript language.
*
* See: https://github.com/wbuchwalter/tslint-loader
*/
tslint: {
emitErrors: true,
failOnHint: true,
resourcePath: 'src'
},
/**
* Html loader advanced options
*
* See: https://github.com/webpack/html-loader#advanced-options
*/
// TODO: Need to workaround Angular 2's html syntax => #id [bind] (event) *ngFor
htmlLoader: {
minimize: true,
removeAttributeQuotes: false,
caseSensitive: true,
customAttrSurround: [
[/#/, /(?:)/],
[/\*/, /(?:)/],
[/\[?\(?/, /(?:)/]
],
customAttrAssign: [/\)?\]?=/]
},
/*
* Include polyfills or mocks for various node stuff
* Description: Node configuration
*
* See: https://webpack.github.io/docs/configuration.html#node
*/
node: {
global: 'window',
crypto: 'empty',
process: false,
module: false,
clearImmediate: false,
setImmediate: false
}
});
}
module.exports = merge(common, {
devtool: 'eval-source-map',
devServer: {
contentBase: PATHS.build,
historyApiFallback: true,
hot: true,
inline: true,
progress: true,
// display only errors to reduce the amount of output
stats: 'errors-only',
// parse host and port from env so this is easy
// to customize
host: process.env.HOST,
port: process.env.PORT
},
module: {
loaders: [
// sass loader
{ test: /\.(scss|sass)$/, loaders: ['style', 'css', 'resolve-url', 'sass?sourceMap'], include: PATHS.style },
// css loader
{ test: /\.css$/, loader: 'style-loader!css-loader' },
// image loader
{ test: /\.(png|jpg)$/, loader: 'file-loader?name=images/[name].[ext]' },
{ test: /\.html$/, loader: 'html-loader' }
]
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new ExtractTextPlugin('[name].css'),
new NpmInstallPlugin({
save: true // --save
})
]
});
module.exports = merge(base,{
resolve:{
alias: {
'vue$': 'vue/dist/vue.min.js', //NPM中的vue只是runtime部分，不包含compiler
'@': path.resolve(__dirname,'src')
}
},
plugins: [
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: '"production"'
}
}),
new CleanWebpackPlugin(['build']), //清理build文件夹
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
},
sourceMap: true
}),
new ExtractTextPlugin({
filename: '[name].[contenthash].css'
}),
// Compress extracted CSS. We are using this plugin so that possible
// duplicated CSS from different components can be deduped.
new OptimizeCSSPlugin({
cssProcessorOptions: {
safe: true
}
}),
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'index.html',
title:'贵州省互联网违法和不良信息举报中心',
inject: true,
minify: {
removeComments: true,
collapseWhitespace: true,
removeAttributeQuotes: true
},
// necessary to consistently work with multiple chunks via CommonsChunkPlugin
chunksSortMode: 'dependency'
}),
// split vendor js into its own file
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
minChunks: function (module, count) {
// any required modules inside node_modules are extracted to vendor
return (
module.resource &&
/\.js$/.test(module.resource) &&
module.resource.indexOf(
path.join(__dirname, '../node_modules')
) === 0
)
}
}),
// extract webpack runtime and module manifest to its own file in order to
// prevent vendor hash from being updated whenever app bundle is updated
new webpack.optimize.CommonsChunkPlugin({
name: 'manifest',
chunks: ['vendor']
}),
]
})
const merge = require('webpack-merge');
const common = require('./webpack.common.js');
const {
path
} = require('./shared');
module.exports = merge(common, {
mode: 'development',
devtool: 'inline-source-map',
devServer: {
contentBase: path.out,
compress: true,
port: 9000,
}
});
const merge = require('webpack-merge');
const webpackConfig = require('./webpack.config');
module.exports = merge(webpackConfig, {
devtool: 'inline-source-map',
output: {
pathinfo: true,
publicPath: '/',
filename: '[name].js',
},
});
const commonConfig = require('./webpack.common.js'); // the settings that are common to prod and dev
/**
* Webpack Plugins
*/
const DefinePlugin = require('webpack/lib/DefinePlugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
/**
* Webpack Constants
*/
const ENV = process.env.ENV = process.env.NODE_ENV = 'development';
const HMR = process.env.HMR || helpers.hasProcessFlag('hot');
const METADATA = webpackMerge(commonConfig.metadata, {
host: 'localhost',
port: 8080,
ENV: ENV,
HMR: HMR
});
METADATA.hostPort = 'http://' + METADATA.host + ':' + METADATA.port + '/';
/**
* Webpack configuration
*
* See: http://webpack.github.io/docs/configuration.html#cli
*/
module.exports = webpackMerge(commonConfig, {
/**
* Merged metadata from webpack.common.js for index.html
*
var webpackMerge = require('webpack-merge');
var commonConfig = require('./webpack.common.js');
module.exports = webpackMerge(commonConfig, {
output: {
path: process.cwd() + '/dev',
filename: 'bundle.js'
},
});
export default merge(baseConfig, {
debug: true,
devtool: 'cheap-module-eval-source-map',
entry: [
'webpack-hot-middleware/client?path=http://localhost:3000/__webpack_hmr',
'./app/index'
],
output: {
publicPath: 'http://localhost:3000/static/'
},
module: {
loaders: [
{
test: /\.global\.css$/,
loaders: [
'style-loader',
'css-loader?sourceMap'
]
},
{
test: /^((?!\.global).)*\.css$/,
loaders: [
'style-loader',
'css-loader?modules&sourceMap&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]'
]
}
]
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('development')
})
],
target: 'electron-renderer'
});
const config = require('flarum-webpack-config');
const webpack = require('webpack');
const merge = require('webpack-merge');
module.exports = merge(config(), {
output: {
library: 'flarum.core'
},
plugins: [
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/)
]
});
include: PATHS.app
}
]
}
};
if (TARGET === 'start' || !TARGET) {
module.exports = merge(common, {
devServer: {
contentBase: PATHS.build,
historyApiFallback: true,
hot: true,
inline: true,
progress: true,
stats: 'errors-only',
host: process.env.HOST || '127.0.0.1',
port: process.env.HOST || '8080'
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new NpmInstallPlugin({
save: true
})
],
devtool: 'eval-source-map'
});
}
if (TARGET === 'build') {
module.exports = merge(common, {});
}
module.exports = merge(common, {
devtool: 'eval-source-map',
devServer: {
contentBase: PATHS.build,
historyApiFallback: true,
hot: true,
inline: true,
progress: true,
stats: 'errors-only',
// Parse host and port from env so this is easy to customize.
host: '0.0.0.0',
port: process.env.PORT
},
module: {
loaders: [{
test: /\.(scss|sass)$/,
loader: TARGET === "build" ? ExtractTextPlugin.extract("sass-loader") : "sass-loader",
include: PATHS.app
}],
preLoaders: [{
test: /\.jsx?$/,
loaders: ['eslint', 'jscs'],
include: PATHS.app
}]
},
postcss: [autoprefixer],
plugins: [
new ExtractTextPlugin('example.css', { allChunks: true }), // compiled css (single file only)
new webpack.NoErrorsPlugin(),
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('development')
}),
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery"
}),
new webpack.HotModuleReplacementPlugin(),
new NpmInstallPlugin({
save: true // --save
}),
new webpack.optimize.CommonsChunkPlugin({
name: "app",
minChunks: Infinity,
})
/*new ManifestPlugin(),
new ChunkManifestPlugin({
filename: "chunk-manifest.json",
manifestVariable: "webpackManifest"
}),
new webpack.optimize.OccurenceOrderPlugin()*/
]
});
module.exports = merge(common, {
mode: "development",
output: {
filename: "[name].js",
chunkFilename: "[id].css"
},
devServer: {
port: process.env.PORT || 3000,
contentBase: path.join(process.cwd(), "./dist"),
watchContentBase: true,
stats: "none",
quiet: false,
open: true,
historyApiFallback: {
rewrites: [{from: /./, to: "404.html"}]
}
},
plugins: [
new CleanWebpackPlugin(["dist/**/*.js", "dist/**/*.css", "site/content/webpack.json"]),
new MiniCssExtractPlugin({
filename: "[name].css",
chunkFilename: "[id].css"
})
]
});
module.exports = (options) => webpackMerge(commonConfig({ env: ENV }), {
devtool: 'eval-source-map',
devServer: {
contentBase: './target/www',
proxy: [{
context: [
/* jhipster-needle-add-entity-to-webpack - JHipster will add entity api paths here */
'/api',
'/management',
'/swagger-resources',
'/v2/api-docs',
'/h2-console',
'/auth'
],
target: 'http://127.0.0.1:8080',
secure: false,
headers: { host: 'localhost:9000' }
}],
stats: options.stats,
watchOptions: {
ignored: /node_modules/
}
},
entry: {
polyfills: './src/main/webapp/app/polyfills',
global: './src/main/webapp/content/css/global.css',
main: './src/main/webapp/app/app.main'
},
output: {
path: utils.root('target/www'),
filename: 'app/[name].bundle.js',
chunkFilename: 'app/[id].chunk.js'
},
module: {
rules: [{
test: /\.ts$/,
enforce: 'pre',
loader: 'tslint-loader',
exclude: ['node_modules', new RegExp('reflect-metadata\\' + path.sep + 'Reflect\\.ts')]
},
{
test: /\.ts$/,
use: [
'angular2-template-loader',
{
loader: 'cache-loader',
options: {
cacheDirectory: path.resolve('target/cache-loader')
}
},
{
loader: 'thread-loader',
options: {
// there should be 1 cpu for the fork-ts-checker-webpack-plugin
workers: require('os').cpus().length - 1
}
},
{
loader: 'ts-loader',
options: {
transpileOnly: true,
happyPackMode: true
}
},
'angular-router-loader'
],
exclude: ['node_modules']
},
{
test: /\.css$/,
use: ['to-string-loader', 'css-loader'],
exclude: /(vendor\.css|global\.css)/
},
{
test: /(vendor\.css|global\.css)/,
use: ['style-loader', 'css-loader']
}]
},
stats: options.stats,
plugins: [
new SimpleProgressWebpackPlugin({
format: options.stats === 'minimal' ? 'compact' : 'expanded'
}),
new FriendlyErrorsWebpackPlugin(),
new ForkTsCheckerWebpackPlugin(),
new BrowserSyncPlugin({
host: 'localhost',
port: 9000,
proxy: {
target: 'http://localhost:9060'
}
}, {
reload: false
}),
new webpack.ContextReplacementPlugin(
/angular(\\|\/)core(\\|\/)/,
path.resolve(__dirname, './src/main/webapp')
),
new writeFilePlugin(),
new webpack.WatchIgnorePlugin([
utils.root('src/test'),
]),
new WebpackNotifierPlugin({
title: 'JHipster',
contentImage: path.join(__dirname, 'logo-jhipster.png')
})
],
mode: 'development'
});
var webpackConfig = merge(baseWebpackConfig, {
module: {
loaders: utils.styleLoaders({ sourceMap: config.build.productionSourceMap, extract: true })
},
devtool: config.build.productionSourceMap ? '#source-map' : false,
output: {
path: config.build.assetsRoot,
filename: utils.assetsPath('js/[name].min.js'),
chunkFilename: utils.assetsPath('js/[id].min.js')
},
vue: {
loaders: utils.cssLoaders({
sourceMap: config.build.productionSourceMap,
extract: true
})
},
plugins: [
// http://vuejs.github.io/vue-loader/workflow/production.html
new webpack.DefinePlugin({
'process.env': env
}),
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
}),
new webpack.optimize.OccurenceOrderPlugin(),
// extract css into its own file
new ExtractTextPlugin(utils.assetsPath('css/[name].min.css')),
// split vendor js into its own file
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
minChunks: function (module, count) {
// any required modules inside node_modules are extracted to vendor
return (
module.resource &&
/\.js$/.test(module.resource) &&
module.resource.indexOf(
path.join(__dirname, '../node_modules')
) === 0
);
}
}),
// extract webpack runtime and module manifest to its own file in order to
// prevent vendor hash from being updated whenever app bundle is updated
new webpack.optimize.CommonsChunkPlugin({
name: 'manifest',
chunks: ['vendor']
})
]
});
test: /\.css$/,
loaders: ['style', 'css']
}
]
}
};
switch (TARGET) {
case 'build':
module.exports = merge(common, {
plugins: [
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
}),
new webpack.DefinePlugin({
'process.env': {
'NODE_ENV': JSON.stringify('production')
}
})
]
});
break;
case 'dev':
module.exports = merge(common, {
entry: [
'webpack-dev-server/client?http://localhost:8080',
'webpack/hot/dev-server'
]
var cleanWebpackPlugin = require('clean-webpack-plugin');
var path = require('path');
module.exports = merge(baseWebpackConfig,{
devtool : '#source-map',
output : {
path : './dist',
publicPath : 'http://j2.58cdn.com.cn/zhuanzhuan/wbapp/',
filename : 'static/[name].[chunkhash:7].js',
chunkFilename : 'static/[id].[chunkhash:7].js'
},
plugins : [
new cleanWebpackPlugin(['dist'],{ root: path.resolve(__dirname , '..'), verbose: true}),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: '"production"'
}
}),
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
}),
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.optimize.DedupePlugin(),
new webpack.optimize.LimitChunkCountPlugin({maxChunks: 15}),
new webpack.optimize.MinChunkSizePlugin({minChunkSize: 10000})
]
});
const HtmlWebpackPlugin = require('html-webpack-plugin');
const merge = require('webpack-merge');
const baseConfig = require('./webpack.base.config');
const HOST = process.env.HOST;
const PORT = process.env.PORT && Number(process.env.PORT);
module.exports = merge(baseConfig, {
mode: 'production',
plugins: [
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'static/index.html',
inject: false,
}),
],
});
const DefinePlugin = require('webpack/lib/DefinePlugin');
const NormalModuleReplacementPlugin = require('webpack/lib/NormalModuleReplacementPlugin');
const IgnorePlugin = require('webpack/lib/IgnorePlugin');
const DedupePlugin = require('webpack/lib/optimize/DedupePlugin');
const UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin');
const WebpackMd5Hash = require('webpack-md5-hash');
/**
* Webpack Constants
*/
const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
const HOST = process.env.HOST || 'localhost';
const PORT = process.env.PORT || 8080;
const METADATA = webpackMerge(commonConfig({env: ENV}).metadata, {
host: HOST,
port: PORT,
ENV: ENV,
HMR: false
});
module.exports = function(env) {
return webpackMerge(commonConfig({env: ENV}), {
/**
* Switch loaders to debug mode.
*
* See: http://webpack.github.io/docs/configuration.html#debug
*/
debug: false,
/**
* Developer tool to enhance debugging
switch(process.env.npm_lifecycle_event) {
case 'build':
case 'stats':
config = merge(
common,
{
devtool: 'source-map',
output: {
path: PATHS.build,
filename: '[name].[chunkhash].js',
chunkFilename: '[chunkhash].js'
}
},
parts.clean(PATHS.build),
parts.setFreeVariable(
'process.env.NODE_ENV',
'production'
),
parts.extractBundle({
name: 'vendor',
entries: ['react']
}),
parts.minify(),
parts.extractCSS(PATHS.style),
parts.purifyCSS([PATHS.build])
);
break;
default:
config = merge(
common,
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const commonConfig = require('./webpack.common.conf.js');
const util = require('./util');
const hotMiddlewareScript = 'webpack-hot-middleware/client?reload=true';
const devConfig = webpackMerge(commonConfig, {
devtool: 'cheap-module-eval-source-map',
output: {
path: util.root('dist'),
publicPath: '/',
filename: '[name].js',
chunkFilename: '[id].chunk.js'
},
plugins: [
new ExtractTextPlugin('[name].css'),
new webpack.HotModuleReplacementPlugin(),
new webpack.NamedModulesPlugin()
],
// devServer: {
// // host: '0.0.0.0', // If need visit extenal, cancel the comment
// port: 7410,
// historyApiFallback: true,
// stats: 'minimal',
// open: true
// }
});
Object.keys(devConfig.entry).forEach(key => {
devConfig.entry[key] = ['eventsource-polyfill', hotMiddlewareScript].concat(devConfig.entry[key]);
});
const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
// add hot-reload related code to entry chunks
Object.keys(baseWebpackConfig.entry).forEach(function (name) {
baseWebpackConfig.entry[name] = ['./build/dev-client'].concat(baseWebpackConfig.entry[name])
})
module.exports = merge(baseWebpackConfig, {
module: {
rules: utils.styleLoaders({sourceMap: config.dev.cssSourceMap})
},
// cheap-module-eval-source-map is faster for development
devtool: '#cheap-module-eval-source-map',
plugins: [
new webpack.DefinePlugin({
'process.env': config.dev.env
}),
// https://github.com/glenjamin/webpack-hot-middleware#installation--usage
new webpack.HotModuleReplacementPlugin(),
new webpack.NoEmitOnErrorsPlugin(),
// https://github.com/ampedandwired/html-webpack-plugin
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'index.html',
inject: true,
favicon: 'src/assets/img/favicon.ico'
}),
new FriendlyErrorsPlugin()
]
})
const path = require('path');
const merge = require('webpack-merge');
const common = require('./webpack.common.js');
const HTMLWebpackPlugin = require('html-webpack-plugin');
const HtmlWebpackIncludeAssetsPlugin = require('html-webpack-include-assets-plugin');
const webpack = require('webpack');
module.exports = merge(common, {
mode: 'development',
devtool: 'inline-source-map',
devServer: {
historyApiFallback: true,
open: true
},
plugins: [
new HTMLWebpackPlugin({
template: path.resolve(__dirname, 'src/dev-bootstrap4.html')
// template: path.resolve(__dirname, 'src/dev-bulma.html')
// template: path.resolve(__dirname, 'src/dev-foundation6.html')
}),
new HtmlWebpackIncludeAssetsPlugin({
assets: 'src/dev-data.js',
append: true
}),
new webpack.HotModuleReplacementPlugin()
]
});
var webpackConfig = merge(baseWebpackConfig, {
module: {
rules: utils.styleLoaders({
// sourceMap: config.build.productionSourceMap,
extract: true
})
},
//devtool: config.build.productionSourceMap ? '#source-map' : false,
output: {
path: config.build.assetsRoot,
filename: utils.assetsPath('js/[name].[chunkhash].js'),
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
},
plugins: [
// http://vuejs.github.io/vue-loader/en/workflow/production.html
new webpack.DefinePlugin({
'process.env': env
}),new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery",
"window.jQuery": "jquery"
}),
new UglifyEsPlugin({
compress: {
warnings: false,
drop_console: true,
},
sourceMap: false
}),
// extract css into its own file
new ExtractTextPlugin({
filename: utils.assetsPath('css/[name].[contenthash].css') }),
// Compress extracted CSS. We are using this plugin so that possible
// duplicated CSS from different components can be deduped.
new OptimizeCSSPlugin(),
// generate dist index.html with correct asset hash for caching.
// you can customize output by editing /index.html
// see https://github.com/ampedandwired/html-webpack-plugin
new HtmlWebpackPlugin({
filename: config.build.index,
template: 'index.html',
inject: true,
minify: {
removeComments: true,
collapseWhitespace: true,
removeAttributeQuotes: true
// more options:
// https://github.com/kangax/html-minifier#options-quick-reference
},
// necessary to consistently work with multiple chunks via CommonsChunkPlugin
chunks: ['manifest', 'vendor', 'app'],
chunksSortMode: 'dependency'
}),
// split vendor js into its own file
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
minChunks: function (module, count) {
// any required modules inside node_modules are extracted to vendor
return (
module.resource &&
/\.js$/.test(module.resource) &&
module.resource.indexOf(
path.join(__dirname, '../node_modules')
) === 0
)
}
}),
// new webpack.optimize.CommonsChunkPlugin({
// name: "vendor",
// filename: "vendor.js"
// }),
// extract webpack runtime and module manifest to its own file in order to
// prevent vendor hash from being updated whenever app bundle is updated
// copy custom static assets
new CopyWebpackPlugin([
{
from: path.resolve(__dirname, '../static'),
to: config.build.assetsSubDirectory,
ignore: ['.*']
}
]),
new ZipPlugin({
path:path.join(__dirname,'../dist'),
filename: 'cloudwarehouse.zip'
})
]
})
const path = require('path');
const webpack = require('webpack');
const fs = require('fs');
const merge = require('webpack-merge');
const base = require('./prod.config');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer')
.BundleAnalyzerPlugin;
module.exports = merge(base, {
cache: true,
devtool: 'source-map',
plugins: [
new webpack.LoaderOptionsPlugin({
options: {
'if-loader': 'prod',
},
}),
new BundleAnalyzerPlugin({
analyzerHost: '0.0.0.0',
analyzerPort: 8000,
}),
],
});
module.exports = function (options) {
return webpackMerge(commonConfig({env: ENV, htmlMinify: false}), {
/**
* Developer tool to enhance debugging
*
* See: http://webpack.github.io/docs/configuration.html#devtool
* See: https://github.com/webpack/docs/wiki/build-performance#sourcemaps
*/
devtool: 'cheap-module-source-map',
/**
* Options affecting the output of the compilation.
*
* See: http://webpack.github.io/docs/configuration.html#output
*/
output: {
/**
* The output directory as absolute path (required).
*
* See: http://webpack.github.io/docs/configuration.html#output-path
*/
path: helpers.root('dist'),
/**
* Specifies the name of each output file on disk.
* IMPORTANT: You must not specify an absolute path here!
*
* See: http://webpack.github.io/docs/configuration.html#output-filename
*/
filename: '[name].bundle.js',
/**
* The filename of the SourceMaps for the JavaScript files.
* They are inside the output.path directory.
*
* See: http://webpack.github.io/docs/configuration.html#output-sourcemapfilename
*/
sourceMapFilename: '[name].bundle.map',
/** The filename of non-entry chunks as relative path
* inside the output.path directory.
*
* See: http://webpack.github.io/docs/configuration.html#output-chunkfilename
*/
chunkFilename: '[id].chunk.js',
library: 'ac_[name]',
libraryTarget: 'var',
},
plugins: [
/**
* Plugin: DefinePlugin
* Description: Define free variables.
* Useful for having development builds with debug logging or adding global constants.
*
* Environment helpers
*
* See: https://webpack.github.io/docs/list-of-plugins.html#defineplugin
*/
// NOTE: when adding more properties, make sure you include them in custom-typings.d.ts
new DefinePlugin({
'ENV': JSON.stringify(METADATA.ENV),
'HMR': METADATA.HMR,
'process.env': {
'ENV': JSON.stringify(METADATA.ENV),
'NODE_ENV': JSON.stringify(METADATA.ENV),
'HMR': METADATA.HMR,
}
}),
/**
* Plugin: NamedModulesPlugin (experimental)
* Description: Uses file names as module name.
*
* See: https://github.com/webpack/webpack/commit/a04ffb928365b19feb75087c63f13cadfc08e1eb
*/
new NamedModulesPlugin(),
/**
* Plugin LoaderOptionsPlugin (experimental)
*
* See: https://gist.github.com/sokra/27b24881210b56bbaff7
*/
new LoaderOptionsPlugin({
debug: true,
options: {
context: helpers.root('src'),
output: {
path: helpers.root('dist')
},
/**
* Static analysis linter for TypeScript advanced options configuration
* Description: An extensible linter for the TypeScript language.
*
* See: https://github.com/wbuchwalter/tslint-loader
*/
tslint: {
emitErrors: false,
failOnHint: false,
resourcePath: 'src'
}
}
})
],
/**
* Webpack Development Server configuration
* Description: The webpack-dev-server is a little node.js Express server.
* The server emits information about the compilation state to the client,
* which reacts to those events.
*
* See: https://webpack.github.io/docs/webpack-dev-server.html
*/
devServer: {
port: METADATA.port,
host: METADATA.host,
historyApiFallback: {
index: '/index.html'
},
watchOptions: {
aggregateTimeout: 300,
poll: 1000
},
inline: true,
outputPath: helpers.root('dist')
}
});
};
const webpackConfig = merge(baseWebpackConfig, {
module: {
rules: utils.styleLoaders({
sourceMap: config.build.productionSourceMap,
extract: true,
usePostCSS: true
})
},
devtool: config.build.productionSourceMap ? config.build.devtool : false,
output: {
path: config.build.assetsRoot,
filename: utils.assetsPath('js/[name].[chunkhash].js'),
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
},
plugins: [
// http://vuejs.github.io/vue-loader/en/workflow/production.html
new webpack.DefinePlugin({
'process.env': env
}),
new UglifyJsPlugin({
uglifyOptions: {
compress: {
warnings: false
}
},
sourceMap: config.build.productionSourceMap,
parallel: true
}),
// extract css into its own file
new ExtractTextPlugin({
filename: utils.assetsPath('css/[name].[contenthash].css'),
// Setting the following option to `false` will not extract CSS from codesplit chunks.
// Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack.
// It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`,
// increasing file size: https://github.com/vuejs-templates/webpack/issues/1110
allChunks: true,
}),
// Compress extracted CSS. We are using this plugin so that possible
// duplicated CSS from different components can be deduped.
new OptimizeCSSPlugin({
cssProcessorOptions: config.build.productionSourceMap
? { safe: true, map: { inline: false } }
: { safe: true }
}),
// generate dist index.html with correct asset hash for caching.
// you can customize output by editing /index.html
// see https://github.com/ampedandwired/html-webpack-plugin
new HtmlWebpackPlugin({
filename: process.env.NODE_ENV === 'testing'
? 'index.html'
: config.build.index,
template: 'index.html',
inject: true,
minify: {
removeComments: true,
collapseWhitespace: true,
removeAttributeQuotes: true
// more options:
// https://github.com/kangax/html-minifier#options-quick-reference
},
// necessary to consistently work with multiple chunks via CommonsChunkPlugin
chunksSortMode: 'dependency'
}),
// keep module.id stable when vendor modules does not change
new webpack.HashedModuleIdsPlugin(),
// enable scope hoisting
new webpack.optimize.ModuleConcatenationPlugin(),
// split vendor js into its own file
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
minChunks(module) {
// any required modules inside node_modules are extracted to vendor
return (
module.resource &&
/\.js$/.test(module.resource) &&
module.resource.indexOf(
path.join(__dirname, '../node_modules')
) === 0
)
}
}),
// extract webpack runtime and module manifest to its own file in order to
// prevent vendor hash from being updated whenever app bundle is updated
new webpack.optimize.CommonsChunkPlugin({
name: 'manifest',
minChunks: Infinity
}),
// This instance extracts shared chunks from code splitted chunks and bundles them
// in a separate chunk, similar to the vendor chunk
// see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk
new webpack.optimize.CommonsChunkPlugin({
name: 'app',
async: 'vendor-async',
children: true,
minChunks: 3
}),
// copy custom static assets
new CopyWebpackPlugin([
{
from: path.resolve(__dirname, '../static'),
to: config.build.assetsSubDirectory,
ignore: ['.*']
}
])
]
})
'vendor.bundle.js'
),
/* ================================================================ */
/* Uglify */
/* ================================================================ */
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false,
},
}),
/* ================================================================ */
/* 注入环境变量 NODE_ENV 为 production */
/* 不用这个的时候，Redux会报错说用的版本不是生产版本 */
/* 参考：https://github.com/reactjs/redux/issues/1029 */
/* ================================================================ */
new webpack.DefinePlugin({
'process.env.NODE_ENV': '"production"',
}),
],
}
}
/**
* 根据前面的逻辑做完config配置，合并一下输出
* envConfig放最后：prod环境下envConfig的配置要覆盖前面(common)的配置
* @param: settingConfig: 根据是user版还是grapher版的配置定制
* @param: common: 通用配置
* @param: envConfig: 根据是dev还是prod的配置定制
**/
module.exports = merge(settingConfig, common, envConfig)