Why do I get "TypeError: Reflect.getOwnMetadata is not a function"

Question

I'm working on File Upload with Angular2 and Node.js with ng2-File-Upload but while running my project i got an error related to Reflect.getOwnMetadata here is the error shown :

and here is my systemjs.config.js

(function (global) {
  System.config({
    paths: {
      // paths serve as alias
      'npm:': 'node_modules/'
    },
    // map tells the System loader where to look for things
    map: {
      // our app is within the app folder
      app: 'app',
      // angular bundles
      '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
      '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
      '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
      '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
      '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
      '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
      '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
      '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
      // other libraries
      'rxjs':                      'npm:rxjs',
      'angular-in-memory-web-api': 'npm:angular-in-memory-web-api',
      /** Path for ng2-file-upload */
      'ng2-file-upload' : 'npm:ng2-file-upload' 
      /** Path for ng2-file-upload */
    },
    // packages tells the System loader how to load when no filename and/or no extension
    packages: {
      app: {
        main: './transpiled-js/main.js',
        defaultExtension: 'js'
      },
      rxjs: {
        defaultExtension: 'js'
      },
      'angular-in-memory-web-api': {
        main: './index.js',
        defaultExtension: 'js'
      },
      /** Configuration for ng2-file-upload */
      'ng2-file-upload' : { 
        main: './ng2-file-upload.js',
        defaultExtension: 'js'
      }
      /** Configuration for ng2-file-upload */
    }
  });
})(this);

Answer 1

This is the scenario when I faced the exact same issue:

I had two TypeScript files with the same name (say, FileUploadService.ts) residing in two different locations. One was for handling server logic (residing in a server directory), and the other in a public directory for file upload through an Angular service.

The problem was that I was importing the wrong service in a location where the ng2-file-upload package was used, which in turn depends on Angular modules - which were never being imported.

This meant that the file where Reflect.getOwnMetadata is defined somewhere was unavailable during the Typescript compilation.

Please make sure you reference the correct file in the correct location which might be the case for you too.