var FS = require('fs'); var Path = require('path'); var Webpack = require('webpack'); var HtmlWebpackPlugin = require('html-webpack-plugin'); var DefinePlugin = Webpack.DefinePlugin; var NamedChunksPlugin = Webpack.NamedChunksPlugin; var NamedModulesPlugin = Webpack.NamedModulesPlugin; var UglifyJSPlugin = require('uglifyjs-webpack-plugin'); var BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin; var ExtractTextPlugin = require("extract-text-webpack-plugin"); var EVENT = process.env.npm_lifecycle_event; var BUILD = (EVENT === 'build') ? 'production' : 'development'; var IS_DEV_SERVER = process.argv.find((arg) => { return arg.includes('webpack-dev-server') }); var DEV_DATA_HOST = (IS_DEV_SERVER) ? 'http://localhost:8000' : undefined; var CORDOVA_DATA_HOST = process.env.CORDOVA_DATA_HOST; var BASE_PATH = '/'; var clientConfig = { context: Path.resolve('./src'), entry: './main', output: { path: Path.resolve('./server/www'), publicPath: BASE_PATH, filename: 'front-end.js', }, resolve: { extensions: [ '.js', '.jsx' ], modules: [ Path.resolve('./src'), Path.resolve('./node_modules') ], }, module: { rules: [ { test: /\.jsx?$/, loader: 'babel-loader', exclude: /node_modules/, query: { presets: [ 'env', 'react', 'stage-0', ], plugins: [ 'syntax-async-functions', 'syntax-class-properties', 'transform-regenerator', 'transform-runtime', ] } }, { test: /\.scss$/, use: ExtractTextPlugin.extract({ use: 'css-loader!sass-loader', }) }, { test: /fonts.*\.woff2?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'file-loader', }, { test: /fonts.*\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'file-loader', query: { emitFile: false, } }, ] }, plugins: [ new DefinePlugin({ 'process.env.NODE_ENV': JSON.stringify(BUILD), 'process.env.TARGET': JSON.stringify('browser'), 'process.env.DATA_HOST': JSON.stringify(DEV_DATA_HOST), 'process.env.BASE_PATH': JSON.stringify(BASE_PATH), }), new NamedChunksPlugin, new NamedModulesPlugin, new BundleAnalyzerPlugin({ analyzerMode: (EVENT === 'build') ? 'static' : 'disabled', reportFilename: `report.html`, }), new ExtractTextPlugin("styles.css"), ], devtool: (EVENT === 'build') ? false : 'inline-source-map', }; var serverConfig = { context: clientConfig.context, entry: clientConfig.entry, target: 'node', output: { path: Path.resolve('./server/client'), publicPath: BASE_PATH, filename: 'front-end.js', libraryTarget: 'commonjs2', }, resolve: clientConfig.resolve, module: clientConfig.module, plugins: [ new DefinePlugin({ 'process.env.NODE_ENV': JSON.stringify(BUILD), 'process.env.TARGET': JSON.stringify('node'), 'process.env.DATA_HOST': JSON.stringify(undefined), 'process.env.BASE_PATH': JSON.stringify(BASE_PATH), }), new NamedChunksPlugin, new NamedModulesPlugin, new HtmlWebpackPlugin({ template: Path.resolve(`./src/index.html`), filename: 'index.html', }), new ExtractTextPlugin('styles.css'), ], devtool: clientConfig.devtool, }; var cordovaConfig = { context: clientConfig.context, entry: clientConfig.entry, output: { path: Path.resolve('./cordova/sample-app/www'), publicPath: '', filename: 'front-end.js', }, resolve: clientConfig.resolve, module: clientConfig.module, plugins: [ new DefinePlugin({ 'process.env.NODE_ENV': JSON.stringify(BUILD), 'process.env.TARGET': JSON.stringify('browser'), 'process.env.DATA_HOST': JSON.stringify(CORDOVA_DATA_HOST), 'process.env.BASE_PATH': JSON.stringify(BASE_PATH), }), new NamedChunksPlugin, new NamedModulesPlugin, new HtmlWebpackPlugin({ template: Path.resolve(`./src/index.html`), filename: 'index.html', cordova: true, host: CORDOVA_DATA_HOST }), new ExtractTextPlugin('styles.css'), ], devtool: clientConfig.devtool, }; var configs = module.exports = []; if (IS_DEV_SERVER) { // need HTML page clientConfig.plugins.push(new HtmlWebpackPlugin({ template: Path.resolve(`./src/index.html`), filename: 'index.html', })); // config dev-server to support client-side routing clientConfig.devServer = { inline: true, historyApiFallback: true, }; configs.push(clientConfig); } else { configs.push(clientConfig, serverConfig) if (CORDOVA_DATA_HOST) { configs.push(cordovaConfig); console.log('Building for Cordova: ' + CORDOVA_DATA_HOST); } } var constants = {}; if (EVENT === 'build') { console.log('Optimizing JS code'); configs.forEach((config) => { // use Uglify to remove dead-code config.plugins.push(new UglifyJSPlugin({ uglifyOptions: { compress: { drop_console: true, } } })); }) } // copy webpack.resolve.js into webpack.debug.js to resolve Babel presets // and plugins to absolute paths, required when linked modules are used if (FS.existsSync('./webpack.debug.js')) { configs.map(require('./webpack.debug.js')); }