1

我在使用 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时，我的应用程序加载良好。但是，当我通过添加加载一个额外的模块（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

我可能忽略了某个设置，但这一直困扰着我一段时间，我无法弄清楚。有任何想法吗？

4

0 回答 0