Использование jspm с TypeScript

Question

Возможно ли комбинировать jspm с системой TypeScript и модулем TypeScript?

Я не мог найти документацию или образцы этого.

Answer 1

Update - v1.5

SystemJS был добавлен в качестве модуля типа для машинопись, так что вы должны быть в состоянии использовать SystemJS из коробки и компилировать с флагом модуля:

tsc --module system app.ts 

Это было добавлено вместе с синтаксисом импорта модуля ES6, поэтому вы должны иметь возможность использовать этот стиль и скомпилировать его с тем, что вам нужно.

import * as $ from "jquery"; 

Оригинал ответа

Если вы используете синтаксис SystemJS, вы можете объявить детали, необходимые вам, как это:

systemjs.d.ts

interface System { 
    then: (cb: Function) => void; 
} 

interface SystemStatic { 
    import: (name: string) => System; 
} 

declare var System: SystemStatic; 

export = System; 

Вы должны затем уметь использовать его следующим образом:

/// <reference path="jquery.d.ts" /> 

import System = require('systemjs'); 

System.import('jquery').then(($: JQueryStatic) => { 
    $('#id').html('Hello world'); 
}); 

Answer 2

Обновление февраль 2016 года: по просьбе Абхишека Пракаша, я установил an example repository on GitHub. Не стесняйтесь играть с источниками и смотрите, как работает рабочий процесс машинописного и jspm.

---

Как я хотел попробовать машинопись (ссылки на версии 1.5 здесь), чтобы работать вместе с AngularJS и JSPM, я не мог найти решение, но споткнулся этот вопрос и ответ Стива, но я до сих пор не мог» t заставить его работать с этой информацией. Поэтому я пробовал много вещей сам и, наконец, сделал его работу. Так вот несколько примеров о том, как использовать машинопись с JSPM в AngularJS среды:

Сначала установите AngularJS с JSPM с

jspm install angular 

Затем установите файлы определения DefinitelyTyped с tsd или вручную. Теперь вы можете импортировать AngularJS с синтаксисом ES6:

/// <reference path="typings/angularjs/angular.d.ts" /> 

import * as angular from 'angular'; 

быстрое примечание, как это у меня с ума на первых попыток: Вам нужно будет как, правильный путь к угловому и определения типов! Если один из них отсутствует (для меня я не включил опорную линию), tsc будет кидать

Ошибка TS2307: Не удается найти модуль «угловой».

Это трудно отлаживать, как я всегда думал, он не смог найти модуль, но я просто пропустил ссылку на определение. Поэтому просто убедитесь, что у вас всегда есть правильные определения для всего, что вы пытаетесь импортировать!

Затем скомпилируйте свой TypeScript с помощью tsc --module system app.ts, тогда как значение для модуля может быть commonjs, amd, system или umd.Выберите систему модулей, которую вы хотите использовать в своей среде! Нет необходимости использовать систему для SystemJS. Компилятор TypeScript будет только обертывать определенный выбранный модуль «шаблон» вокруг вашего кода (или, лучше сказать, создать модуль указанного типа модуля), поэтому его можно будет загрузить SystemJS позже (при использовании --module system).

В моем случае, для браузера Окружающая среда AngularJS Я выбрал amd (с использованием system не работал, поскольку ES6-модуль-загрузчик из SystemJS не мог загрузить файлы таким образом ... Я не знаю, почему еще !).

С помощью переключателя --module amd, я мог бы легко импортировать скомпилированный файл с SystemJS внутри моей странице HTML кода с помощью:

<script src="jspm_packages/system.js"></script> 
<script src="config.js"></script> 
<script> 
    System.import('src/app'); 
</script> 

Надеется, что это поможет кому-то, что осталось один в документации, как и я.

Answer 3

Я пробовал текущие решения, размещенные на официальном сайте JSPM, и некоторые git repos, намеченные в этом сообщении, бесполезны. Причина в том, что обработка файлов с машинописными текстами с текущей реализацией TS. Я предлагаю вам сначала перенести приложение с транспилером TS напрямую, а затем запустить этот контент с помощью инструментов сборки JSPM.

http://www.itsgettinghotamerica.com/2016/07/making-javascript-build-process-work.html