Импорт AngularJS в Typescript как AMD

Я пытаюсь выполнить учебник по github для остановки процесса сборки для typescript и angularjs. Я должен быть честным, я действительно борется. Я взял проект из github и добавил angularjs к файлу bower, файлам и каталогу lib с файлом angular.ts(после настройки JQuery):

/// <reference path="../typings/tsd.d.ts">
var angular= angular;
export = angular;
</reference>

К сожалению, когда я пытаюсь сделать следующее, мне не повезло в регистрации моего модуля приложения:

import JQuery = require("../lib/JQuery");
import angular = require("../lib/angular");
class A{
 public add(number1:number, number2:number):number{
 return number1+number2;
 }
 public colorBG():void{
 var app = angular.module('myapp',[]);
 $("body").css({"background-color":"black"})
 }
}
export = A;

Я вижу противоречивую информацию в Интернете об этом, поскольку тип импорта для angular невозможен как AMD, но определенно типизированный печатающий файл экспортировал его как AMD, и что дает? Процесс сборки gulp завершается успешно, но вызов angular.module жалуется, что он не является функцией в хром-консоли. Есть ли трюк для получения angular в typescript, чтобы я мог объединить один выходной файл для моего html? Я попробовал requirejs для AMD, tsify/browsify для commonjs, и я не могу заставить работать. Заранее благодарим за любые рекомендации.

1 ответ

Вам необходимо:

Установить определения типов для зависимостей:

tsd install angular jquery --save

Установите зависимости с помощью npm:

npm init
npm install angular jquery --save

Это означает, что ваши зависимости не будут находиться в папке lib. Они будут находиться в папке node_modules.

Ваш файл /typings/tsd.d.ts должен содержать ссылки на все ваши зависимости:

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

Затем вы можете ссылаться на /typings/tsd.d.ts на свои модули:

/// <reference path="../typings/tsd.d.ts">
import { $ } from "jquery";
import { angular } from "angular";
class A {
 public add(number1:number, number2:number):number{
 return number1+number2;
 }
 public colorBG():void{
 var app = angular.module('myapp',[]);
 $("body").css({"background-color":"black"})
 }
}
export { A };
</reference>

Так как TypeScript 1.5, вы должны использовать синтаксис модуля ES6.

Update

Начиная с версии 2.0, рекомендуемое решение - npm:

$ npm install jquery --save
$ npm install @types/jquery --save-dev

Параметры и tsd больше не требуются.

licensed under cc by-sa 3.0 with attribution.