gulp での es6 から es5 への変換の分析例

黄舟
リリース: 2017-07-24 13:43:35
オリジナル
1949 人が閲覧しました

gulp での es6 から es5 への変換のインスタンス分析

npm install --save-dev gulp-babel  babel-preset-es2015
ログイン後にコピー
var babel = require("gulp-babel");
// es6
gulp.task('es6', function() {
    return gulp.src('./wuqian/**/*.js')
        .pipe(babel())
        .pipe(gulp.dest('dist/'));
});
ログイン後にコピー

プロジェクトのルート パスにファイル .babelrc を作成します。内容は

{  "presets": ["es2015"]
}
ログイン後にコピー

gulpの設定は以下の通り:

var gulp = require("gulp");  
var babel = require("gulp-babel");  
  
gulp.task("default", function () {  
    return gulp.src("js**/*.js")// ES6 源码存放的路径  
        .pipe(babel({  
            presets: ['es2015']  
        }))  
        .pipe(gulp.dest("dist")); //转换成 ES5 存放的路径  
});
ログイン後にコピー

ES6の例:

let [foo, [[bar], baz]] = [1, [[2], 3]];  
console.log(foo);  
console.log(bar);  
console.log(baz);
ログイン後にコピー

Converted es5:

"use strict";  
  
var foo = 1,  
    bar = 2,  
    baz = 3;  
  
console.log(foo);  
console.log(bar);  
console.log(baz);
ログイン後にコピー


以上がgulp での es6 から es5 への変換の分析例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート