Skip to content

Commit a3cba50

Browse files
SteveSandersonMSSteveSandersonMS
committed
Make ReactReduxSpa able to do prerendering without node_modules at runtime
1 parent 9cfea61 commit a3cba50

File tree

4 files changed

+71
-20
lines changed

4 files changed

+71
-20
lines changed

‎templates/ReactReduxSpa/package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,8 @@
2828
"extract-text-webpack-plugin": "^1.0.1",
2929
"file-loader": "^0.8.5",
3030
"jquery": "^2.2.1",
31+
"json-loader": "^0.5.4",
32+
"node-noop": "^1.0.0",
3133
"react": "^15.3.2",
3234
"react-dom": "^15.3.2",
3335
"react-redux": "^4.4.5",
@@ -40,7 +42,6 @@
4042
"typescript": "2.0.3",
4143
"url-loader": "^0.5.7",
4244
"webpack": "^1.13.2",
43-
"webpack-node-externals": "^1.4.3",
4445
"webpack-hot-middleware": "^2.12.2",
4546
"webpack-merge": "^0.14.1"
4647
}

‎templates/ReactReduxSpa/project.json‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,6 @@
5656
"include": [
5757
"appsettings.json",
5858
"ClientApp/dist",
59-
"node_modules",
6059
"Views",
6160
"web.config",
6261
"wwwroot"

‎templates/ReactReduxSpa/webpack.config.js‎

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,7 @@ var isDevBuild = process.argv.indexOf('--env.prod') < 0;
22
var path = require('path');
33
var webpack = require('webpack');
44
var ExtractTextPlugin = require('extract-text-webpack-plugin');
5-
var nodeExternals = require('webpack-node-externals');
65
var merge = require('webpack-merge');
7-
var allFilenamesExceptJavaScript = /\.(?!js(\?|$))([^.]+(\?|$))/;
86

97
// Configuration in common to both client-side and server-side bundles
108
var sharedConfig = () => ({
@@ -53,14 +51,22 @@ var clientBundleConfig = merge(sharedConfig(), {
5351

5452
// Configuration for server-side (prerendering) bundle suitable for running in Node
5553
var serverBundleConfig = merge(sharedConfig(), {
54+
resolve: { packageMains: ['main'] },
5655
entry: { 'main-server': './ClientApp/boot-server.tsx' },
56+
plugins: [
57+
new webpack.DllReferencePlugin({
58+
context: __dirname,
59+
manifest: require('./ClientApp/dist/vendor-manifest.json'),
60+
sourceType: 'commonjs2',
61+
name: './vendor'
62+
})
63+
],
5764
output: {
5865
libraryTarget: 'commonjs',
5966
path: path.join(__dirname, './ClientApp/dist')
6067
},
6168
target: 'node',
62-
devtool: 'inline-source-map',
63-
externals: [nodeExternals({ whitelist: [allFilenamesExceptJavaScript] })] // Don't bundle .js files from node_modules
69+
devtool: 'inline-source-map'
6470
});
6571

6672
module.exports = [clientBundleConfig, serverBundleConfig];

‎templates/ReactReduxSpa/webpack.config.vendor.js‎

Lines changed: 59 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -2,39 +2,84 @@ var isDevBuild = process.argv.indexOf('--env.prod') < 0;
22
var path = require('path');
33
var webpack = require('webpack');
44
var ExtractTextPlugin = require('extract-text-webpack-plugin');
5+
var merge = require('webpack-merge');
56
var extractCSS = new ExtractTextPlugin('vendor.css');
67

7-
module.exports = {
8-
resolve: {
9-
extensions: [ '', '.js' ]
10-
},
8+
var sharedConfig = {
9+
resolve: { extensions: [ '', '.js' ] },
1110
module: {
1211
loaders: [
13-
{ test: /\.(png|woff|woff2|eot|ttf|svg)(\?|$)/, loader: 'url-loader?limit=100000' },
14-
{ test: /\.css(\?|$)/, loader: extractCSS.extract(['css-loader']) }
12+
{ test: /\.json$/, loader: require.resolve('json-loader') },
13+
{ test: /\.(png|woff|woff2|eot|ttf|svg)(\?|$)/, loader: 'url-loader?limit=100000' }
1514
]
1615
},
1716
entry: {
18-
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'],
17+
vendor: [
18+
'bootstrap',
19+
'bootstrap/dist/css/bootstrap.css',
20+
'domain-task',
21+
'event-source-polyfill',
22+
'react',
23+
'react-dom',
24+
'react-router',
25+
'react-redux',
26+
'redux',
27+
'redux-thunk',
28+
'react-router-redux',
29+
'style-loader',
30+
'jquery'
31+
],
1932
},
2033
output: {
21-
path: path.join(__dirname, 'wwwroot', 'dist'),
2234
publicPath: '/dist/',
2335
filename: '[name].js',
2436
library: '[name]_[hash]',
2537
},
2638
plugins: [
27-
extractCSS,
2839
new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery' }), // Maps these identifiers to the jQuery package (because Bootstrap expects it to be a global variable)
29-
new webpack.optimize.OccurenceOrderPlugin(),
40+
new webpack.NormalModuleReplacementPlugin(/\/iconv-loader$/, require.resolve('node-noop')), // Workaround for https://github.com/andris9/encoding/issues/16
41+
new webpack.DefinePlugin({
42+
'process.env.NODE_ENV': isDevBuild ? '"development"' : '"production"'
43+
})
44+
]
45+
};
46+
47+
var clientBundleConfig = merge(sharedConfig, {
48+
output: { path: path.join(__dirname, 'wwwroot', 'dist') },
49+
module: {
50+
loaders: [
51+
{ test: /\.css(\?|$)/, loader: extractCSS.extract(['css-loader']) }
52+
]
53+
},
54+
plugins: [
55+
extractCSS,
3056
new webpack.DllPlugin({
3157
path: path.join(__dirname, 'wwwroot', 'dist', '[name]-manifest.json'),
3258
name: '[name]_[hash]'
33-
}),
34-
new webpack.DefinePlugin({
35-
'process.env.NODE_ENV': isDevBuild ? '"development"' : '"production"'
3659
})
3760
].concat(isDevBuild ? [] : [
61+
new webpack.optimize.OccurenceOrderPlugin(),
3862
new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false } })
3963
])
40-
};
64+
});
65+
66+
var serverBundleConfig = merge(sharedConfig, {
67+
target: 'node',
68+
resolve: { packageMains: ['main'] },
69+
output: {
70+
path: path.join(__dirname, 'ClientApp', 'dist'),
71+
libraryTarget: 'commonjs2',
72+
},
73+
module: {
74+
loaders: [ { test: /\.css(\?|$)/, loader: 'css-loader' } ]
75+
},
76+
entry: { vendor: ['aspnet-prerendering', 'react-dom/server'] },
77+
plugins: [
78+
new webpack.DllPlugin({
79+
path: path.join(__dirname, 'ClientApp', 'dist', '[name]-manifest.json'),
80+
name: '[name]_[hash]'
81+
})
82+
]
83+
});
84+
85+
module.exports = [clientBundleConfig, serverBundleConfig];

0 commit comments

Comments
 (0)