angular - Cannot read property 'split' of undefined -
i have following code running on local server.
<!doctype html> <html> <head> <link rel="stylesheet" href="style.css"> <script src="https://jspm.io/system@0.16.js"></script> <script src="https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js"></script> </head> <body> <my-app></my-app> <script> system.config({ paths: { '*': '*.js', 'angular2/*': 'angular2/*' } }); system.import('main'); </script> </body> </html> the above index.html page.
import {component, view, bootstrap} 'angular2/angular2'; @component({ selector: 'my-app' }) @view({ template: '<h1>my first angular 2 app</h1>' }) class appcomponent { } bootstrap(appcomponent); the above main.js file.
when run on server following in console.
http://localhost:63342/es6/main.js:3:1: unexpected token @ angular2.dev.js:752 typeerror: error loading "main" @ http://localhost:63342/es6/main.js cannot read property 'split' of undefined angular2.dev.js:753 typeerror: error loading "main" @ http://localhost:63342/es6/main.js cannot read property 'split' of undefined @ zone.longstacktracezone.getlongstacktrace (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:728:35) @ zone.longstacktracezone.onerror (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:753:19) @ zone.run (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:92:14) @ zoneboundfn (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:66:19) @ d (https://jspm.io/es6-module-loader@0.16.5.js:1:7439) @ (https://jspm.io/es6-module-loader@0.16.5.js:1:7071) @ o.7.o.when (https://jspm.io/es6-module-loader@0.16.5.js:1:10745) @ w.7.w.run (https://jspm.io/es6-module-loader@0.16.5.js:1:9781) @ e.3.e._drain (https://jspm.io/es6-module-loader@0.16.5.js:1:1740) @ 3.e.drain (https://jspm.io/es6-module-loader@0.16.5.js:1:1394) --- sun apr 26 2015 08:27:39 gmt+0530 (ist) - 738ms ago error @ function.getstacktracewithuncaughterror (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:699:32) @ zone.longstacktracezone.fork (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:758:43) @ zone.bind (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:64:21) @ function.zone.bindarguments (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:195:22) @ t.fnnames.foreach.obj.(anonymous function) [as then] (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:186:42) @ k (https://jspm.io/es6-module-loader@0.16.5.js:1:21515) @ https://jspm.io/es6-module-loader@0.16.5.js:1:22664 @ zone.run (https://code.angularjs.org/2.0.0- alpha.19/angular2.dev.js:89:19) @ zoneboundfn (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:66:19) @ d (https://jspm.io/es6-module-loader@0.16.5.js:1:7439) --- sun apr 26 2015 08:27:39 gmt+0530 (ist) - 739ms ago error @ function.getstacktracewithuncaughterror (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:699:32) @ zone.longstacktracezone.fork (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:758:43) @ zone.bind (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:64:21) @ function.zone.bindarguments (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:195:22) @ t.fnnames.foreach.obj.(anonymous function) [as then] (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:186:42) @ x.import (https://jspm.io/es6-module-loader@0.16.5.js:1:22539) @ x.$__global.upgradesystemloader.e.import (https://jspm.io/system@0.16.7.js:5:1180) @ http://localhost:63342/es6/index.html:17:18 angular2.dev.js:752 typeerror: cannot read property '__usedefault' of undefined angular2.dev.js:753 typeerror: cannot read property '__usedefault' of undefined @ https://jspm.io/system@0.16.7.js:5:1220 @ zone.run (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:89:19) @ zoneboundfn (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:66:19) @ d (https://jspm.io/es6-module-loader@0.16.5.js:1:7439) @ (https://jspm.io/es6-module-loader@0.16.5.js:1:7071) @ o.7.o.when (https://jspm.io/es6-module-loader@0.16.5.js:1:10745) @ w.7.w.run (https://jspm.io/es6-module-loader@0.16.5.js:1:9781) @ e.3.e._drain (https://jspm.io/es6-module-loader@0.16.5.js:1:1740) @ 3.e.drain (https://jspm.io/es6-module-loader@0.16.5.js:1:1394) @ mutationobserver.t (https://jspm.io/es6-module-loader@0.16.5.js:1:3302) --- sun apr 26 2015 08:27:39 gmt+0530 (ist) - 742ms ago error @ function.getstacktracewithuncaughterror (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:699:32) @ zone.longstacktracezone.fork (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:758:43) @ zone.bind (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:64:21) @ function.zone.bindarguments (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:195:22) @ t.fnnames.foreach.obj.(anonymous function) [as then] (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:186:42) @ x.$__global.upgradesystemloader.e.import (https://jspm.io/system@0.16.7.js:5:1195) @ http://localhost:63342/es6/index.html:17:18 the above code taken angular.io, official angular 2 website. if same code executed in plunkr, output "my first angular 2 app" not in local.
am missing something?
it seems have import traceur-runtime.js , set traceur options.
here plunker link
<!doctype html> <html> <head> <link rel="stylesheet" href="style.css"> <script src="https://github.jspm.io/jmcriffey/bower-traceur-runtime@0.0.87/traceur-runtime.js"></script> <script src="https://jspm.io/system@0.16.js"></script> <script src="https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js"></script> </head> <body> <my-app></my-app> <script> system.config({ traceuroptions: { annotations: true, membervariables: true, types: true }, paths: { '*': '*.js', 'angular2/*': 'angular2/*' } }); system.import('main'); </script> </body> </html>
Comments
Post a Comment