2015-11-26 8 views
3

Я играю с Angular 2.0/TypeScript (Visual Studio 2015, TS 1.6), и я пытаюсь понять, как должен работать «импорт из» , Я определил свой модуль в app.ts с выходным путем, установленным в ./build.TypeScript, что является правильным способом использования 'import'

В bootstrap.ts импортировать модуль с

import {bootstrap} from "angular2/angular2"; 
import {App} from "./app"; 
bootstrap(App); 

Поскольку у меня есть предназначение сборки, отличное от назначения источника, единственный способ, которым я могу получить эту работу, чтобы добавить каждый файл System.Config ()

<script> 
    System.config({ 
     packages: { 
      './build/bootstrap': { defaultExtension: 'js' }, 
      './build/app': { defaultExtension: 'js' }, 
      './build/Components/Comp01/component': { defaultExtension: 'js' }, 
      './build/Components/Comp02/component': { defaultExtension: 'js' }, 
     }, 
    }); 
    System.import('./build/bootstrap'); 
</script> 

Если изменить оператор импорта для использования с»./build/app.js', то я получаю ошибку TS2307,„не может найти модуль ./build.app.js“ Если я изменю import в './app.ts', тогда компилятор будет счастлив, но, очевидно, браузер затем attem pts для загрузки app.ts, а не app.js

Каков правильный способ использования 'import' в TypeScript, когда вывод находится в другом месте?

+0

То, как вы это делаете, выглядит правильно, хотя я использовал «карту» в моей системной конфигурации. В чем проблема? Жалобуется ли компилятор TypeScript? – ColinE

+0

Как я уже говорил, когда я добавляю отдельные файлы в system.config и устанавливаю defaultExtension, то он работает. Но я не вижу преимущества использования System.import, если мне еще нужно добавить каждый файл в раздел конфигурации, и мне нужно добавить расширение по умолчанию = js. Я ожидал, что system.import будет достаточно умным, чтобы автоматически загружать зависимости, ведь они уже определены в выражении .import в зависимом файле. Именно по этой причине я думал, что не настраиваю system.config correct –

ответ

0

Существует один способ для этого, как я знаю ::

Вы должны сделать трюк, как это.

Предположим, у вас есть приложение папки и два файла в этой папке app.ts и bootstrap.ts

так что вы должны сделать вашу структуру папок JS же, как и в структуре папок TS Например, папка сборки будет иметь два файлы app.js bootstrap.js

затем с помощью следующего кода

import {App} from "./app"; 

не будет никакой ошибки, потому что загрузчик будет найти app.js с выше указанным путем и импортом будет найти app.ts с T он же указал путь.

И предположим, что вы имеете другую папку в приложении папку с именем COMPONENT1 и есть component1.ts файл

Затем Вы должны сделать вашу структуру папок JS же, как папки TS так строить будет иметь COMPONENT1 папку и COMPONENT1 папку будет иметь component1.js

так supoose вы должны импортировать app.ts в component1.ts затем

import {App} from "../app"; 

он найдет JS и ц и с тем же путем

+0

То, что у меня есть, и без секции import.config. Я получаю 404 в файле начальной загрузки, когда он пытается загрузить «bootstrap», а не «bootstrap.js» ». Я попытался удалить папку сборки и установить файлы js в той же папке, что и файл ts, и все же браузер пытается загрузить только «имя файла», а не «filename.js», –

Смежные вопросы