angulartypescript1.5jspmsystemjs

Angular2 + Jspm.io : reflect-metadata shim is required when using class decorators


I am having the following problem running the below versions of JSPM with Angular2 and SystemJS (Versions: Angular@2.0.0-alpha.27 with JSPM@0.16.0-beta.2 and SystemJS@0.18.0) That once the typescript is compiled (without errors) i get the following error in the browser:

/jspm_packages/npm/angular2@2.0.0-alpha.27/src/util/decorators.js:70 Uncaught reflect-metadata shim is required when using class decorators

Now when i manually include the file Reflect.js: \jspm_packages\npm\reflect-metadata@0.1.0\Reflect.js that problem goes away but the next problem emerges saying list is undefined within another angular file.

See the bitbucket src below for the config files (src code) from both system.js and typescript / jspm.io

https://bitbucket.org/schippie/angular-2-jspm-hello-world/src/8af83f2066e5e3e9eede7db495545234f3b0c04a

What i am wondering is if it's currently even possible to use jspm together with system.js to retrieve all the angular packages that are needed for angular to function normally. Seeing as the config for system.js does state clearly that angular depends on it:

"npm:angular2@2.0.0-alpha.27": {
  "fs": "github:jspm/nodelibs-fs@0.1.2",
  "path": "github:jspm/nodelibs-path@0.1.0",
  "process": "github:jspm/nodelibs-process@0.1.1",
  "reflect-metadata": "npm:reflect-metadata@0.1.0",
  "rx": "npm:rx@2.5.1",
  "url": "github:jspm/nodelibs-url@0.1.0",
  "zone.js": "npm:zone.js@0.5.1"
},

But they are not retrieved (looking at the network tab)


Solution

  • Robwormald wrote a nicely detailed explanation that covers the issues people might have at this point and time trying to get angular alpha 27 to work with jspm and typescript https://gist.github.com/robwormald/429e01c6d802767441ec