diff --git a/templates/ReactReduxSpa/package.json b/templates/ReactReduxSpa/package.json index 59d95d1..ee56311 100644 --- a/templates/ReactReduxSpa/package.json +++ b/templates/ReactReduxSpa/package.json @@ -28,6 +28,8 @@ "extract-text-webpack-plugin": "^1.0.1", "file-loader": "^0.8.5", "jquery": "^2.2.1", + "json-loader": "^0.5.4", + "node-noop": "^1.0.0", "react": "^15.3.2", "react-dom": "^15.3.2", "react-redux": "^4.4.5", @@ -40,7 +42,6 @@ "typescript": "2.0.3", "url-loader": "^0.5.7", "webpack": "^1.13.2", - "webpack-node-externals": "^1.4.3", "webpack-hot-middleware": "^2.12.2", "webpack-merge": "^0.14.1" } diff --git a/templates/ReactReduxSpa/project.json b/templates/ReactReduxSpa/project.json index a6bb0e3..fdddb0f 100755 --- a/templates/ReactReduxSpa/project.json +++ b/templates/ReactReduxSpa/project.json @@ -56,7 +56,6 @@ "include": [ "appsettings.json", "ClientApp/dist", - "node_modules", "Views", "web.config", "wwwroot" diff --git a/templates/ReactReduxSpa/webpack.config.js b/templates/ReactReduxSpa/webpack.config.js index a89d8ff..d3a21af 100644 --- a/templates/ReactReduxSpa/webpack.config.js +++ b/templates/ReactReduxSpa/webpack.config.js @@ -2,9 +2,7 @@ var isDevBuild = process.argv.indexOf('--env.prod') < 0; var path = require('path'); var webpack = require('webpack'); var ExtractTextPlugin = require('extract-text-webpack-plugin'); -var nodeExternals = require('webpack-node-externals'); var merge = require('webpack-merge'); -var allFilenamesExceptJavaScript = /\.(?!js(\?|$))([^.]+(\?|$))/; // Configuration in common to both client-side and server-side bundles var sharedConfig = () => ({ @@ -53,14 +51,22 @@ var clientBundleConfig = merge(sharedConfig(), { // Configuration for server-side (prerendering) bundle suitable for running in Node var serverBundleConfig = merge(sharedConfig(), { + resolve: { packageMains: ['main'] }, entry: { 'main-server': './ClientApp/boot-server.tsx' }, + plugins: [ + new webpack.DllReferencePlugin({ + context: __dirname, + manifest: require('./ClientApp/dist/vendor-manifest.json'), + sourceType: 'commonjs2', + name: './vendor' + }) + ], output: { libraryTarget: 'commonjs', path: path.join(__dirname, './ClientApp/dist') }, target: 'node', - devtool: 'inline-source-map', - externals: [nodeExternals({ whitelist: [allFilenamesExceptJavaScript] })] // Don't bundle .js files from node_modules + devtool: 'inline-source-map' }); module.exports = [clientBundleConfig, serverBundleConfig]; diff --git a/templates/ReactReduxSpa/webpack.config.vendor.js b/templates/ReactReduxSpa/webpack.config.vendor.js index 8f4361f..f680868 100644 --- a/templates/ReactReduxSpa/webpack.config.vendor.js +++ b/templates/ReactReduxSpa/webpack.config.vendor.js @@ -2,39 +2,84 @@ var isDevBuild = process.argv.indexOf('--env.prod') < 0; var path = require('path'); var webpack = require('webpack'); var ExtractTextPlugin = require('extract-text-webpack-plugin'); +var merge = require('webpack-merge'); var extractCSS = new ExtractTextPlugin('vendor.css'); -module.exports = { - resolve: { - extensions: [ '', '.js' ] - }, +var sharedConfig = { + resolve: { extensions: [ '', '.js' ] }, module: { loaders: [ - { test: /\.(png|woff|woff2|eot|ttf|svg)(\?|$)/, loader: 'url-loader?limit=100000' }, - { test: /\.css(\?|$)/, loader: extractCSS.extract(['css-loader']) } + { test: /\.json$/, loader: require.resolve('json-loader') }, + { test: /\.(png|woff|woff2|eot|ttf|svg)(\?|$)/, loader: 'url-loader?limit=100000' } ] }, entry: { - vendor: ['bootstrap', 'bootstrap/dist/css/bootstrap.css', 'domain-task', 'event-source-polyfill', 'react', 'react-dom', 'react-router', 'redux', 'redux-thunk', 'react-router-redux', 'style-loader', 'jquery'], + vendor: [ + 'bootstrap', + 'bootstrap/dist/css/bootstrap.css', + 'domain-task', + 'event-source-polyfill', + 'react', + 'react-dom', + 'react-router', + 'react-redux', + 'redux', + 'redux-thunk', + 'react-router-redux', + 'style-loader', + 'jquery' + ], }, output: { - path: path.join(__dirname, 'wwwroot', 'dist'), publicPath: '/dist/', filename: '[name].js', library: '[name]_[hash]', }, plugins: [ - extractCSS, new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery' }), // Maps these identifiers to the jQuery package (because Bootstrap expects it to be a global variable) - new webpack.optimize.OccurenceOrderPlugin(), - new webpack.DllPlugin({ - path: path.join(__dirname, 'wwwroot', 'dist', '[name]-manifest.json'), - name: '[name]_[hash]' - }), + new webpack.NormalModuleReplacementPlugin(/\/iconv-loader$/, require.resolve('node-noop')), // Workaround for https://github.com/andris9/encoding/issues/16 new webpack.DefinePlugin({ 'process.env.NODE_ENV': isDevBuild ? '"development"' : '"production"' }) + ] +}; + +var clientBundleConfig = merge(sharedConfig, { + output: { path: path.join(__dirname, 'wwwroot', 'dist') }, + module: { + loaders: [ + { test: /\.css(\?|$)/, loader: extractCSS.extract(['css-loader']) } + ] + }, + plugins: [ + extractCSS, + new webpack.DllPlugin({ + path: path.join(__dirname, 'wwwroot', 'dist', '[name]-manifest.json'), + name: '[name]_[hash]' + }) ].concat(isDevBuild ? [] : [ + new webpack.optimize.OccurenceOrderPlugin(), new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false } }) ]) -}; +}); + +var serverBundleConfig = merge(sharedConfig, { + target: 'node', + resolve: { packageMains: ['main'] }, + output: { + path: path.join(__dirname, 'ClientApp', 'dist'), + libraryTarget: 'commonjs2', + }, + module: { + loaders: [ { test: /\.css(\?|$)/, loader: 'css-loader' } ] + }, + entry: { vendor: ['aspnet-prerendering', 'react-dom/server'] }, + plugins: [ + new webpack.DllPlugin({ + path: path.join(__dirname, 'ClientApp', 'dist', '[name]-manifest.json'), + name: '[name]_[hash]' + }) + ] +}); + +module.exports = [clientBundleConfig, serverBundleConfig];