在plnkr中加載angularjs文件

此示例代碼創建一個角度分量。我很困惑它是如何將main.js和story.component.js文件加載到index.html中的？在plnkr中加載angularjs文件

http://plnkr.co/edit/?p=preview

有index.html中

下面沒有直接包含這些文件是整個代碼：

<!DOCTYPE html> 
<html> 

<head> 
    <script>document.write('<base href="' + document.location + '" />');</script> 

    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 

    <!-- IE required polyfills, in this exact order --> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.34.1/es6-shim.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.20/system-polyfills.js"></script> 
    <script src="https://npmcdn.com/angular2/es6/dev/src/testing/shims_for_IE.js"></script> 

    <!-- Angular polyfill required everywhere --> 
    <script src="https://code.angularjs.org/2.0.0-beta.8/angular2-polyfills.js"></script> 

    <script src="https://code.angularjs.org/tools/system.js"></script> 
    <script src="https://code.angularjs.org/tools/typescript.js"></script> 
    <script src="https://code.angularjs.org/2.0.0-beta.8/Rx.js"></script> 
    <script src="https://code.angularjs.org/2.0.0-beta.8/angular2.dev.js"></script> 
    <script src="https://code.angularjs.org/2.0.0-beta.8/router.dev.js"></script> 
    <script src="https://code.angularjs.org/2.0.0-beta.8/http.dev.js"></script> 

    <script> 
     System.config({ 
     transpiler: 'typescript', 
     typescriptOptions: { emitDecoratorMetadata: true }, 
     packages: { 
      'api': {defaultExtension: 'ts'}, 
      'app': {defaultExtension: 'ts'} 
     } 
     }); 
    System.import('app/main') 
      .then(null, console.error.bind(console)); 
    </script> 

</head> 

<body> 
    <my-story>Loading Demo ...</my-story> 
</body> 

</html>

來源

2016-03-09 runtimeZero

加載由SystemJS處理：

System.import('app/main')

進口如config.js中所述的main.js：

System.config.packages.app.main = './main.ts'

其基本上告訴加載器模塊main是app包的一部分，並且可以在文件main.ts在相同的目錄中找到。

其餘文件加載導入語句。

來源

2016-03-09 01:11:54 Sasxa

在plnkr中加載angularjs文件

回答

相關問題