[英]Error: Can't resolve '@angular/compiler/src/core'
I am trying to learn Angular 5 and after completing several tutorial I have purchased a template to help me learn how to structure my application. 我正在尝试学习Angular 5,在完成几个教程后,我购买了一个模板来帮助我学习如何构建我的应用程序。
I am trying to add my own module while following the structure of this template I purchased but I get the below message. 我正在尝试添加我自己的模块,同时遵循我购买的这个模板的结构,但我收到以下消息。
ERROR in ./src/app/pages/property/property.component.ts Module not found: Error: Can't resolve '@angular/compiler/src/core' in '....\\myProject\\src\\app\\pages\\property'
./src/app/pages/property/property.component.ts中的错误找不到模块:错误:无法解析'.... \\ myProject \\ src \\ app \\中的'@ angular / compiler / src / core'网页\\财产”
My module definatly exists in that location so I feel I have have misunderstood how modules and components are referenced and how the routing is used. 我的模块肯定存在于该位置,所以我觉得我误解了如何引用模块和组件以及如何使用路由。
I think the best way to try and get help here is by walking you through what I think is/should be happening. 我认为在这里尝试和获得帮助的最佳方式是引导您完成我认为/应该发生的事情。
index.html 的index.html
index.html calls the component with the selector az-root, in this case app.component
index.html使用选择器az-root调用组件,在本例中为
app.component
...other stuff...
<az-root></az-root>
...other stuff...
app.component.ts app.component.ts
displays the default page defined in the routes
property of app.routing.ts
显示
app.routing.ts
的routes
属性中定义的默认页面
...some imports...
@Component({
selector: 'az-root',
encapsulation: ViewEncapsulation.None,
template:`<router-outlet></router-outlet>`,
styleUrls: ['./app.component.scss']
})
export class AppComponent { }
app.routing.ts app.routing.ts
loads the pages module located at app/pages/pages.module.ts
加载位于
app/pages/pages.module.ts
的页面模块
...some imports...
export const routes: Routes = [
{ path: '', redirectTo: 'pages', pathMatch: 'full' },
{ path: 'pages', loadChildren: 'app/pages/pages.module#PagesModule' },
{ path: '**', component: ErrorComponent }
];
...other stuff...
PagesModule PagesModule
i'm not sure how the PagesModule
defines the PagesComponent
because the PagesComponent
selector is never called. 我不确定
PagesModule
如何定义PagesComponent
因为从不调用PagesComponent
选择器。 But I have guessed that pages.routing.ts
defines it 但我猜到
pages.routing.ts
定义了它
...some imports...
@NgModule({
imports: [
CommonModule,
routing
],
declarations: [
SidebarComponent,
NavbarComponent,
PagesComponent
],
providers:[
]
})
export class PagesModule { }
pages.routing.ts pages.routing.ts
displays the pagesComponenet
which calls a <router-outlet></router-outlet>
in its template. 显示在其模板中调用
<router-outlet></router-outlet>
的pagesComponenet
。 Under the <router-outlet></router-outlet>
of the pagesComponenet
I would expect the propertyComponent to display but adding a reference to my propertyModule in the children
array I get the afore mentioned error, what have I done wrong? 在
pagesComponenet
的<router-outlet></router-outlet>
下,我希望propertyComponent显示但是在children
数组中添加了对propertyModule的引用我得到了上面提到的错误,我做错了什么?
...some imports
export const routes: Routes = [
{
path: '',
component: PagesComponent,
children:[
{ path:'', redirectTo:'property', pathMatch:'full' },
{ path: 'property', loadChildren: 'app/pages/property/property.module#PropertyModule' }
]
}
];
export const routing: ModuleWithProviders = RouterModule.forChild(routes);
pages.component.ts pages.component.ts
...some imports...
@Component({
selector: 'az-pages',
encapsulation: ViewEncapsulation.None,
templateUrl: './pages.component.html',
styleUrls: ['./pages.component.scss'],
providers: [ AppState ]
})
export class PagesComponent implements OnInit {
...other stuff...
pages.component.html pages.component.html
<div class="container-fluid">
<div class="row">
<div class="main">
<router-outlet></router-outlet>
</div>
</div>
</div>
Be careful with the auto import in vs code for angular, make sure that you are importing 小心角色的vs代码中的自动导入,请确保您正在导入
Component, NgModule
from @angular/core
, not @angular/compiler/src/core
Component, NgModule
来自@angular/core
Component, NgModule
, 而不是 @angular/compiler/src/core
@angular/compiler/src/core
is sometimes what gets inserted when you hit tab to auto-import 当您点击Tab键进行自动导入时,有时会插入
@angular/compiler/src/core
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.