Angular2/ASP.NET-“未提供ResourceLoader实现.无法读取网址“ [英] Angular2/ASP.NET - "No ResourceLoader implementation has been provided. Can't read the URL"
问题描述
我正在尝试在Visual Studio上构建自己的Angular 2/ASP.NET SPA.您可以在此处找到所有文件.
I'm trying to build my own Angular 2/ASP.NET SPA on Visual Studio. You can find all the files here.
What I tried to do is simple: after I followed the instructions to set up the app here, I began to add in my own files in an attempt to do some basic routing and I deleted some superfluous files. I have ClientApp/app/app.module.ts bootstrapping ClientApp/app/components/app/app.component.ts, and the only route is ClientApp/app/components/app/test.component.ts
不幸的是,我遇到了这个错误:
Unfortunately, I got this error:
An unhandled exception occurred while processing the request.
Exception: Call to Node module failed with error: Error: No ResourceLoader implementation has been provided. Can't read the url "app.component.html"
at Object.get (C:\Users\Student\Source\Workspaces\mvs\Test2\Test2\node_modules\@angular\compiler\bundles\compiler.umd.js:17454:17)
at DirectiveNormalizer._fetch (C:\Users\Student\Source\Workspaces\mvs\Test2\Test2\node_modules\@angular\compiler\bundles\compiler.umd.js:13455:45)
at DirectiveNormalizer.normalizeTemplateAsync (C:\Users\Student\Source\Workspaces\mvs\Test2\Test2\node_modules\@angular\compiler\bundles\compiler.umd.js:13498:23)
at DirectiveNormalizer.normalizeDirective (C:\Users\Student\Source\Workspaces\mvs\Test2\Test2\node_modules\@angular\compiler\bundles\compiler.umd.js:13473:46)
at RuntimeCompiler._createCompiledTemplate (C:\Users\Student\Source\Workspaces\mvs\Test2\Test2\node_modules\@angular\compiler\bundles\compiler.umd.js:16869:210)
at C:\Users\Student\Source\Workspaces\mvs\Test2\Test2\node_modules\@angular\compiler\bundles\compiler.umd.js:16807:43
at Array.forEach (native)
at C:\Users\Student\Source\Workspaces\mvs\Test2\Test2\node_modules\@angular\compiler\bundles\compiler.umd.js:16805:50
at Array.forEach (native)
at RuntimeCompiler._compileComponents (C:\Users\Student\Source\Workspaces\mvs\Test2\Test2\node_modules\@angular\compiler\bundles\compiler.umd.js:16804:45)
一切对我来说都不错,但是我对Angular 2和ASP.NET都是新手,所以我不知道这是编译器问题还是人为错误.这是一些代码,如果您需要更多信息,则指向存储库的链接位于该问题的顶部.
Everything looks right to me, but I'm new to both Angular 2 and ASP.NET, so I don't know if it is a compiler issue or human error. Here is some of the code, if you need more information the link to the repo is at the top of this question.
ClientApp/app/app.module.ts
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { UniversalModule } from 'angular2-universal';
import { AppComponent } from './components/app/app.component';
import { TestComponent } from './components/app/test.component';
@NgModule({
bootstrap: [ AppComponent ],
declarations: [
AppComponent,
TestComponent
],
imports: [
UniversalModule, // Must be first import. This automatically imports BrowserModule, HttpModule, and JsonpModule too.
RouterModule.forRoot([
{ path: 'test', component: TestComponent },
{ path: '', redirectTo: 'test', pathMatch: 'full' },
{ path: '**', redirectTo: 'test' }
])
]
})
export class AppModule {
}
ClientApp/app/components/app/app.component.ts
import { Component, Input } from '@angular/core';
@Component({
selector: 'app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
}
ClientApp/app/components/app/test.component.ts
import {Component, Input, OnInit} from '@angular/core';
@Component({
templateUrl: './test.component.html',
styleUrls: ['./test.component.css']
})
export class TestComponent implements OnInit {
testing: String;
ngOnInit(): void {
this.testing = "This Works";
}
}
推荐答案
UniversalModule当前要求模板和样式的外部资产使用require().
The UniversalModule currently requires that external assets for templates and styles use require().
尝试将templateUrl: './test.component.html'
更改为template: require('./test.component.html')
.
然后styleUrls: ['./test.component.css']
到styles: [require('./test.component.css')]
有关此问题的更多详细信息,可以在这里找到:无法在不使用require()的情况下加载资产
More details on the issue can be found here: Unable to load assets without using require()
作为参考,这是来自Github上Angular的问题线程:跟踪运行时styleUrls .他们建议使用angular2-template-loader.
For reference, here is the issue thread from Angular on Github: track runtime styleUrls. They recommend using the angular2-template-loader.
这篇关于Angular2/ASP.NET-“未提供ResourceLoader实现.无法读取网址“的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!