は、私はこのようなES6のインポートを書いて

Question

が必要ですbabelがCommonJSファイルに変換することは間違いないので、私はbabelプラグイン 'transform-es2015-modules-amd'をインストールしてからもう一度やり直してみてください。今回は、es6コードをこの種のものに変換します：

define(['jquery'], function (_jquery) {.........}); 

しかし、私はちょうどこのようなものに変換したい：

require(['jquery'],function($){......}); 

どのように私はこの夢を実現することができます、あなたは私に何か提案を与えることができれば感謝します、ありがとう！

Answer 1

ブラウザ統合用のビルドスクリプトが必要です。 gulpはこの例のように のverに適しています。ブラウザ統合のためにbrowserifyを使用します。必要と協力し、

インポートします//あなたのindex.jsで

var gulp = require('gulp'); 
var browserify = require('browserify'); 
var babelify = require('babelify'); 
var source = require('vinyl-source-stream'); 
gulp.task('build', function() { 
    browserify({ 
    entries: 'index.js', 
    extensions: ['.js'], 
    debug: true 
    }) 
    .transform(babelify) 
    .bundle() 
    .pipe(source('bundle.js')) 
    .pipe(gulp.dest('dist')); 
}); 

gulp.task('default', ['build']); 

はあなたが好きで、ブラウザ内bundle.js出力を使用するソースを使用gulpfile.js。 Browserifyが一つのファイルにまとめ、それらすべてをバンドルES5

にindex.js

Transpiledソースファイルdistディレクトリに

をそれを送っ

で始まる、あなたの依存関係ツリーをトラバース

• vendorlibs jqueryのようなものをバンドルしたくない場合は、browserifyの設定オプションがいくつかあります。彼らはあなたがbrowserify-global-shimであるbrowserifyのために外部libs extにrequireを使用できるようにします。

  結論：

  npm install --save-dev browserify babelify 
  

  オプションパッケージ

  browserify-global-shim 
  

  一気が必要ですが、ビルド

  gulp