web-dev-qa-db-fra.com

Angular donne @ angular/core 404 erreur non trouvée lors de l'utilisation de directives

Quand j'ajoute cette ligne de code dans mon @Component:

directives: [HeroDetailComponent]

Le code rompt et me donne cette erreur:

GET http://localhost:3000/@angular/core 404 (Not Found)

Ce sont les scripts dans mon index.html:

<script src="node_modules/es6-shim/es6-shim.min.js"></script>
<script src="node_modules/systemjs/dist/system-polyfills.js"></script>
<script src="node_modules/angular2/es6/dev/src/testing/shims_for_IE.js"></script>   

<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>

Si je manque des informations pour diagnostiquer ce problème, dites-le-moi et je l'inclurai ici.

angularangular-directive
6
think123

Si vous souhaitez utiliser la version RC de Angular2, vous devez configurer SystemJS de la manière suivante:

var packages = {
  'app': { main: 'main.js',  defaultExtension: 'js' },
  'rxjs': { defaultExtension: 'js' },
  'angular2-in-memory-web-api': { defaultExtension: 'js' },
};

var packageNames = [
  '@angular/common',
  '@angular/compiler',
  '@angular/core', // <--------
  '@angular/http',
  '@angular/platform-browser',
  '@angular/platform-browser-dynamic',
  '@angular/router',
  '@angular/router-deprecated',
  '@angular/testing',
  '@angular/upgrade',
];

packageNames.forEach(function(pkgName) {
  packages[pkgName] = { main: 'index.js', defaultExtension: 'js' };
});

var config = {
  map: map,
  packages: packages
}

System.config(config);

Si vous souhaitez utiliser les versions bêta, après avoir inclus le fichier node_modules/angular2/bundles/angular2.dev.js dans un élément script, importez plutôt ce package:

import {Component, Directive, ...} from 'angular2/core';
7
Thierry Templier

J'ai eu la même erreur lorsque j'ai essayé de suivre le tutoriel Angular 2 à https://angular.io/docs/ts/latest/tutorial/toh-pt3.html .

Mais je découvre que le problème est que j'ai eu une faute de frappe dans app.component.ts, la première ligne devrait être:

import { Component } from '@angular/core';

Mais j'ai écrit une lettre majuscule de 'noyau':

import { Component } from '@angular/Core'

Mon conseil est donc de vous assurer d'écrire le bon nom de la ressource avant d'essayer de modifier SystemJS.

4
Rafy

change ça 

import { InMemoryBackendService, SEED_DATA } from 'angular2-in-memory-web-api';

vers - >> 

import { InMemoryBackendService, SEED_DATA } from 'angular2-in-memory-web-api/in-memory-backend.service';

dans votre main.ts

0
AutoMEta