grunt + browserify + tsify + babelifyの設定方法は？

Question

私はgrunt + browserify + tsify + babelify（デバッグあり）を設定するのに苦労しています。

以下のgruntfile設定ではtypescriptをコンパイルしますが、バベルの移植は行われていません。

誰でも私にこれを行う方法を教えてもらえますか？ （私はgulpを使ってこれを行う必要がありますか？）

 browserify: { 
     main: { 
      src: 'app/scripts/main.ts', 
      dest: 'app/scripts/bundle.js', 
     }, 
     options: { 
      browserifyOptions: { 
       plugin: [['tsify']], 
       transform: [['babelify', {presets: ['es2015'], extensions: ['.ts']}]], 
       debug: true 
      } 
     } 
    } 

tsconfig.jsonのターゲットは 'es2015'に設定されています。

Answer 1

がtransforms first and then the pluginsをロードするので、プラグインの後にトランスフォームを置くことは、宣言的な設定ではできません。

しかし、あなたはgrunt-browserifyconfigure機能を使用し、プラグインを設定し、内部変換することができ、機能を言った：

browserify: { 
    main: { 
     src: 'app/scripts/main.ts', 
     dest: 'app/scripts/bundle.js', 
    }, 
    options: { 
     browserifyOptions: { 
      debug: true 
     }, 
     configure: function (bundler) { 

      bundler.plugin(require('tsify')); 
      bundler.transform(require('babelify'), { 
       presets: ['es2015'], 
       extensions: ['.ts'] 
      }); 
     } 
    } 
}