CODEWITHSUNDEEP
angular
Bahodir
Bahodir

Reputation: 539

Angular 2 RC6 Error: ReferenceError: $traceurRuntime is not defined

I am updating rc5 project to rc6. When I serve the project, I am getting Error: ReferenceError: $traceurRuntime is not defined. I do not even know what is wrong. My system.config.js looks as following: 

(function (global) {
  var map = {
    'app': 'app'
  };
  var packages = {
    'app': { main: 'main.js', defaultExtension: 'js' },
    'rxjs': { defaultExtension: 'js' },
  };
  var ngPackageNames = [
    'common',
    'compiler',
    'core',
    'forms',
    'http',
    'platform-browser',
    'platform-browser-dynamic',
    'router'
  ];
  // Add package entries for angular packages
  ngPackageNames.forEach(function packIndex(pkgName) {
    packages['@angular/' + pkgName] = { main: 'index.js', defaultExtension: 'js' };
  });

  System.config({
    defaultJSExtensions: true,
    map: map,
    packages: packages
  });
})(this);

index.html as following:

<!DOCTYPE html>
<html lang="en">

<head>
  <base href="/">
  <title>Angular2 rc6</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <link rel="stylesheet" type="text/css" href="../node_modules/bootstrap/dist/css/bootstrap.min.css" />
  <!-- endbuild -->

  <!-- build:js lib/core.js -->
  <script src="../node_modules/core-js/client/shim.min.js"></script>
  <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.src.js"></script>
  <!-- endbuild -->
  <!-- dependencies  -->
  <script src="lib/dependencies.bundle.js"></script>

  <!-- build:js lib/dependencies.bundle.js 
  <script src="../node_modules/rxjs/bundles/Rx.js"></script>
  <script src="../node_modules/@angular/common/bundles/common.umd.js"></script>
  <script src="../node_modules/@angular/compiler/bundles/compiler.umd.js"></script>
  <script src="../node_modules/@angular/core/bundles/core.umd.js"></script>
  <script src="../node_modules/@angular/forms/bundles/forms.umd.js"></script>
  <script src="../node_modules/@angular/http/bundles/http.umd.js"></script>
  <script src="../node_modules/@angular/platform-browser/bundles/platform-browser.umd.js"></script>
  <script src="../node_modules/@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js"></script>
  <script src="../node_modules/@angular/router/bundles/router.umd.js"></script>
  -->
  <!-- endbuild -->

  <!-- 2. Configure SystemJS -->
  <script src="systemjs.config.js"></script>
  <script>
    System.import('app/main').catch(function(err){ console.error(err); });
  </script>
</head>

<body>
  <app>Loading...</app>
</body>

</html>

I assume this is issue is somehow systemjs related, but cannot figure out what am I really doing wrong?

Edit: I have found that the problem is in dependencies.bundle.js, that I am generating for dependencies bundle.

 System.register("@angular/http/src/static_request.js", ["@angular/http/src/facade/lang.js", "@angular/http/src/body.js", "@angular/http/src/enums.js", "@angular/http/src/headers.js", "@angular/http/src/http_utils.js", "@angular/http/src/url_search_params.js"], function($__export) {
      "use strict";
...
w = (typeof window === 'undefined' ? 'undefined' : $traceurRuntime.typeof(window)) == 'object' ? window : noop;

Upvotes: 1

Views: 1082

Answers (2)

Marcin
Marcin

Reputation: 41

SystemJs use traucer as default transpiler, somehow adding:

transpiler: false

to my systemjs config resolved this issue for me.

Reference: https://github.com/systemjs/systemjs/blob/master/docs/config-api.md#transpiler

Upvotes: 1

Kriskit
Kriskit

Reputation: 51

Since RC6 it looks like you now have to use the UMD bundles if using SystemJS to load Angular.

From the Changelog

npm packages: code in ESM (ES6 Modules) format is now published at the default location in the npm package with package.json's main entry pointing to an UMD bundle (primarily for node, and webpack 1 users).

If you are using SystemJS to load Angular, you should adjust your SystemJS configuration to point to the UMD bundles (present in the npm package).

Please see this example SystemJS config.

I'm using SystemJS Builder and this change has given me some serious problems that I need to sort out.

Upvotes: 5

Related Questions