将 AngularJS 作为 AMD 导入 Typescript
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32770119/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Importing AngularJS Into Typescript as AMD
提问by Shawn
I am trying to follow the tutorialon github to stup a build process for typescript and angularjs. I have to be honest I am really struggling. I took the project from github and added angularjs to the bower file, the typings and the lib directory with the angular.ts file (following how JQuery was setup):
我正在尝试按照github 上的教程来构建 typescript 和 angularjs 的构建过程。老实说，我真的很挣扎。我从 github 获取了该项目，并将 angularjs 添加到 bower 文件、typings 和 lib 目录以及 angular.ts 文件（遵循 JQuery 的设置方式）：
/// <reference path="../typings/tsd.d.ts"/>
var angular= angular;
export = angular;
Unfortunately, when I attempt the following I have no luck in getting my app module registered:
不幸的是，当我尝试以下操作时，我没有成功注册我的应用程序模块：
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;
I am seeing conflicting information online about this being type of import for angular not being possible as an AMD but the definitely typed typing file has it exported as an AMD so what gives? The gulp build process completes successfully but the call to angular.module complains it is not a function in the chrome console. Is there a trick to getting angular into typescript so I can concatenate one output file for my html? I have tried requirejs for AMD, tsify/browserify for commonjs and I cannot get either to work. Thanks in advance for any guidance.
我在网上看到有关这种 angular 导入类型无法作为 AMD 的相互矛盾的信息，但绝对类型的打字文件已将其导出为 AMD，那么有什么用呢？gulp 构建过程成功完成，但对 angular.module 的调用抱怨它不是 Chrome 控制台中的函数。有没有技巧可以将 angular 放入打字稿中，以便我可以为我的 html 连接一个输出文件？我已经为 AMD 尝试了 requirejs，为 commonjs 尝试了 tsify/browserify，但我无法让任何一个工作。提前感谢您的任何指导。
回答by Remo H. Jansen
You need to:
你需要：
Install type definitions for dependencies:
安装依赖项的类型定义：
tsd install angular jquery --save
Install dependencies using npm:
使用 npm 安装依赖项：
npm init
npm install angular jquery --save
This means that your dependencies will not be under the libfolder. They will be under the node_modulesfolder.
这意味着您的依赖项将不在该lib文件夹下。它们将位于node_modules文件夹下。
Your /typings/tsd.d.tsfile needs to contain references to all your dependencies:
您的/typings/tsd.d.ts文件需要包含对所有依赖项的引用：
/// <reference path="./jquery/jquery.d.ts"/>
/// <reference path="./angular/angular.d.ts"/>
Then you can reference the /typings/tsd.d.tsfrom your modules:
然后你可以/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 };
Since TypeScript 1.5 you should use the ES6 module syntax.
从 TypeScript 1.5 开始，您应该使用ES6 模块语法。
Update
更新
Since 2.0 the recomended solution is npm:
从 2.0 开始，推荐的解决方案是 npm：
$ npm install jquery --save
$ npm install @types/jquery --save-dev
Typings and tsd are no longer required.
不再需要打字和 tsd。
