Skip to content
This repository was archived by the owner on Apr 8, 2020. It is now read-only.

Update templates to Webpack 2 #615

Closed
SteveSandersonMS wants to merge 4 commits into from
Closed

Update templates to Webpack 2 #615

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
1927d38
Update Angular2Spa to Webpack 2 (plus awesome-typescript-loader for i…
SteveSandersonMS Jan 26, 2017
ef6968d
Update ReactSpa to Webpack 2 (plus awesome-typescript-loader)
SteveSandersonMS Jan 27, 2017
cc76daf
Update ReactReduxSpa to Webpack 2 (plus awesome-typescript-loader)
SteveSandersonMS Jan 27, 2017
0200489
Update KnockoutSpa to Webpack 2 (plus awesome-typescript-loader)
SteveSandersonMS Jan 27, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 3 additions & 4 deletions templates/Angular2Spa/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,28 +21,27 @@
"angular2-universal-polyfills": "~2.0.11",
"aspnet-prerendering": "^2.0.0",
"aspnet-webpack": "^1.0.17",
"awesome-typescript-loader": "3.0.0-beta.13 || ^3.0.0",
"bootstrap": "^3.3.7",
"css": "^2.2.1",
"css-loader": "^0.25.0",
"es6-shim": "^0.35.1",
"event-source-polyfill": "^0.0.7",
"expose-loader": "^0.7.1",
"extract-text-webpack-plugin": "^1.0.1",
"extract-text-webpack-plugin": "^2.0.0-rc",
"file-loader": "^0.9.0",
"html-loader": "^0.4.4",
"isomorphic-fetch": "^2.2.1",
"jquery": "^2.2.1",
"json-loader": "^0.5.4",
"node-noop": "^1.0.0",
"preboot": "^4.5.2",
"raw-loader": "^0.5.1",
"rxjs": "5.0.0-beta.12",
"style-loader": "^0.13.1",
"to-string-loader": "^1.1.5",
"ts-loader": "^0.8.2",
"typescript": "^2.0.3",
"url-loader": "^0.5.7",
"webpack": "^1.13.2",
"webpack": "^2.2.0",
"webpack-hot-middleware": "^2.12.2",
"webpack-merge": "^0.14.1",
"zone.js": "^0.6.25"
Expand Down
131 changes: 67 additions & 64 deletions templates/Angular2Spa/webpack.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,68 +1,71 @@
var isDevBuild = process.argv.indexOf('--env.prod') < 0;
var path = require('path');
var webpack = require('webpack');
var merge = require('webpack-merge');
const path = require('path');
const webpack = require('webpack');
const merge = require('webpack-merge');
const CheckerPlugin = require('awesome-typescript-loader').CheckerPlugin;

// Configuration in common to both client-side and server-side bundles
var sharedConfig = {
context: __dirname,
resolve: { extensions: [ '', '.js', '.ts' ] },
output: {
filename: '[name].js',
publicPath: '/dist/' // Webpack dev middleware, if enabled, handles requests for this URL prefix
},
module: {
loaders: [
{ test: /\.ts$/, include: /ClientApp/, loaders: ['ts-loader?silent=true', 'angular2-template-loader'] },
{ test: /\.html$/, loader: 'html-loader?minimize=false' },
{ test: /\.css$/, loader: 'to-string-loader!css-loader' },
{ test: /\.(png|jpg|jpeg|gif|svg)$/, loader: 'url-loader', query: { limit: 25000 } },
{ test: /\.json$/, loader: 'json-loader' }
]
}
};
module.exports = (env) => {
// Configuration in common to both client-side and server-side bundles
const isDevBuild = !(env && env.prod);
const sharedConfig = {
stats: { modules: false },
context: __dirname,
resolve: { extensions: [ '.js', '.ts' ] },
output: {
filename: '[name].js',
publicPath: '/dist/' // Webpack dev middleware, if enabled, handles requests for this URL prefix
},
module: {
rules: [
{ test: /\.ts$/, include: /ClientApp/, use: ['awesome-typescript-loader?silent=true', 'angular2-template-loader'] },
{ test: /\.html$/, use: 'html-loader?minimize=false' },
{ test: /\.css$/, use: ['to-string-loader', 'css-loader'] },
{ test: /\.(png|jpg|jpeg|gif|svg)$/, use: 'url-loader?limit=25000' }
]
},
plugins: [new CheckerPlugin()]
};

// Configuration for client-side bundle suitable for running in browsers
var clientBundleOutputDir = './wwwroot/dist';
var clientBundleConfig = merge(sharedConfig, {
entry: { 'main-client': './ClientApp/boot-client.ts' },
output: { path: path.join(__dirname, clientBundleOutputDir) },
plugins: [
new webpack.DllReferencePlugin({
context: __dirname,
manifest: require('./wwwroot/dist/vendor-manifest.json')
})
].concat(isDevBuild ? [
// Plugins that apply in development builds only
new webpack.SourceMapDevToolPlugin({
filename: '[file].map', // Remove this line if you prefer inline source maps
moduleFilenameTemplate: path.relative(clientBundleOutputDir, '[resourcePath]') // Point sourcemap entries to the original file locations on disk
})
] : [
// Plugins that apply in production builds only
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.optimize.UglifyJsPlugin()
])
});
// Configuration for client-side bundle suitable for running in browsers
const clientBundleOutputDir = './wwwroot/dist';
const clientBundleConfig = merge(sharedConfig, {
entry: { 'main-client': './ClientApp/boot-client.ts' },
output: { path: path.join(__dirname, clientBundleOutputDir) },
plugins: [
new webpack.DllReferencePlugin({
context: __dirname,
manifest: require('./wwwroot/dist/vendor-manifest.json')
})
].concat(isDevBuild ? [
// Plugins that apply in development builds only
new webpack.SourceMapDevToolPlugin({
filename: '[file].map', // Remove this line if you prefer inline source maps
moduleFilenameTemplate: path.relative(clientBundleOutputDir, '[resourcePath]') // Point sourcemap entries to the original file locations on disk
})
] : [
// Plugins that apply in production builds only
new webpack.optimize.UglifyJsPlugin()
])
});

// Configuration for server-side (prerendering) bundle suitable for running in Node
var serverBundleConfig = merge(sharedConfig, {
resolve: { packageMains: ['main'] },
entry: { 'main-server': './ClientApp/boot-server.ts' },
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'
});
// Configuration for server-side (prerendering) bundle suitable for running in Node
const serverBundleConfig = merge(sharedConfig, {
resolve: { mainFields: ['main'] },
entry: { 'main-server': './ClientApp/boot-server.ts' },
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'
});

module.exports = [clientBundleConfig, serverBundleConfig];
return [clientBundleConfig, serverBundleConfig];
};
166 changes: 83 additions & 83 deletions templates/Angular2Spa/webpack.config.vendor.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,88 +1,88 @@
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');
const path = require('path');
const webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const merge = require('webpack-merge');

var sharedConfig = {
resolve: { extensions: [ '', '.js' ] },
module: {
loaders: [
{ test: /\.json$/, loader: require.resolve('json-loader') },
{ test: /\.(png|woff|woff2|eot|ttf|svg)(\?|$)/, loader: 'url-loader?limit=100000' }
module.exports = (env) => {
const extractCSS = new ExtractTextPlugin('vendor.css');
const isDevBuild = !(env && env.prod);
const sharedConfig = {
stats: { modules: false },
resolve: { extensions: [ '.js' ] },
module: {
rules: [
{ test: /\.(png|woff|woff2|eot|ttf|svg)(\?|$)/, use: 'url-loader?limit=100000' }
]
},
entry: {
vendor: [
'@angular/common',
'@angular/compiler',
'@angular/core',
'@angular/http',
'@angular/platform-browser',
'@angular/platform-browser-dynamic',
'@angular/router',
'@angular/platform-server',
'angular2-universal',
'angular2-universal-polyfills',
'bootstrap',
'bootstrap/dist/css/bootstrap.css',
'es6-shim',
'es6-promise',
'event-source-polyfill',
'jquery',
'zone.js',
]
},
output: {
publicPath: '/dist/',
filename: '[name].js',
library: '[name]_[hash]'
},
plugins: [
new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery' }), // Maps these identifiers to the jQuery package (because Bootstrap expects it to be a global variable)
new webpack.ContextReplacementPlugin(/\@angular\b.*\b(bundles|linker)/, path.join(__dirname, './ClientApp')), // Workaround for https://github.com/angular/angular/issues/11580
new webpack.IgnorePlugin(/^vertx$/) // Workaround for https://github.com/stefanpenner/es6-promise/issues/100
]
},
entry: {
vendor: [
'@angular/common',
'@angular/compiler',
'@angular/core',
'@angular/http',
'@angular/platform-browser',
'@angular/platform-browser-dynamic',
'@angular/router',
'@angular/platform-server',
'angular2-universal',
'angular2-universal-polyfills',
'bootstrap',
'bootstrap/dist/css/bootstrap.css',
'es6-shim',
'es6-promise',
'event-source-polyfill',
'jquery',
'zone.js',
]
},
output: {
publicPath: '/dist/',
filename: '[name].js',
library: '[name]_[hash]'
},
plugins: [
new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery' }), // Maps these identifiers to the jQuery package (because Bootstrap expects it to be a global variable)
new webpack.ContextReplacementPlugin(/\@angular\b.*\b(bundles|linker)/, path.join(__dirname, './ClientApp')), // Workaround for https://github.com/angular/angular/issues/11580
new webpack.IgnorePlugin(/^vertx$/), // Workaround for https://github.com/stefanpenner/es6-promise/issues/100
new webpack.NormalModuleReplacementPlugin(/\/iconv-loader$/, require.resolve('node-noop')), // Workaround for https://github.com/andris9/encoding/issues/16
]
};
};

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 } })
])
});
const clientBundleConfig = merge(sharedConfig, {
output: { path: path.join(__dirname, 'wwwroot', 'dist') },
module: {
rules: [
{ test: /\.css(\?|$)/, use: extractCSS.extract({ loader: 'css-loader' }) }
]
},
plugins: [
extractCSS,
new webpack.DllPlugin({
path: path.join(__dirname, 'wwwroot', 'dist', '[name]-manifest.json'),
name: '[name]_[hash]'
})
].concat(isDevBuild ? [] : [
new webpack.optimize.UglifyJsPlugin()
])
});

var serverBundleConfig = merge(sharedConfig, {
target: 'node',
resolve: { packageMains: ['main'] },
output: {
path: path.join(__dirname, 'ClientApp', 'dist'),
libraryTarget: 'commonjs2',
},
module: {
loaders: [ { test: /\.css(\?|$)/, loader: 'to-string-loader!css-loader' } ]
},
entry: { vendor: ['aspnet-prerendering'] },
plugins: [
new webpack.DllPlugin({
path: path.join(__dirname, 'ClientApp', 'dist', '[name]-manifest.json'),
name: '[name]_[hash]'
})
]
});
const serverBundleConfig = merge(sharedConfig, {
target: 'node',
resolve: { mainFields: ['main'] },
output: {
path: path.join(__dirname, 'ClientApp', 'dist'),
libraryTarget: 'commonjs2',
},
module: {
rules: [ { test: /\.css(\?|$)/, use: ['to-string-loader', 'css-loader'] } ]
},
entry: { vendor: ['aspnet-prerendering'] },
plugins: [
new webpack.DllPlugin({
path: path.join(__dirname, 'ClientApp', 'dist', '[name]-manifest.json'),
name: '[name]_[hash]'
})
]
});

module.exports = [clientBundleConfig, serverBundleConfig];
return [clientBundleConfig, serverBundleConfig];
}
8 changes: 4 additions & 4 deletions templates/KnockoutSpa/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,14 @@
"@types/requirejs": "^2.1.26",
"@types/signals": "0.0.16",
"@types/whatwg-fetch": "0.0.30",
"aspnet-webpack": "^1.0.17",
"aspnet-webpack": "^1.0.27",
"awesome-typescript-loader": "3.0.0-beta.13 || ^3.0.0",
"bootstrap": "^3.3.6",
"bundle-loader": "^0.5.4",
"crossroads": "^0.12.2",
"css-loader": "^0.25.0",
"event-source-polyfill": "^0.0.7",
"extract-text-webpack-plugin": "^1.0.1",
"extract-text-webpack-plugin": "^2.0.0-rc",
"file-loader": "^0.9.0",
"history": "^4.3.0",
"isomorphic-fetch": "^2.2.1",
Expand All @@ -27,10 +28,9 @@
"knockout": "^3.4.0",
"raw-loader": "^0.5.1",
"style-loader": "^0.13.1",
"ts-loader": "^0.8.2",
"typescript": "^2.0.3",
"url-loader": "^0.5.7",
"webpack": "^1.13.2",
"webpack": "^2.2.0",
"webpack-hot-middleware": "^2.12.2"
}
}
Loading