Я хотел переименовать модуль @angular в angular2, так как считаю его более читаемым и хотел понять, как работает импорт.

Итак, до того, как я попытался это изменить, systemjs.config.js выглядел так:

(function(global)
{
    var map =
    {
        'app': 'app', // 'dist',
        '@angular': 'node_modules/@angular',
        /*...*/
    };

    var packages =
    {
        'app': { main: 'main.js', defaultExtension: 'js' },
        '@angular/common': { main: 'index.js', defaultExtension: 'js' };
        /*...*/
    };

    var config =
    {
        map: map,
        packages: packages
    };

    if (global.filterSystemConfig)
    {
        global.filterSystemConfig(config);
    }

    System.config(config);
})(this);

А импорт в файлах app-Typescript выглядел так:

import { Component } from '@angular/core';

Это работает, как ожидалось. Теперь я изменил systemjs.config.js на это:

(function(global)
{
    var map =
    {
        'app': 'app', // 'dist',
        'angular2': 'node_modules/@angular',
        /*...*/
    };

    var packages =
    {
        'app': { main: 'main.js', defaultExtension: 'js' },
        'angular2/common', { main: 'index.js', defaultExtension: 'js' };
        /*...*/
    };

    var config =
    {
        map: map,
        packages: packages
    };

    if (global.filterSystemConfig)
    {
        global.filterSystemConfig(config);
    }

    System.config(config);
})(this);

Чтобы я мог импортировать модули Angular2 следующим образом:

import { Component } from 'angular2/core';

Когда я пытаюсь запустить npm start, я получаю следующую ошибку:

file-where-i-import.component.ts (1,32): ошибка TS2307: не удается найти модуль angular2 / core.

Почему так не работает? Что мне не хватает?

0
CharlyDelta 13 Май 2016 в 20:40

3 ответа

Лучший ответ

Проблема в том, что конфигурация SystemJS предназначена только для времени выполнения.

Компиляция TypeScript полагается на файлы d.ts для модулей, типов, ... и на эту конфигурацию. Компилятор заглянет в папку @angular в node_modules, чтобы разрешить модули, поэтому имена модулей для Angular2 должны начинаться с префикса @angular/.

2
Thierry Templier 13 Май 2016 в 18:20

Для этого можно указать сопоставление путей в tsconfig.json :

"compilerOptions": {
    // ...omitted other options...
    "baseUrl": "",
    "paths": {
        "angular2/*": [
            "node_modules/@angular/*"
        ]
    }
}

Эта функция появится в TypeScript 2.0, но вы можете использовать ее сегодня: npm install typescript@next

1
David Sherret 13 Май 2016 в 19:05

Если у вас так много проблем с @angular, не используйте его ... Шучу ... вы можете попробовать ниже,

Создайте новый файл с именем angular2 с помощью ниже,

export * from "@angular/core";

И когда вы обратитесь, вы можете использовать

import { Component } from 'path to angular2 module';

Теперь это не совсем то, что вам может понадобиться, потому что вам нужно использовать путь ссылки, а не имя модуля. Также вы должны включить все модули из angular, которые вы, возможно, захотите использовать. Вы также можете фильтровать и отображать только то, что вам нужно, используя имена экспорта, такие как Component и т. Д., Также у вас есть возможность добавлять свои модули вместе с angular.

Если вы хотите узнать больше о том, как разрешение модулей работает в Typescript, вы можете посмотреть Typescript Разрешение модуля

Обновление: у вас может быть структура папок, как показано ниже (выдержки из Разрешение модуля машинописного текста ),

   /root/src/angular2/package.json (if it specifies a "typings" property)
   /root/src/angular2/index.ts
   /root/src/angular2/index.d.ts

Тогда вы можете использовать

   import { Component } from 'angular2';
1
Madhu Ranjan 31 Авг 2020 в 18:13