Skip to content

Instantly share code, notes, and snippets.

@vladimir-ivanov
Last active November 29, 2015 21:48
Show Gist options
  • Save vladimir-ivanov/817a9517ad57dd9eb1d9 to your computer and use it in GitHub Desktop.
Save vladimir-ivanov/817a9517ad57dd9eb1d9 to your computer and use it in GitHub Desktop.
angular2 webpack config example with two chunks
const webpackConfig = require('../webpack.config.js');
module.exports = function (config) {
config.set({
basePath: '../',
files: [
'build/angular2.js',
// 'build/bundle.js',
'test/unit/app.ts',
'test/unit/**/*.ts'
],
webpack: {
devtool: 'inline-source-map',
quiet: true,
// It suppress everything except error, so it has to be set to false as well
// to see success build.
noInfo: false,
stats: {
// Config for minimal console.log mess.
assets: false,
colors: true,
version: false,
hash: false,
timings: false,
chunks: false,
chunkModules: false
},
module: webpackConfig.module
},
autoWatch: false,
frameworks: ['jasmine'],
singleRun: true,
browsers: ['Chrome'],
plugins: [
'karma-phantomjs2-launcher',
'karma-chrome-launcher',
'karma-coverage',
'karma-junit-reporter',
'karma-jasmine',
'karma-spec-reporter',
'karma-webpack',
'karma-sourcemap-loader'
],
reporters: ['spec', 'junit', 'coverage'],
junitReporter: {
outputFile: 'test-output/test-results.xml',
suite: 'unit'
},
preprocessors: {
// 'src/app.ts': ['webpack', 'sourcemap', 'coverage'], //either this or below bundle.js works with coverage
'bundle.js': ['sourcemap', 'coverage'],
'test/unit/app.ts': ['webpack'],
'test/unit/**/*.ts': ['webpack']
},
coverageReporter: {
type: 'lcov',
dir: 'coverage/',
subdir: 'report'
}
});
};
{
"version": "0.0.1",
"private": true,
"name": "",
"description": "",
"repository": "TBC",
"license": "",
"dependencies": {
"angular2": "2.0.0-alpha.46",
"es6-shim": "^0.33.13",
"ts-loader": "^0.7.2"
},
"devDependencies": {
"jasmine-reporters": "2.0.6",
"jasmine-spec-reporter": "2.4.0",
"karma": "0.13.9",
"karma-chrome-launcher": "0.2.1",
"karma-cli": "0.1.1",
"karma-coverage": "0.5.3",
"karma-jasmine": "0.3.6",
"karma-junit-reporter": "0.3.8",
"karma-phantomjs-launcher": "0.2.1",
"karma-phantomjs2-launcher": "^0.3.2",
"karma-sourcemap-loader": "^0.3.6",
"karma-spec-reporter": "0.0.20",
"karma-webpack": "1.7.0",
"reflect-metadata": "^0.1.2",
"remap-istanbul": "^0.4.0",
"ts-loader": "^0.5.6",
"typescript": "^1.6.2",
"webpack": "^1.12.2",
"webpack-dev-server": "^1.12.1",
"webpack-vendor-chunk-plugin": "^1.0.0"
},
"scripts": {}
}
{
"version": "1.6.2",
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"declaration": false,
"noImplicitAny": false,
"removeComments": true,
"noLib": false,
"emitDecoratorMetadata": true,
"experimentalDecorators": true
}
}
const webpack = require('webpack');
module.exports = {
entry: {
app: './src/app.ts',
angular2: [
'es6-shim',
'reflect-metadata',
'angular2/angular2'
]
},
devtool: 'source-map',
output: {
path: __dirname + '/build',
filename: 'bundle.js'
},
resolve: {
// Add `.ts` and `.tsx` as a resolvable extension.
extensions: ['', '.webpack.js', '.web.js', '.ts', '.tsx', '.js']
},
module: {
loaders: [
// all files with a `.ts` or `.tsx` extension will be handled by `ts-loader`
{ test: /\.ts?$/, loader: 'ts-loader'}
]
},
plugins: [
new webpack.optimize.CommonsChunkPlugin('angular2', 'angular2.js')
]
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment