Angular2 systemjs.config.js '"ReferenceError: System не определен"

Я прочитал все другие сообщения с этой идентичной проблемой, но не смог решить проблему.Angular2 systemjs.config.js '"ReferenceError: System не определен"

Если я скомпилирую javascript в браузере, я получаю две ошибки 404 для @ угловых/http и @ угловых/ядро.

Когда я устанавливаю конфигурационный файл для transpile первым, я получаю ошибку компиляции в system.config.js:

«ReferenceError: Система не определен» на этой линии

var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;

Я начал проект из руководства по быстрому запуску и проспекта Heros Http.

После сравнения всех моих файлов с теми, что были в быстром запуске, я просмотрел и скопировал файлы быстрого запуска в свой проект.

Уверен, что я пропустил что-то основное, но зашел в тупик. FYI: Я новичок в Angular and Angular2. Использование WebStorm для разработки и компиляции.

Вот index.html и systemjs.config.js

//system.config.js 
 
(function(global) { 
 
    // map tells the System loader where to look for things 
 
    var map = { 
 
     'app':      'app', // 'dist', 
 
     '@angular':     'node_modules/@angular', 
 
     'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api', 
 
     'rxjs':      'node_modules/rxjs' 
 
    }; 
 
    // packages tells the System loader how to load when no filename and/or no extension 
 
    var packages = { 
 
     'app':      { main: 'main.js', defaultExtension: 'js' }, 
 
     'rxjs':      { defaultExtension: 'js' }, 
 
     'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }, 
 
    }; 
 
    var ngPackageNames = [ 
 
     'common', 
 
     'compiler', 
 
     'core', 
 
     'forms', 
 
     'http', 
 
     'platform-browser', 
 
     'platform-browser-dynamic', 
 
     'router', 
 
     'router-deprecated', 
 
     'upgrade', 
 
    ]; 
 
    // Individual files (~300 requests): 
 
    function packIndex(pkgName) { 
 
     packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' }; 
 
    } 
 
    // Bundled (~40 requests): 
 
    function packUmd(pkgName) { 
 
     packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' }; 
 
    } 
 
    // Most environments should use UMD; some (Karma) need the individual index files 
 
    var setPackageConfig = System.packageWithIndex ? packIndex : packUmd; 
 
    // Add package entries for angular packages 
 
    ngPackageNames.forEach(setPackageConfig); 
 
    var config = { 
 
     map: map, 
 
     packages: packages 
 
    }; 
 
    System.config(config); 
 
})(this);

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <title>Generic Form</title> 
 
    <meta charset="UTF-8"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 

 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css"> 
 
    <link rel="stylesheet" href="styles.css"> 
 
    <link rel="stylesheet" href="forms.css"> 
 

 
    <!-- Polyfill(s) for older browsers --> 
 
    <script src="https://npmcdn.com/core-js/client/shim.min.js"></script> 
 
    <script src="https://npmcdn.com/[email protected]?main=browser"></script> 
 
    <script src="https://npmcdn.com/[email protected]"></script> 
 
    <script src="https://npmcdn.com/[email protected]/dist/system.src.js"></script> 
 
    <script src="systemjs.config.js"></script> 
 

 
    <script> 
 
     System.import('app').catch(function(err){ console.error(err); }); 
 
    </script> 
 
    </head> 
 

 
    <body> 
 
    <my-app>Loading...</my-app> 
 
    </body> 
 

 
</html>

Edit: Это точка в моей HTTP-service.component.ts файл, в котором я получаю ошибки 404:

import { Injectable } from '@angular2/core'; 
import { Http, Response } from '@angular2/http'; 
import { Headers, RequestOptions } from '@angular2/http'; 
import { Observable } from 'rxjs/Observable';

Пожалуйста, дайте мне знать, что другие файлы помогут. Я ценю любую проницательность!

источник

2016-06-27 saka

Вы видите JS файлы в каталоге? как вы строите проект? – Avi

Я вижу http и core в узловой папке node_modules/@. – saka

Я использую SystemJS для сборки вещей, и я просто (здание?) Запускаю его из WebStorm – saka

текущие версии угловой 2 использования «@angular» вместо того, что бета использует «» angular2

import { Injectable } from '@angular/core'; 
import { Http, Response } from '@angular/http'; 
import { Headers, RequestOptions } from '@angular/http'; 
import { Observable } from 'rxjs/Observable';

источник

2016-06-27 19:28:40

Angular2 systemjs.config.js '"ReferenceError: System не определен"

ответ

Смежные вопросы