Не удается найти модуль 'angular2/angleular2'
Я разрабатываю приложение node с angular2 и gulp. Я написал файл компонента login.ts следующим образом:
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 {
}
И мой файл bootstrap.ts:
import {bootstrap} from 'angular2/angular2';
import {login} from './components/login/login';
bootstrap(login);
но когда я компилирую эти файлы, он вызывает следующие ошибки:
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'.
Вот мой tsconfig.json:
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"sourceMap": true,
"watch": true,
"removeComments": true,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true
}
}
Я установил ввод для angular2, используя:
tsd install angular2 --save
Помогите исправить ошибку.
Ответы
Ответ 1
yups, как говорит ошибка @simon, в импорте. но для дальнейшего импорта я опубликовал этот ответ, возможно, это тоже полезно для других.
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'
update -
@View
теперь больше не находится в angular2, поэтому нет необходимости импортировать
import {view} from 'angular2/core'
Обновление 2
По состоянию на angular2 находится в RC, так что во всех импортерах есть разрыв во всех имплантах, вот список, если все обновленные импорты -
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
Ответ 2
Он изменил модуль только перед выходом бета-версии на
import {Component, View} from 'angular2/core';
FYI: bootstrap также изменился на
import {bootstrap} from 'angular2/platform/browser';
в результате многие сообщения в блоге в сети устарели: - (
Ответ 3
В соответствии с новой версией Angular2 rc1 вы можете обновить свой пакет package.json до
"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",
.....
}
В дополнение к этому также импортируйте в свой компонент или контейнер следующие значения:
import { Component } from '@angular/core';
import {ROUTER_DIRECTIVES, Router, RouteParams} from '@angular/router-deprecated';
Ответ 4
Обратите внимание, что в качестве окончательной версии формы Angular2 должен быть правильный ответ.
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'
Это верно, как сказано в обновлении yups 2 сверху
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
Ответ 5
вам нужно обновить версию Angular2 в окончательной версии -
И затем используйте как ----
import { Component } from '@angular/core';
есть обновленная библиотека, например --- '@angular/core'
Ответ 6
Вы пытаетесь получить доступ к компоненту из неправильного/старого каталога node_modules.
Войдите в компонент из
import { Component, OnInit } from '@angular/core';
вместо: import { Component, View } from 'angular2/angular2';
И
Доступ к бутстрапу из следующего пути:
import { bootstrap } from 'angular2/platform/browser';
Ответ 7
импорт из '' angular2/angular2 'был в предыдущей версии, которая больше не поддерживается сейчас. Так что теперь нам нужно импортировать то же самое из' angular2/core '. Для подробной справки
(https://angular.io/guide/quickstart)
Ответ 8
'angular2/angular2' не является допустимыми зависимостями angular2
вам нужно сначала проверить файл package.json "@ angular/core" или нет
"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",
.....
}
см. файл компонента, подобный этому, а также вы также используете formGroup как 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]
});
}
, чем вам нужно импортировать ReactiveFormsModule в файл app.module.ts
import {ReactiveFormsModule} из '@angular/forms';
без ReactiveFormsModule formGroup не работает, он делает ошибку
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]
})
Ответ 9
Лучший способ запустить проект angular2 - это Angular CLI.
CLI Angular упрощает создание приложения, которое уже работает, прямо из коробки. Это уже соответствует нашим лучшим практикам!
пожалуйста проверьте это для получения более подробной информации.
Ответ 10
- Сначала обновите свои angular2 в пакете packege.json.
-
Во-вторых
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 {
}