admin管理员组

文章数量:1336108

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?

<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=".19.24/system.js"></script>
  <script src="/[email protected]/bundles/Rx.js"></script>
  <script src=".js/2.0.0-beta.9/angular2-polyfills.min.js"></script>
  <script src=".js/2.0.0-beta.9/angular2.min.js"></script>
  <script src=".js/2.0.0-beta.9/http.min.js"></script>
  <script src=".js/2.0.0-beta.9/router.min.js"></script>
  <script src="/[email protected]/es6/dev/src/testing/shims_for_IE.js"></script>
  <script src=".35.0/es6-shim.min.js"></script>
  <script src=".19.20/system-polyfills.js"></script>
  <script src=".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=".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>

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?

<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./ajax/libs/systemjs/0.19.24/system.js"></script>
  <script src="https://npmcdn./[email protected]/bundles/Rx.js"></script>
  <script src="https://cdnjs.cloudflare./ajax/libs/angular.js/2.0.0-beta.9/angular2-polyfills.min.js"></script>
  <script src="https://cdnjs.cloudflare./ajax/libs/angular.js/2.0.0-beta.9/angular2.min.js"></script>
  <script src="https://cdnjs.cloudflare./ajax/libs/angular.js/2.0.0-beta.9/http.min.js"></script>
  <script src="https://cdnjs.cloudflare./ajax/libs/angular.js/2.0.0-beta.9/router.min.js"></script>
  <script src="https://npmcdn./[email protected]/es6/dev/src/testing/shims_for_IE.js"></script>
  <script src="https://cdnjs.cloudflare./ajax/libs/es6-shim/0.35.0/es6-shim.min.js"></script>
  <script src="https://cdnjs.cloudflare./ajax/libs/systemjs/0.19.20/system-polyfills.js"></script>
  <script src="https://code.angularjs/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./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>
  • javascript
  • typescript
  • angular
Share Improve this question edited Feb 3, 2017 at 8:34 zurfyx 32.8k20 gold badges118 silver badges147 bronze badges asked Mar 18, 2016 at 17:56 Petros KyriakouPetros Kyriakou 5,3434 gold badges50 silver badges85 bronze badges 9
  • What exact error do you have? – Thierry Templier Commented Mar 18, 2016 at 18:57
  • actually it required all files i used in my ponents but requires them locally. So its file not found 404 errors, for http.js, mon.js, core etc – Petros Kyriakou Commented Mar 18, 2016 at 19:23
  • Also i noticed something weird. Can you go here and check the network using dev tools, it makes over 500 requests using system.src.js https://angular2arc.herokuapp./ thus taking a lot of time to load. – Petros Kyriakou Commented Mar 18, 2016 at 19:24
  • Could you provide a plunkr? Thanks! – Thierry Templier Commented Mar 18, 2016 at 19:26
  • i have no idea how to upload my directory to plunker is that possible? can i give you a github repo instead? – Petros Kyriakou Commented Mar 18, 2016 at 19:31
 |  Show 4 more ments

1 Answer 1

Reset to default 2

With SystemJS you can provide a mapping to load module from a different location. 

SystemJS.config({
  map: {
       '@angular': 'https://npmcdn./@angular'
   }
});

This will redirect all loading of a module @angular to that cdn location.

For more detailed info check systemjs.config.js in this plunker for more detailed info

本文标签： javascriptHow to load angular2 using CDN and SystemJSStack Overflow

版权声明：本文标题：javascript - How to load angular2 using CDN and SystemJS - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1742364517a2461018.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。