Question

我正在尝试构建一个基于gulp的流程，该流程将使用来自bower包的AngularJS和一个名为debowerify的工具（我认为应该让我将已安装的bower组件插入到TSIFY / Browserify流中）。基本上，我想构建一个app.js文件，以便在我的应用程序中使用（使用我需要的所有JS）。我无法为我的生活让AngularJS在这个过程中工作。我正在使用index.ts文件（见下文）引入我的browserify参考资料。由于编译过程优化了库，因此除非您以某种方式使用导入，因此我在index.ts文件中测试了模块调用。

index.ts

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

/// <reference path="greeter.ts" />

import angular = require('angular');
import greeter = require('./Greeter');
var greet = new greeter();
greet.sayHello();

angular.module('app', []);

以下是我的口号：

gulpfile.js

var gulp = require('gulp');

var source = require('vinyl-source-stream');

var browserify = require('browserify');
var tsify = require('tsify');

var debowerify = require('debowerify');

var exorcist = require('exorcist');

var config = {
    publicDir: __dirname + '/app',
    path: __dirname + '/src/typescript',
    main: 'index.ts',
    result: 'app.js'
};

gulp.task('compile-ts', function(){
    var bundler = browserify({ 
                    basedir: config.path, 
                    debug: true
                })
            .add(config.path + '/' + config.main)
            .plugin(tsify)
            .transform(debowerify);

    return bundler.bundle()
        .pipe(exorcist(config.publicDir + '/app.js.map'))
        .pipe(source(config.result))
        .pipe(gulp.dest(config.publicDir));
});

我构建的自定义TS文件（即：greeter.ts）运行良好。但是，当我运行我的gulp compile-ts任务时，我只在浏览器中得到错误，因为它告诉我angular未定义（在调用angular.module时）。我怀疑CommonJS可能不支持角度，但我也发现了互联网的相关信息。我试图尽可能避免AMD，但如果这是我唯一的选择，我肯定会重新考虑。如果我链接到我的html中的角度脚本而不是尝试将其导入我的打字稿，我有这个应用程序工作，但我只是不满意这种方法，因为我知道这应该工作。

Answer 1

Angular目前不支持CommonJS，取代

import angular = require('angular');

与

require('angular');

为我解决了。请参阅here。

TSIFY与Typescript AngularJS的兼容性

1 个答案: