No se puede encontrar el módulo ‘angular2 / angular2’

Estoy desarrollando una aplicación de nodo con angular2 y gulp. He escrito un archivo de componente login.ts de la siguiente manera:

import {Component, View} from 'angular2/angular2'; import {FormBuilder, formDirectives } from 'angular2/forms'; @Component({ selector: 'login', injectables: [FormBuilder] }) @View({ templateUrl: '/scripts/src/components/login/login.html', directives: [formDirectives] }) export class login { } 

Y mi archivo bootstrap.ts es:

 import {bootstrap} from 'angular2/angular2'; import {login} from './components/login/login'; bootstrap(login); 

pero cuando compilo estos archivos me da los siguientes errores:

 client\bootstrap.ts(1,25): error TS2307: Cannot find module 'angular2/angular2'. client\components\login\login.ts(1,31): error TS2307: Cannot find module 'angular2/angular2 client\components\login\login.ts(2,45): error TS2307: Cannot find module 'angular2/forms'. 

Aquí está mi tsconfig.json:

 { "compilerOptions": { "target": "es5", "module": "commonjs", "sourceMap": true, "watch": true, "removeComments": true, "moduleResolution": "node", "emitDecoratorMetadata": true, "experimentalDecorators": true } } 

He instalado el tipeo para angular2 usando:

 tsd install angular2 --save 

Por favor ayuda a arreglar el error.

yups como dijo @simon error es en las importaciones. pero para las importaciones posteriores he publicado esta respuesta, puede ser que esto también es útil para otros.

 import {Component, View, Directive, Input, Output, Inject, Injectable, provide} from 'angular2/core'; import {bootstrap} from 'angular2/platform/browser'; import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass, NgIf NgForm, Control, ControlGroup, FormBuilder, Validators} from 'angular2/common'; import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, Router, LocationStrategy, HashLocationStrategy} from 'angular2/router'; import {Http, HTTP_PROVIDERS, RequestOptions, Headers, Request, RequestMethod} from 'angular2/http' 

actualización –

@View ya no está en angular2, por lo que no es necesario importar

 import {view} from 'angular2/core' 

Actualización 2

A partir de angular2 está en RC por lo que hay un cambio de ruptura en todas las importaciones aquí está la lista si todas las importaciones actualizadas –

 angular2/core -> @angular/core angular2/compiler -> @angular/compiler angular2/common -> @angular/common angular2/platform/common -> @angular/common angular2/common_dom -> @angular/common angular2/platform/browser -> @angular/platform-browser-dynamic angular2/platform/server -> @angular/platform-server angular2/testing -> @angular/core/testing angular2/upgrade -> @angular/upgrade angular2/http -> @angular/http angular2/router -> @angular/router angular2/platform/testing/browser -> @angular/platform-browser-dynamic/testing 

Cambió el módulo justo antes de ir a la versión beta

 import {Component, View} from 'angular2/core'; 

FYI: bootstrap también cambió a

 import {bootstrap} from 'angular2/platform/browser'; 

como resultado, muchas de las publicaciones de blog en la red están desactualizadas 🙁

Según la nueva versión de Angular2 rc1, puede actualizar su paquete.json a

 "dependencies": { "@angular/common": "2.0.0-rc.1", "@angular/compiler": "2.0.0-rc.1", "@angular/core": "2.0.0-rc.1", "@angular/http": "2.0.0-rc.1", "@angular/platform-browser": "2.0.0-rc.1", "@angular/platform-browser-dynamic": "2.0.0-rc.1", "@angular/router": "2.0.0-rc.1", "@angular/router-deprecated": "2.0.0-rc.1", "@angular/upgrade": "2.0.0-rc.1", ..... } 

Además de esto, también importe como sigue en su componente o contenedor:

 import { Component } from '@angular/core'; import {ROUTER_DIRECTIVES, Router, RouteParams} from '@angular/router-deprecated'; 

Tenga en cuenta que, como la versión final de Angular2, la respuesta correcta es esta.

 import {Component, View, Directive, Input, Output, Inject, Injectable, provide} from 'angular/core'; import {bootstrap} from 'angular/platform/browser'; import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass, NgIf NgForm, Control, ControlGroup, FormBuilder, Validators} from 'angular/common'; import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, Router, LocationStrategy, HashLocationStrategy} from 'angular/router'; import {Http, HTTP_PROVIDERS, RequestOptions, Headers, Request, RequestMethod} from 'angular/http' 

Esto es cierto como se dice en la actualización 2 de yups desde arriba

 angular2/core -> @angular/core angular2/compiler -> @angular/compiler angular2/common -> @angular/common angular2/platform/common -> @angular/common angular2/common_dom -> @angular/common angular2/platform/browser -> @angular/platform-browser-dynamic angular2/platform/server -> @angular/platform-server angular2/testing -> @angular/core/testing angular2/upgrade -> @angular/upgrade angular2/http -> @angular/http angular2/router -> @angular/router angular2/platform/testing/browser -> @angular/platform-browser-dynamic/testing 

Está intentando acceder a Component desde el directorio incorrecto / antiguo de node_modules. Por favor, acceda a Component desde

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

en lugar de: import { Component, View } from 'angular2/angular2';

Y

Acceda a bootstrap desde la ruta de abajo:

 import { bootstrap } from 'angular2/platform/browser'; 

tienes que actualizar la versión Angular2 en la versión final –

Y luego usa como —-

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

hay una biblioteca actualizada como — '@angular/core'

‘angular2 / angular2’ no es una dependencia válida de angular2

primero debe verificar el archivo package.json “@ angular / core” existe o no

 "dependencies": { "@angular/common": "2.0.0", "@angular/compiler": "2.0.0", "@angular/core": "2.0.0", "@angular/http": "2.0.0", "@angular/platform-browser": "2.0.0", "@angular/platform-browser-dynamic": "2.0.0", "@angular/router": "2.0.0", "@angular/router-deprecated": "2.0.0", "@angular/upgrade": "2.0.0", ..... } 

mira el archivo de componentes como este y también tienes que usar formGroup como belove

  import { Component, OnInit, DoCheck } from '@angular/core' import { Router } from '@angular/router' import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms' @Component({ selector: 'app-user-profile', templateUrl: './user-profile.component.html', styleUrls: ['./user-profile.component.scss'], }) export class UserProfileComponent implements OnInit, DoCheck { profileForm: FormGroup constructor(private fb: FormBuilder) { this.profileForm = this.fb.group({ firstName: ['', Validators.required], lastName: ['', Validators.required], email: ['', Validators.required], mobileNo: ['', Validators.required] }); } 

de lo que tiene que importar ReactiveFormsModule en el archivo app.module.ts
importar {ReactiveFormsModule} de ‘@ angular / forms’;

sin ReactiveFormsModule formGroup no funciona, comete un error

 import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { UserProfileComponent } from './user-profile.component'; import { UserProfileRoutingModule } from './user-profile-routing.module'; import { ReactiveFormsModule } from '@angular/forms'; @NgModule({ imports: [ CommonModule, UserProfileRoutingModule, ReactiveFormsModule ], declarations: [UserProfileComponent] }) 

La mejor forma de patear el proyecto angular2 es utilizando Angular CLI .

Angular CLI hace que sea fácil crear una aplicación que ya funciona, recién salido de la caja. ¡Ya sigue nuestras mejores prácticas!

por favor revisa esto para más detalles.

la importación desde ” angular2 / angular2 ‘estaba en una versión anterior que ya no es compatible. Así que ahora tenemos que importar lo mismo de’ angular2 / core’.Para uso de referencia de detalles ( https://angular.io/guide/quickstart )

 import {Component} from "@angular/core"; @Component({ selector: "userForm", template: '
' }); export class userForm{ public flag = false; //boolean value: true/false }
  • Primero actualice sus liberies angular2 en packege.json.
  • Segundo

      import {Component} from "@angular/core"; import {FormBuilder } from "@angular/forms"; @Component({ selector: "login", providers: [FormBuilder], templateUrl: "/scripts/src/components/login/login.html" }) export class login { }