typescript 如何使用 CDN 和 SystemJS 加载 angular2
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/36091219/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to load angular2 using CDN and SystemJS
提问by Petros Kyriakou
In my index.html file i load angular 2 through cdn but it seems because i import the modules of angular 2 systemjs thinks that i must have them locally, how can i fix that?
在我的 index.html 文件中，我通过 cdn 加载了 angular 2，但似乎是因为我导入了 angular 2 systemjs 的模块，认为我必须在本地拥有它们，我该如何解决？
<html>
<head>
<base href="/">
<title>Angular 2 Arc</title>
<link rel="icon" type="image/x-icon" href="favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<ng2-app>Loading...</ng2-app>
<!-- Load Angular 2 Core libraries -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.24/system.js"></script>
<script src="https://npmcdn.com/[email protected]/bundles/Rx.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.9/angular2-polyfills.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.9/angular2.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.9/http.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.9/router.min.js"></script>
<script src="https://npmcdn.com/[email protected]/es6/dev/src/testing/shims_for_IE.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.0/es6-shim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.20/system-polyfills.js"></script>
<script src="https://code.angularjs.org/tools/system.js.map"></script>
<!-- Load Bootstrap and Jquery -->
<script src="lib/jquery/jquery.min.js" charset="utf-8"></script>
<script src="lib/bootstrap/js/bootstrap.min.js" charset="utf-8"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-fork-ribbon-css/0.2.0/gh-fork-ribbon.min.css" />
<link rel="stylesheet" href="/lib/bootstrap/css/bootstrap.min.css" media="screen" title="no title" charset="utf-8">
<link rel="stylesheet" href="assets/css/app.css">
<!-- Configure SystemJS -->
<script>
System.config({
defaultJSExtensions: true,
packages: {
boot: {
format: 'register',
defaultExtension: 'js'
}
}
});
System.import('js/boot')
.then(null, console.error.bind(console));
</script>
</body>
</html>
回答by Maarten Mensink
With SystemJS you can provide a mapping to load module from a different location.
使用 SystemJS，您可以提供从不同位置加载模块的映射。
SystemJS.config({
map: {
'@angular': 'https://npmcdn.com/@angular'
}
});
This will redirect all loading of a module @angular to that cdn location.
这会将模块@angular 的所有加载重定向到该 CDN 位置。
For more detailed info check systemjs.config.jsin this plunkerfor more detailed info
有关更多详细信息，请查看systemjs.config.js此plunker以获取更多详细信息
