我遇到SystemJS配置问题
我在VS2015中有一个有效的angular2应用程序(asp.net core 1.0)。我可以编译.ts文件并进行更改,不会发生错误。
我现在想将应用程序移动到glassfish 4.1 Web项目(充当生产服务器)但是当我移动整个wwwroot内容时 (所有.js)从VS2015到glassfish网络文件夹我都会看到404个。
这是我在VS2015中使用的Index.html文件:
<!DOCTYPE html>
<html>
<head>
<base href="/">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<link rel="icon" href="data:;base64,iVBORwOKGO=" />
<title>Procurement v1.0</title>
<link src="libs/css/bootstrap.min.css" rel="stylesheet" />
<link href="libs/css/case1.css" rel="stylesheet" />
<!-- 1. Load libraries -->
<script src="libs/es6-shim.min.js"></script>
<script src="libs/system-polyfills.js"></script>
<script src="libs/angular2-polyfills.js"></script>
<script src="libs/system.js"></script>
<script src="libs/Rx.js"></script>
<script src="libs/angular2.dev.js"></script>
<script src="libs/router.dev.js"></script>
<script src="libs/http.dev.js"></script>
<script src="libs/jquery.js"></script>
<script src="libs/bootstrap.js"></script>
<!-- 2. Configure SystemJS -->
<script>
System.config({
packages: {
appScripts: {
defaultExtension: 'js'
},
'@ngrx/store': {
main: 'index.js',
format: 'cjs'
}
},
map: {
'@ngrx/store': 'libs/storedist'
}
});
</script>
<script>
System.import('appScripts/app')
.then(null, console.error.bind(console));
</script>
</head>
<body>
<router-app>Loading...</router-app>
</body>
</html>
当我将wwwroot内容复制到Glassfish时,我需要在所有脚本前面加上Web存档的名称(APPOCase1a),以便识别脚本。我还必须使用CDN for system.js,因为它根本没被识别。我还必须将System.import更改为指向实际的应用程序.js文件以便识别它,从而在Glassfish上生成以下index.html:
<!DOCTYPE html>
<html>
<head>
<base href="/">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<link rel="icon" href="data:;base64,iVBORwOKGO=" />
<title>Procurement v1.0</title>
<link href="/APPOCase1a/libs/css/bootstrap.css" rel="stylesheet" />
<link href="/APPOCase1a/libs/css/case1.css" rel="stylesheet" />
<!-- 1. Load libraries -->
<script src="/APPOCase1a/libs/es6-shim.min.js"></script>
<script src="/APPOCase1a/libs/system-polyfills.js"></script>
<script src="/APPOCase1a/libs/angular2-polyfills.js"></script>
<script src="https://code.angularjs.org/tools/system.js"></script>
<script src="/APPOCase1a/libs/Rx.js"></script>
<script src="/APPOCase1a/libs/angular2.dev.js"></script>
<script src="/APPOCase1a/libs/router.dev.js"></script>
<script src="/APPOCase1a/libs/http.dev.js"></script>
<script src="/APPOCase1a/libs/jquery.js"></script>
<script src="/APPOCase1a/libs/bootstrap.js"></script>
<!-- 2. Configure SystemJS -->
<script>
System.config({
packages: {
'@ngrx/store': {
main: 'index.js',
format: 'cjs'
}
},
map: {
'@ngrx/store': 'libs/storedist'
}
});
</script>
<script>
System.import('/APPOCase1a/appScripts/app.js')
.then(null, console.error.bind(console));
</script>
</head>
<body>
<router-app>Loading...</router-app>
</body>
</html>
以下是我在浏览器控制台中看到的内容:
Navigated to http://localhost:8080/APPOCase1a/
system.src.js:4597 GET http://localhost:8080/APPOCase1a/appScripts/product/product-home.component 404 (Not Found)I @ system.src.js:4597(anonymous function) @ system.src.js:4597ZoneAwarePromise @ angular2-polyfills.js:589(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597ZoneDelegate.invoke @ angular2-polyfills.js:332Zone.run @ angular2-polyfills.js:227(anonymous function) @ angular2-polyfills.js:576ZoneDelegate.invokeTask @ angular2-polyfills.js:365Zone.runTask @ angular2-polyfills.js:263drainMicroTaskQueue @ angular2-polyfills.js:482ZoneTask.invoke @ angular2-polyfills.js:434
system.src.js:4597 GET http://localhost:8080/APPOCase1a/appScripts/home/home.component 404 (Not Found)I @ system.src.js:4597(anonymous function) @ system.src.js:4597ZoneAwarePromise @ angular2-polyfills.js:589(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597ZoneDelegate.invoke @ angular2-polyfills.js:332Zone.run @ angular2-polyfills.js:227(anonymous function) @ angular2-polyfills.js:576ZoneDelegate.invokeTask @ angular2-polyfills.js:365Zone.runTask @ angular2-polyfills.js:263drainMicroTaskQueue @ angular2-polyfills.js:482ZoneTask.invoke @ angular2-polyfills.js:434
system.src.js:4597 GET http://localhost:8080/APPOCase1a/appScripts/po/po-generator-home.component 404 (Not Found)I @ system.src.js:4597(anonymous function) @ system.src.js:4597ZoneAwarePromise @ angular2-polyfills.js:589(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597ZoneDelegate.invoke @ angular2-polyfills.js:332Zone.run @ angular2-polyfills.js:227(anonymous function) @ angular2-polyfills.js:576ZoneDelegate.invokeTask @ angular2-polyfills.js:365Zone.runTask @ angular2-polyfills.js:263drainMicroTaskQueue @ angular2-polyfills.js:482ZoneTask.invoke @ angular2-polyfills.js:434
system.src.js:4597 GET http://localhost:8080/APPOCase1a/appScripts/vendor/vendor-home.component 404 (Not Found)I @ system.src.js:4597(anonymous function) @ system.src.js:4597ZoneAwarePromise @ angular2-polyfills.js:589(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597ZoneDelegate.invoke @ angular2-polyfills.js:332Zone.run @ angular2-polyfills.js:227(anonymous function) @ angular2-polyfills.js:576ZoneDelegate.invokeTask @ angular2-polyfills.js:365Zone.runTask @ angular2-polyfills.js:263drainMicroTaskQueue @ angular2-polyfills.js:482ZoneTask.invoke @ angular2-polyfills.js:434
system.src.js:4597 GET http://localhost:8080/APPOCase1a/appScripts/store/reducers 404 (Not Found)I @ system.src.js:4597(anonymous function) @ system.src.js:4597ZoneAwarePromise @ angular2-polyfills.js:589(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597ZoneDelegate.invoke @ angular2-polyfills.js:332Zone.run @ angular2-polyfills.js:227(anonymous function) @ angular2-polyfills.js:576ZoneDelegate.invokeTask @ angular2-polyfills.js:365Zone.runTask @ angular2-polyfills.js:263drainMicroTaskQueue @ angular2-polyfills.js:482ZoneTask.invoke @ angular2-polyfills.js:434
angular2-polyfills.js:332 Error: XHR error (404 Not Found) loading http://localhost:8080/APPOCase1a/appScripts/product/product-home.component(…)ZoneDelegate.invoke @ angular2-polyfills.js:332Zone.run @ angular2-polyfills.js:227(anonymous function) @ angular2-polyfills.js:576ZoneDelegate.invokeTask @ angular2-polyfills.js:365Zone.runTask @ angular2-polyfills.js:263drainMicroTaskQueue @ angular2-polyfills.js:482ZoneTask.invoke @ angular2-polyfills.js:434
system.src.js:4597 GET http://localhost:8080/libs/storedist/index.js 404 (Not Found)I @ system.src.js:4597(anonymous function) @ system.src.js:4597ZoneAwarePromise @ angular2-polyfills.js:589(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ system.src.js:4597ZoneDelegate.invoke @ angular2-polyfills.js:332Zone.run @ angular2-polyfills.js:227(anonymous function) @ angular2-polyfills.js:576ZoneDelegate.invokeTask @ angular2-polyfills.js:365Zone.runTask @ angular2-polyfills.js:263drainMicroTaskQueue @ angular2-polyfills.js:482ZoneTask.invoke @ angular2-polyfills.js:434
由于我是这个东西的菜鸟,我想知道是否有更简单的方法来移植这个应用程序,或修复配置。任何见解都将不胜感激。
答案 0 :(得分:0)
经过几个小时的修补,我发现它是
<base href="/">
标签让我搞砸了。删除后,应用程序现在部分工作,但我现在仍然在html模板和img文件上获得404。我会进一步调查。