These are chat archives for AngularClass/angular2-webpack-starter
An Angular 2 Webpack Starter kit featuring Angular 2, Router, TypeScript, and Webpack by AngularClass
package.json
@TheLarkInn (in order for you to see my webpack
version): "webpack": "^1.12.11",
"webpack-dev-server": "^1.14.1",
"webpack-stream": "^3.1.0",
"webpack-vendor-chunk-plugin": "^1.0.0”
I’m not sure to understand what you mean by "setting up CommonsChunkPlugin incorrectly”, what are the things I can set in CommonsChunkPlugin
, and how can I do that?
Anyway, in the meantime I’ve changed my webpack.config.js
to this:
var webpack = require('webpack');
var path = require('path');
module.exports = {
entry: {
app: './app/boot.ts',
vendor: './vendor.ts'
},
output: {
path: 'bin',
filename: 'bundle.js'
},
devtool: 'source-map',
plugins: [
new webpack.optimize.CommonsChunkPlugin('vendor', 'deps.js'),
new webpack.optimize.UglifyJsPlugin({
// disable mangling due to bug in beta.1, beta.2, beta.3
comments: false,
compress: {
screw_ie8 : true,
warnings: false
},
sourceMap: false
})
],
resolve: {
extensions: ['', '.js', '.ts']
},
module: {
loaders: [
{ test: /\.ts$/, loader: 'ts-loader' },
{ test: /\.html$/, loader: 'raw-loader' },
{ test: /\.css$/, loader: 'raw-loader' }
],
noParse: [
path.join(__dirname, 'node_modules', 'angular2', 'bundles')
]
}
};
and I don’t have the webpackJsonp is not defined
error, but this one instead:
Uncaught reflect-metadata shim is required when using class decorators
Thanks a lot for your help!
In the meantime I’ve modified my webpack.config.json
as following:
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var helpers = require('./helpers');
module.exports = {
devtool: 'cheap-module-eval-source-map',
entry: {
'polyfills': './polyfills.ts',
'vendor': './vendor.ts',
'app': './app/boot.ts'
},
output: {
path: 'bin',
publicPath: 'http://localhost:8080/',
filename: '[name].js'
},
resolve: {
extensions: ['', '.js', '.ts']
},
module: {
loaders: [
{test: /\.ts$/, loader: 'ts'},
{test: /\.html$/, loader: 'html'},
{test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/, loader: 'file?name=assets/[name].[hash].[ext]'},
{test: /\.css$/, exclude: helpers.root('app'), loader: ExtractTextPlugin.extract('style', 'css?sourceMap')},
{test: /\.css$/, include: helpers.root('app'), loader: 'raw'}
]
},
plugins: [
new webpack.optimize.CommonsChunkPlugin({name: ['app', 'vendor', 'polyfills']}),
new HtmlWebpackPlugin({template: './index.html'}),
new webpack.optimize.UglifyJsPlugin(),
new ExtractTextPlugin('[name].css')
],
devServer: {
historyApiFallback: true,
stats: 'minimal'
}
};
and I’m not getting this error anymore @TheLarkInn (so it’s progressing, I guess!), but this one is appearing instead:
Cannot resolve all parameters for 'DeviceService'(?). Make sure that all the parameters are decorated with Inject or have valid type annotations and that 'DeviceService' is decorated with Injectable.
It looks like it’s coming from the way I’m importing my services but I’m not sure about it, what do you think I’m missing here?
@Injectable()
export class DeviceService {
devices: Observable<Array<Device>>;
constructor(private http:Http) {
this.devices = checkBeforeRequest(Observable.interval(500)
.switchMapTo(this.http.get(server))
.map(res => (<Response>res).json()));
}
getDevices() {
return this.devices;
}
//… And other stuffs not here for the sake of brevity
boot
:bootstrap(App, [
provide(APP_BASE_HREF, {useValue: BASE_URL}),
ROUTER_PROVIDERS, HTTP_PROVIDERS, MATERIAL_PROVIDERS,
DeviceService, AggregatorService, SplitterService, MeterService,
provideStore({
aggregators,
splitters,
counters,
areas,
selectedArea,
selectedBuilding,
selectedMeter,
moreSplitters,
selectedCounterId,
evenMoreSplitters,
countersMeters
}),
localStorageMiddleware([
'aggregators',
'splitters',
'counters',
'areas',
'selectedArea',
'selectedBuilding',
'selectedMeter',
'moreSplitters',
'selectedCounterId',
'evenMoreSplitters',
'countersMeters'
], true)
])
.catch(err => console.error(err));
boot
DeviceService
from the boot
, I’ve got a similar error on the AggregatorService
, so I think it’s only because it’s the first in my list of arguments @TheLarklnn