Question

在使用Django服务的Angular 2应用程序中导入模块时遇到一些问题。我一直在努力将Angular 2和Django结合起来，松散地关注这个页面：https://4sw.in/blog/2016/django-angular2-tutorial/。在Django的 settings.py 中我添加了

ANGULAR_URL = '/ng/'
ANGULAR_ROOT = os.path.join(BASE_DIR, 'ngApp/src')

我添加了一行

baseURL: '/ng/',

到 systemjs.config.js 。将index.html更改为：

{% load static %}

<html>
  <head>
    <title>Angular 2 QuickStart</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="{% static 'css/styles.css' %}">
    <base href="/">
    <!-- Polyfill(s) for older browsers -->
    <script src="{{ ANGULAR_URL }}node_modules/core-js/client/shim.min.js"></script>

    <script src="{{ ANGULAR_URL }}node_modules/zone.js/dist/zone.js"></script>
    <script src="{{ ANGULAR_URL }}node_modules/systemjs/dist/system.src.js"></script>

    <script src="{{ ANGULAR_URL }}systemjs.config.js"></script>
    {# Write your django logics here #}
    <script>
      window.ANGULAR_URL = "{{ ANGULAR_URL }}";
      System.import('/ng/main.js').catch(function(err){
          console.error(err);
      });
    </script>
  </head>

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

当我去 localhost：8000 时，我的应用加载得很好。但是，当我通过添加：

加载额外的模块（Google Maps for Angular 2）时

'angular2-google-maps': 'npm:angular2-google-maps/core/',

在 systemjs.config.js 和

中映射{}

import { AgmCoreModule } from 'angular2-google-maps';

在 app.module.ts 中， npm start 会产生错误

src/app/app.module.ts(7,31): error TS2307: Cannot find module 'angular2-google-maps'.

即使已经安装并且在文件夹node_modules中。我的文件夹如下所示：

/DjangoProject
 - settings.py
 - /ngApp
    -- /src
        --- systemjs.config.js
        --- /node_modules
            ---- /angular2-google-maps
        --- main.ts
        --- /app
            ---- app.module.ts
            ---- app.component.ts
 - /core
    -- /templates
        --- index.html

可能有一个我忽略的地方，但这已经困扰了我一段时间，我无法弄清楚。有什么想法吗？

使用Django在Angular 2中导入模块

0 个答案: