javascript - 使用 Gulp 设置 TypeScript/Angular

Question

非常熟悉 Gulp 和 Angular，不熟悉 TypeScript。我一直在使用 Browserify 来捆绑我的 JavaScript 并管理依赖关系树，但据我所知，我不想将 Browserify 与 TypeScript 一起使用。

在我的主/入口点文件中有这样的东西之前。

require('angular');
require('angular-ui-router');
require('./myModules/testModule')
require('./myControllers/mainController')

angular.module('exampleApp', ['mainController','testModule'])

    .config(...);

}());

这将确保所有必要的文件都被捆绑到最终的 .js 中。应用以适当的顺序排列。

然而，使用 TypeScript(使用 gulp-typescript)来引用其他文件进行构建的方式似乎是:

/// <reference path="myModule.ts"/>)

但这只适用于其他 TypeScript 文件。我将如何加载我的 angular和其他非 TS 部门？

作为引用，我的构建看起来像:

var jsStream = function() {
    return gulp.src(PUBLIC + '/js/**/*.ts')
        .pipe(typescript({
            declarationFiles: false,
            sortOutput: true,
            out: 'app.js'
        }))
        .pipe( streamify( rev() ) )
        .pipe( gulp.dest( PATHS.dest.js ) );
};

Answer 1

TypeScript 引用如 /// <reference path="myModule.ts"/>用于转译为 JS、解决依赖关系，以及用于文本编辑器或 IDE 中的 Intellisense。如果您希望在 TypeScript 中引用的现有库不是用 TypeScript 编写的，请查看 tsd。和 DefinitelyTyped project在 GitHub 上。

您仍然可以像以前一样使用 Browserify 进行捆绑。唯一的区别是您需要先通过 tsc 将您的 TypeScript 转换为 JavaScript或者如你所说 gulp-typescript .将 TS 作为 JS 后，将 if 与其他文件捆绑在一起，例如使用 Browserify 的 Angular 。我不知道这个插件是否有用，但似乎有一个名为 tsify 的 TypeScript Browserify 插件.也许也可以检查一下。