Question

我正在尝试使用Django后端移植角度2教程

这是我的html文件

<html>
  <head>
    <title>Angular 2 QuickStart</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">    
    <link rel="stylesheet" href="styles.css">

    <!-- 1. Load libraries -->
    <!-- IE required polyfills, in this exact order -->
    <script src="/static/main.js"></script>
    <script src="/static/node_modules/es6-shim/es6-shim.min.js"></script>
     <script src="/static/node_modules/systemjs/dist/system-polyfills.js"></script>
    <script src="/static/node_modules/angular2/es6/dev/src/testing/shims_for_IE.js"></script>   

    <script src="/static/node_modules/angular2/bundles/angular2-polyfills.js"></script>
    <script src="/static/node_modules/systemjs/dist/system.src.js"></script>
    <script src="/static/node_modules/rxjs/bundles/Rx.js"></script>
    <script src="/static/node_modules/angular2/bundles/angular2.dev.js"></script>

    <!-- 2. Configure SystemJS -->
    <script>
      System.config({
        packages: {        
          app: {
           format: 'register',
            defaultExtension: 'js'
           }
        }
      });
      System.import('/static/app/main')
            .then(null, console.error.bind(console));
    </script>
  </head>

 <!-- 3. Display the application -->
  <body>

    <my-app>Loading...</my-app>

  </body>
</html>

我发现System.js无效

System.import('/static/app/main')

我必须使用

System.import('/static/app/main.js')

并手动将.js添加到我的所有非第三个库导入，以使角度应用程序正常工作。

有趣的是，我不必将.js添加到

'angular2/core'
'angular2/platform/browser'

因为System.js会自动解析导入，只要我手动将.js扩展名添加到我写的文件的所有导入中。

但如果我设置

System.defaultJSExtensions = true;

我不会＆＃39;必须再添加.js到我的文件，但System.js失去了导入node_modules中所有库的能力，而是尝试使用默认的django目录

http://localhost:8000/myApp/angular2/platform/browser.js

有人可以给我一些指导吗？

由于

Answer 1

我认为你误解了defaultJSExtensions配置的内容。后者只允许在导入模块时添加js扩展名：

System.defaultJSExtensions = true;

// requests ./some/module.js instead
System.import('./some/module');

如果先前未使用System.register注册模块，则适用。

angular2.dev.js文件包含Angular2核心的模块（使用System.register显式注册）。包含带有script元素的文件只会使它们可用于导入。

如果你想使用来自node_modules/angular2的Angular2的单个JS文件（例如core.js，...），你需要这个SystemJS配置：

System.config({
  defaultJSExtensions: true,
  map: {
    angular2: 'node_modules/angular2/src',
    rxjs: 'node_modules/rxjs'
  },
  packages: {
    app: {
      defaultExtension: 'js',
      format: 'register'
    }
  }
});
System.import('app/boot')
  .then(null, console.error.bind(console));

上面重要的是map块告诉SystemJS在哪里找到名称以angular2/开头的模块。

在这种情况下，无需导入Angular2捆绑的JS文件（angular2.min.js，...）。

系统配置defaultExtension不适用于Django

1 个答案: