Angular2无法加载资源:服务器响应状态为404 (未找到)
Angular2无法加载资源:服务器响应状态为404 (未找到)
提问于 2017-03-01 11:22:13
我在Visual Studio2015中使用Angualr2。
我遵循这里的Hello World! in Angular 2 using Visual Studio 2015 and ASP.NET 4，但似乎是错误的。
错误消息
Error: (SystemJS) XHR error (404 Not Found) loading
`http://localhost:2088/src/app/app.module` Error: XHR error (404 Not Found)
loading `http://localhost:2088/src/app/app.module` at XMLHttpRequest.wrapFn [as _onreadystatechange]
(`http://localhost:2088/node_modules/zone.js/dist/zone.js:1190:29`) [<root>] at Zone.runTask
(`http://localhost:2088/node_modules/zone.js/dist/zone.js:166:47`) [<root> => <root>] at XMLHttpRequest.ZoneTask.invoke
(`http://localhost:2088/node_modules/zone.js/dist/zone.js:416:38`) [<root>]
Error loading `http://localhost:2088/src/app/app.module` as
"./app/app.module" from `http://localhost:2088/src/main.js` at XMLHttpRequest.wrapFn [as _onreadystatechange]
(`http://localhost:2088/node_modules/zone.js/dist/zone.js:1190:29`) [<root>] at Zone.runTask
(`http://localhost:2088/node_modules/zone.js/dist/zone.js:166:47`) [<root> => <root>] at XMLHttpRequest.ZoneTask.invoke
(`http://localhost:2088/node_modules/zone.js/dist/zone.js:416:38`) [<root>]
Error loading `http://localhost:2088/src/app/app.module` as "./app/app.module" from `http://localhost:2088/src/main.js` at addToError
(`http://localhost:2088/node_modules/systemjs/dist/system.src.js:122:78`) [<root>] at linkSetFailed
(`http://localhost:2088/node_modules/systemjs/dist/system.src.js:695:21`) [<root>] at
`http://localhost:2088/node_modules/systemjs/dist/system.src.js:495:9` [<root>] at Zone.run
(`http://localhost:2088/node_modules/zone.js/dist/zone.js:126:43`) [<root> => <root>] at `http://localhost:2088/node_modules/zone.js/dist/zone.js:679:57` [<root>] at Zone.runTask
(`http://localhost:2088/node_modules/zone.js/dist/zone.js:166:47`) [<root> => <root>] at drainMicroTaskQueue
(`http://localhost:2088/node_modules/zone.js/dist/zone.js:529:35`) [<root>] at XMLHttpRequest.ZoneTask.invoke
(`http://localhost:2088/node_modules/zone.js/dist/zone.js:420:25`) [<root>]systemjs.config.js
(function (global) {
System.config({
paths: {
// paths serve as alias
'npm:': 'node_modules/'
},
// map tells the System loader where to look for things
map: {
// our app is within the app folder
app: 'app',
// angular bundles
'@angular/core': 'npm:@angular/core/bundles/core.umd.js',
'@angular/common': 'npm:@angular/common/bundles/common.umd.js',
'@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
'@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
'@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
'@angular/http': 'npm:@angular/http/bundles/http.umd.js',
'@angular/router': 'npm:@angular/router/bundles/router.umd.js',
'@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
// other libraries
'rxjs': 'npm:rxjs',
'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js'
},
// packages tells the System loader how to load when no filename and/or no extension
packages: {
app: {
defaultExtension: 'js'
},
rxjs: {
defaultExtension: 'js'
}
}
});
})(this);_Layout.cshtml
<!-- Angular2 Code -->
<base href="/">
<link rel="stylesheet" href="~/src/styles.css">
<!-- Polyfill(s) for older browsers -->
<script src="~/node_modules/core-js/client/shim.min.js"></script>
<script src="~/node_modules/zone.js/dist/zone.js"></script>
<script src="~/node_modules/systemjs/dist/system.src.js"></script>
<script src="~/src/systemjs.config.js"></script>
<script>
System.import('src/main.js').catch(function(err){ console.error(err); });
</script>
<!-- Angular2 Code -->main.ts
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
platformBrowserDynamic().bootstrapModule(AppModule);请帮帮我。
回答 2
Stack Overflow用户
回答已采纳
发布于 2017-03-01 11:26:40
您应该根据您的systemjs.config.js文件指定app/main.js而不是src/main.js (假设您的.ts文件位于\app文件夹中)：
<script>
System.import('app/main.js').catch(function(err){ console.error(err); });
</script>Stack Overflow用户
发布于 2018-09-05 02:11:09
非常感谢你这么做。我费了好大劲才把它弄清楚。我有两个dist文件，一个在.net核心中的wwwroot下，另一个在app下。这就是造成混乱的原因。
将webpack.config.js文件更新到下面，我的页面再次加载。
output: {
filename: '[name].js',
publicPath: 'app/dist/'
},页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/42522575
复制相关文章
相似问题