Browserify + browserify-ngannotate + Tsifyが機能しない

掃除

私はbrowserifyとtsifyでgulpを使用しています。これは非常にうまく機能しています。次に、browserify-ngannotateを使用してng-annotateを追加することにしました。

ng-annotate browserifyトランスフォームを追加しましたが、tsifyがプラグインとして追加された場合、ng-annotateトランスフォームは呼び出されないようです。

tsifyプラグインを削除すると、ng-annoteが呼び出されます。プラグイン/トランスフォームの登録をいじって切り替えました。ここで何かが足りないのですか、それともbrowserify / tsifyで問題をログに記録する必要がありますか?

var browserify = require('browserify');
var browserSyncConfig = require('../config').browserSync;
var browserSync = require('browser-sync').get(browserSyncConfig.instance);
var watchify = require('watchify');
var tsify = require('tsify');
var ngAnnotate = require('browserify-ngannotate');
var mergeStream = require('merge-stream');
var bundleLogger = require('../util/bundleLogger');
var gulp = require('gulp');
var handleErrors = require('../util/handleErrors');
var source = require('vinyl-source-stream');
var config = require('../config').browserify;
var _ = require('lodash');

var browserifyTask = function (devMode) {

    var browserifyThis = function (bundleConfig) {

        if (devMode) {
            // Add watchify args and debug (sourcemaps) option
            _.extend(bundleConfig, watchify.args, {debug: true});
            // A watchify require/external bug that prevents proper recompiling,
            // so (for now) we'll ignore these options during development. Running
            // `gulp browserify` directly will properly require and externalize.
            bundleConfig = _.omit(bundleConfig, ['external', 'require']);
        }

        var b = browserify(bundleConfig);

        if (bundleConfig.tsify) {
            b = b.plugin(tsify, {
                noImplicitAny: false,
                target: 'ES5',
                noExternalResolve: false,
                module: 'commonjs',
                removeComments: false
            });
        }

        if (bundleConfig.ngAnnotate) {
            b = b.transform(ngAnnotate);
        }

        var bundle = function () {
            // Log when bundling starts
            bundleLogger.start(bundleConfig.outputName);

            return b
                .bundle()
                // Report compile errors
                .on('error', handleErrors)
                // Use vinyl-source-stream to make the
                // stream gulp compatible. Specify the
                // desired output filename here.
                .pipe(source(bundleConfig.outputName))
                // Specify the output destination
                .pipe(gulp.dest(bundleConfig.dest))
                .pipe(browserSync.stream());
        };

        if (devMode) {
            // Wrap with watchify and rebundle on changes
            b = watchify(b, {
                poll: true
            });

            // Rebundle on update
            b.on('update', bundle);
            bundleLogger.watch(bundleConfig.outputName);
        } else {
            // Sort out shared dependencies.
            // b.require exposes modules externally
            if (bundleConfig.require) b.require(bundleConfig.require);
            // b.external excludes modules from the bundle, and expects
            // they'll be available externally
            if (bundleConfig.external) b.external(bundleConfig.external);
        }

        return bundle();
    };

    // Start bundling with Browserify for each bundleConfig specified
    return mergeStream.apply(gulp, _.map(config.bundleConfigs, browserifyThis));

};

gulp.task('browserify', function () {
    return browserifyTask()
});

// Exporting the task so we can call it directly in our watch task, with the 'devMode' option
module.exports = browserifyTask;
ガウス

ng-annotateオプションで拡張子を指定することで解決できます。

bundler.transform(ngAnnotate, { ext: ['.ts', '.js'] });

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

Angular-Laddaがbrowserifyで正しく機能しない-shim / browserify

分類Dev

Browserify + NodeJS:機能していません

分類Dev

BrowserifyがYoutubeiFrameAPIを壊す

分類Dev

BrowserifyおよびjQueryDataTables拡張機能

分類Dev

webpack browserify --ignore equivalent?

分類Dev

RangyClassApplierとbrowserify

分類Dev

Browserify with Zurb Foundation Framework

分類Dev

browserify'require '配置

分類Dev

Browserify-JsSip

分類Dev

Browserify の使用時に ui.bootstrap が必要

分類Dev

bower、browserify、requirejs、webpackの違いは?

分類Dev

Gulpを使用したBrowserifyとRendr

分類Dev

jqueryはどこから必要になりますか?--browserify --browserify-shim

分類Dev

Browserify-symlinkedモジュールのpackage.jsonで変換がnpm3で機能しない

分類Dev

React webpack / browserify "unexpected token"

分類Dev

browserify exclude cannot find module

分類Dev

Alias a npm module with browserify shim

分類Dev

Convert Webpack syntax to browserify syntax

分類Dev

browserify + tsify + babelify; バベルは無視されます

分類Dev

grunt + browserify + tsify + babelifyを設定する方法は?

分類Dev

tsify-browserifyファイルのみを読み取ります

分類Dev

Browserify、Webpack、Babelなしでreactjsモジュールが必要

分類Dev

JavaScript-Gulp / Browserify:SyntaxError:予期しないトークン

分類Dev

コマンドラインから何もしないbrowserify

分類Dev

Browserifyは使用できないbundle.jsを生成します

分類Dev

browserify-shimを期待どおりに機能させる

分類Dev

noparse = trueでbrowserify-どのように機能するか

分類Dev

BrowserifyバンドルをReactDevToolsでうまく機能させる

分類Dev

browserifyが機能していません。未定義のprocess.versions.nodeを提供します

Related 関連記事

  1. 1

    Angular-Laddaがbrowserifyで正しく機能しない-shim / browserify

  2. 2

    Browserify + NodeJS:機能していません

  3. 3

    BrowserifyがYoutubeiFrameAPIを壊す

  4. 4

    BrowserifyおよびjQueryDataTables拡張機能

  5. 5

    webpack browserify --ignore equivalent?

  6. 6

    RangyClassApplierとbrowserify

  7. 7

    Browserify with Zurb Foundation Framework

  8. 8

    browserify'require '配置

  9. 9

    Browserify-JsSip

  10. 10

    Browserify の使用時に ui.bootstrap が必要

  11. 11

    bower、browserify、requirejs、webpackの違いは?

  12. 12

    Gulpを使用したBrowserifyとRendr

  13. 13

    jqueryはどこから必要になりますか?--browserify --browserify-shim

  14. 14

    Browserify-symlinkedモジュールのpackage.jsonで変換がnpm3で機能しない

  15. 15

    React webpack / browserify "unexpected token"

  16. 16

    browserify exclude cannot find module

  17. 17

    Alias a npm module with browserify shim

  18. 18

    Convert Webpack syntax to browserify syntax

  19. 19

    browserify + tsify + babelify; バベルは無視されます

  20. 20

    grunt + browserify + tsify + babelifyを設定する方法は?

  21. 21

    tsify-browserifyファイルのみを読み取ります

  22. 22

    Browserify、Webpack、Babelなしでreactjsモジュールが必要

  23. 23

    JavaScript-Gulp / Browserify:SyntaxError:予期しないトークン

  24. 24

    コマンドラインから何もしないbrowserify

  25. 25

    Browserifyは使用できないbundle.jsを生成します

  26. 26

    browserify-shimを期待どおりに機能させる

  27. 27

    noparse = trueでbrowserify-どのように機能するか

  28. 28

    BrowserifyバンドルをReactDevToolsでうまく機能させる

  29. 29

    browserifyが機能していません。未定義のprocess.versions.nodeを提供します

ホットタグ

アーカイブ