System.config is not defined

问题

Hi I don't know why I have this error when I want configure my angular project :

System.config is not a funtion

My package.json & html :

{
  "name": "",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@angular/common": "^5.2.0",
    "@angular/compiler": "^5.2.0",
    "@angular/core": "^5.2.0",
    "@angular/platform-browser": "^5.2.0",
    "@angular/platform-browser-dynamic": "^5.2.0",
    "reflect-metadata": "^0.1.12",
    "rxjs": "^5.5.0",
    "systemjs": "^2.0.2",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@types/core-js": "^2.5.0"
  }
}

<html>
<head>
  <script src="node_modules/zone.js/dist/zone.js"></script>
  <script src="node_modules/reflect-metadata/Reflect.js"></script>
  <script src="node_modules/systemjs/dist/system.js"></script>
  <script>

  System.config({
  // the app will need the following dependencies
  map: {
  '@angular/core': 'node_modules/@angular/core/bundles/core.umd.js',
  '@angular/common': 'node_modules/@angular/common/bundles/common.umd.js',
  '@angular/compiler': 'node_modules/@angular/compiler/bundles/compiler.umd.js',
  '@angular/platform-browser': 'node_modules/@angular/platformbrowser/bundles/platform-browser.umd.js',
  '@angular/platform-browser-dynamic': 'node_modules/@angular/platform-browserdynamic/bundles/platform-browser-dynamic.umd.js',
  'rxjs': 'node_modules/rxjs'
  },
  packages: {
  // we want to import our modules without writing '.js' at the end
  // we declare them as packages and SystemJS will add the extension for us
  '.': {}
  }
  });
  // and to finish, let's boot the app!
  System.import('main');
  </script>
</head>
<body>
  <home>
  Hello
  </home>
</body>
</html>

I think is the version of systemJS is to recent but I don't know more....

Is the configuration of SystemJs changed in the latest versions?

回答1:

There seems to be some problem with the latest version of systemjs, you can downgrade it to "0.21.3" version and you will see everything will work just fine.

Checkout angular6-without-cli working repo here.

Note: Make sure you do npm install before give it a try.

回答2:

It looks like the SystemJS 2 way to do this, is to put the config (as valid JSON) in a block like so:

<script type="systemjs-packagemap">

  {
      "map": {
          "@angular/core": "node_modules/@angular/core/bundles/core.umd.js",
          "@angular/common": "node_modules/@angular/common/bundles/common.umd.js",
          "@angular/compiler": "node_modules/@angular/compiler/bundles/compiler.umd.js",
          "@angular/platform-browser": "node_modules/@angular/platformbrowser/bundles/platform-browser.umd.js",
          "@angular/platform-browser-dynamic": "node_modules/@angular/platform-browserdynamic/bundles/platform-browser-dynamic.umd.js",
          "rxjs": "node_modules/rxjs"
        },
        "packages": {
            "main": "../main.js"
        }
    }
</script>
<script src="node_modules/systemjs/dist/system.js"></script>
<script>
    System.import('main');        
</script>

Please note, this has to be placed before the system.js script

More details can be found in their docs

来源：https://stackoverflow.com/questions/52786380/system-config-is-not-defined

标签

angular

systemjs