babelでトランスパイルをしても元ファイルとほぼ同じファイルが出力されてしまう


babelでトランスパイルがうまくいきません。

トランスパイルしたjsファイルはできており、ほんのちょっとだけ変更されています。  
(`;`などをつけてくれています。)  
ただしそこしか変わっていません。

トランスパイル前

[code]

    const add1 = i => i + 1
    const multi = (n, m) => i * j
    
    var elem = document.getElementByClassName("js-test5");
    elem.innerHTML = "<span style='color: red;'>span要素に変更したよ！</span>";
     const enzann = () => {
       docment.getElementByClassName('js-test5').innerHTM('daikunn' + (50+50) + 'kg');
     }
     enzann();
    
[/code]

トランスパイル後

[code]

    const add1 = i => i + 1;
    const multi = (n, m) => i * j;
    
    var elem = document.getElementByClassName("js-test5");
    elem.innerHTML = "<span style='color: red;'>span要素に変更したよ！</span>";
    const enzann = () => {
      docment.getElementByClassName('js-test5').innerHTM('daikunn' + (50 + 50) + 'kg');
    };
    enzann();
    
[/code]

gulpの設定と実行結果は以下の通りです。

[code]

    var gulp = require('gulp');              //gulpをインポート
    var babel = require("gulp-babel");
    
    gulp.task('babeltrance', function() {
      gulp.src('dest-after/js/babel/*')
        .pipe(babel())
        .pipe(gulp.dest('dest-after/js'))
    });
    
    gulp.task('babelwatch', function() {
      gulp.watch('dest-after/js/babel/*', ['babel'])
    });
    
    gulp.task('babel', ['babeltrance']);
    
[/code]

ちゃんと動いていそうです。

[code]

    [17:59:09] Starting 'babel'...
    [17:59:09] Finished 'babel' after 9.72 μs
    [17:59:09] Starting 'babeltrance'...
    [17:59:09] Finished 'babeltrance' after 7.16 ms
    
[/code]




はい。あなたのgulpで、babelはきちんと動いています。

では、なぜ「あなたが求めている変換」は行われなかったのでしょうか。  
まずはREADMEちゃんと読みましょうね。  
<https://www.npmjs.com/package/gulp-babel>

このサンプルにあるように、

[code]

    .pipe(babel({
        presets: ['es2015']
    }))
    
[/code]

とすればes2015→es5への変換はだいたい行われるはずです。(一部ポリフィルかそれに類ずるものが必要なのは行われないかもしれませんし、babel-
preset-es2015をインストールしておく必要もあります。)

babelでトランスパイルをするには、そのプリセットを指定してやる必要があるのです。




はい。あなたのgulpで、babelはきちんと動いています。

では、なぜ「あなたが求めている変換」は行われなかったのでしょうか。  
まずはREADMEちゃんと読みましょうね。  
<https://www.npmjs.com/package/gulp-babel>

このサンプルにあるように、

[code]

    .pipe(babel({
        presets: ['es2015']
    }))
    
[/code]

とすればes2015→es5への変換はだいたい行われるはずです。(一部ポリフィルかそれに類ずるものが必要なのは行われないかもしれませんし、babel-
preset-es2015をインストールしておく必要もあります。)

babelでトランスパイルをするには、そのプリセットを指定してやる必要があるのです。

