Hello,
I have setup a ionic2 project with “ionic start MyIonic2Project tutorial --v2 --ts” maybe on beta 6.
I went directly to Beta 10, having missed Beta 8. I adopted the Beta 8 breaking changes on Beta 10.
after the changes, I switched to webpack + ts-loader for ionic-gulp tasks (the browserify+tsify gave me a lot of headaches handling external ts modules), and this was successful. because I can bring up apps by “ionic serve --lab”.
however, while playing around, I found that the ion-navbar stopped working. see snapshot below
I did another “ionic start MyIonic2Project tutorial --v2 --ts” , in the same environment. and it works fines.
I compared the codes file by file. and found out that the code are almost the same, the only difference is that “@Page” was still there (these should have been replace by @Component).
I am not sure if the “@Page” was just a heedless or on purpose
my “ionic info” :
Cordova CLI: 6.2.0
Ionic Framework Version: 2.0.0-beta.10
Ionic CLI Version: 2.0.0-beta.30
Ionic App Lib Version: 2.0.0-beta.16
OS: Distributor ID: Ubuntu Description: Ubuntu 14.04.4 LTS
Node Version: v6.2.2
my “package.json” :
{
“dependencies”: {
“@angular/common”: “^2.0.0-rc.1”,
“@angular/compiler”: “^2.0.0-rc.1”,
“@angular/core”: “^2.0.0-rc.1”,
“@angular/http”: “^2.0.0-rc.1”,
“@angular/platform-browser”: “^2.0.0-rc.1”,
“@angular/platform-browser-dynamic”: “^2.0.0-rc.1”,
“@angular/router”: “^2.0.0-rc.1”,
“es6-shim”: “^0.35.1”,
“fbsts”: “^1.0.17”,
“ionic-angular”: “2.0.0-beta.10”,
“ionic-native”: “^1.3.2”,
“ionicons”: “3.0.0”,
“node-uuid”: “^1.4.7”,
“reflect-metadata”: “^0.1.3”,
“rxjs”: “^5.0.0-beta.6”,
“zone.js”: “^0.6.12”
},
“devDependencies”: {
“del”: “2.2.1”,
“gulp”: “3.9.1”,
“gulp-watch”: “4.3.8”,
“ionic-gulp-fonts-copy”: “^1.0.0”,
“ionic-gulp-html-copy”: “^1.0.0”,
“ionic-gulp-sass-build”: “^1.0.0”,
“ionic-gulp-scripts-copy”: “^2.0.0”,
“ionic-gulp-webpack”: “^2.0.0”,
“run-sequence”: “1.2.1”,
“ts-loader”: “^0.8.2”,
“typescript”: “1.8.10”,
“typings”: “1.3.1”
},
“cordovaPlugins”: [
“cordova-plugin-console”,
“cordova-plugin-device”,
“cordova-plugin-whitelist”,
“cordova-plugin-statusbar”,
“cordova-plugin-splashscreen”,
“ionic-plugin-keyboard”
],
“cordovaPlatforms”: [
“android”,
“ios”
],
“name”: “tsender”,
“description”: “tsender: An Ionic project”,
“license”: “ISC”,
“repository”: {
“type”: “git”,
“url”: “git@bitbucket.org:gubneo/tsender.git”
}
}
my “tsconfig.json”:
{
“compilerOptions”: {
“target”: “es5”,
“module”: “commonjs”,
“moduleResolution”: “node”,
“emitDecoratorMetadata”: true,
“experimentalDecorators”: true,
“noImplicitAny”: false,
“sourceMap”: true,
“removeComments”: false
},
“filesGlob”: [
“/*.ts",
"!node_modules//*”
],
“exclude”: [
“node_modules”,
“typings/main”,
“typings/main.d.ts”
],
“compileOnSave”: false,
“atom”: {
“rewriteTsconfig”: false
}
}
and my “webpack.config.json”;
require(‘webpack’);
var path = require(‘path’);
module.exports = {
entry: [
path.resolve(‘app/app.ts’)
],
output: {
path: path.resolve(‘www/build/js’),
filename: ‘app.bundle.js’
},
devtool: 'source-map',
resolve: { extensions: ['', '.js', '.ts', '.webpack.js', '.web.js'] },
module: { loaders: [ { test: /\.ts(x?)$/, loader: 'ts-loader' } ] }}
cheers