Unable to load transpiler

Question

I have an Angular application running on Node that I recently just started having issues with. I am having an error with the transpiler: Please see image.

Chrome Developer Image

So the app was working and I was trying to get mmmagic loaded so that I could evaluate uploaded files. Well I could not for anohter reason. But during that process I started updating most of the NPM packages. I gave up on getting mmmagic loaded and was going to work on something else when I started getting this error. Based on the image I uploaded I don't undertstand how it is not loading typescript. I have tried everything that I can think of, updated most packages, change values in the tsconfig.json, systemjs.config.js, reloaded the node_modules... Typescript is there but for some reason it does not load it.

System.config({
transpiler: 'typescript.js',
typescriptOptions: {
    emitDecoratorMetadata: true,
    target: "ES5",
    module: "commonjs"},
map: {
    '@angular': 'node_modules/@angular',
    'rxjs'    : 'node_modules/rxjs',
},
paths: {
    'node_modules/@angular/*': 'node_modules/@angular/*/bundles'
},
meta: {
    '@angular/*': {'format': 'cjs'},
    'typescript': {
        "exports": "ts"
    }
},
packages: {
    'app'                              : {main: 'main', defaultExtension: 'ts'},
    'rxjs'                             : {main: 'Rx'},
    '@angular/core'                    : {main: 'core.umd.min.js'},
    '@angular/common'                  : {main: 'common.umd.min.js'},
    '@angular/compiler'                : {main: 'compiler.umd.min.js'},
    '@angular/router'                  : {main: 'router.umd.min.js'},
    '@angular/forms'                   : {main: 'forms.umd.min.js'},
    '@angular/http'                    : {main: 'http.umd.min.js'},
    '@angular/platform-browser'        : {main: 'platform-browser.umd.min.js'},
    '@angular/platform-browser-dynamic': {main: 'platform-browser-dynamic.umd.min.js'}
}

});

If there is anything I can upload that might help please let me know. I seem to have run into a road block with this.

Thanks

---

UPDATE

So I am still doing some research and was able to get past the original issue by specifying the full path in the systemjs.config.js.

map: {
    '@angular': 'node_modules/@angular',
    'rxjs'    : 'node_modules/rxjs',
    'typescript': 'node_modules/typescript/lib/typescript.js'
},

So now I am not getting any issues with not loading the transpiler but now I get this error.

Error: typescript is not a valid transpiler plugin.

See image enter image description here

I have no idea what this is about now, almost going backwords....

Thanks

Answer 1

I could not let this one rest. So the beginning of this issues is documented here

https://github.com/systemjs/systemjs/issues/1587

It seems the default loader for the transpiler was changed. So I followed the suggestion from "guybedford" on the thread from above. Had to install the plugin-typescript and configure it accordingly. Below is the updated Systemjs.config file.

System.config({
transpiler: 'ts',
typescriptOptions: {
    emitDecoratorMetadata: true,
    experimentalDecorators: true,
    target: "ES5",
    module: "system"
    //module: "commonjs"
    },
map: {
    '@angular': 'node_modules/@angular',
    'rxjs'    : 'node_modules/rxjs',
    'typescript': 'node_modules/typescript/',
    'ts': 'node_modules/plugin-typescript/lib'
},
paths: {
    'node_modules/@angular/*': 'node_modules/@angular/*/bundles'
},
meta: {
    '@angular/*': {'format': 'cjs'},
    'node_modules/typescript/lib/typescript.js': {
        'exports': 'ts'
    }
},
packages: {
    'app'                              : {main: 'main', defaultExtension: 'ts'},
    'rxjs'                             : {main: 'Rx'},
    '@angular/core'                    : {main: 'bundles/core.umd.min.js'},
    '@angular/common'                  : {main: 'bundles/common.umd.min.js'},
    '@angular/compiler'                : {main: 'bundles/compiler.umd.min.js'},
    '@angular/router'                  : {main: 'bundles/router.umd.min.js'},
    '@angular/forms'                   : {main: 'bundles/forms.umd.min.js'},
    '@angular/http'                    : {main: 'bundles/http.umd.min.js'},
    '@angular/platform-browser'        : {main: 'bundles/platform-browser.umd.min.js'},
    '@angular/platform-browser-dynamic': {main: 'bundles/platform-browser-dynamic.umd.min.js'},
    'ts'                               : {main: 'plugin.js'},
    'typescript'                       : {main: 'lib/typescript.js'}
}

});