uglifyjs javascriptクラス - 予期しないトークンエラー

Question

クラスを使用して新しいjavascriptを書き込もうとしていますが、uglifyjs2でコードを小さくしようとすると「予期しないトークン：名前（Utils） 。ここで

が私のクラスである

'use strict'; 

class Utils { 
    // Constructor 
    constructor() { 
     marvin.Utils = Utils; 
    } 

    // Build a Form 
    buildForm(keys) { 
     var args = Array.prototype.slice.call(arguments, 1); 
     var form = {}; 
     keys.forEach(function(index,key) { 
      form[key] = args[index]; 
     }); 
     return form; 
    } 

    // Unique values 
    unique(data) { 
     return new Set(data); 
    } 
} 

uglifyjsで縮小化しようと、私は次のエラー

'予期しないトークン：名前（Utilsの'）を取得すると、に対応

をUの最初の行に、 "class Utils {"

uglifyjs2で新しいES6標準を縮小する際に問題があるようですが、それが問題であるかどうかわかりません。私はuglifyjs2とgrunt-contrib-uglifyを試しましたが、同じエラーが発生します。

ES6の問題が発生した場合は、新しいJSクラスを適切に小さくする方法の解決方法を知っている人はいますか？私はES6からES5に自分のコードを翻訳するために、バーレルを使用しようとしましたが、実際にはコード構造はまったく変更されませんでした。 ES5のクラスと同等のフォームは何ですか？これは翻訳後のコードです。

更新

[OK]をクリックします。だから私は適切なBabelのプリセットとプラグインをGruntfileにインストールしてロードしていませんでした。だから私はそれらをインストールしましたが、まだ動作していません。バベルの実行時に、私は

Running "babel:dist" (babel) task 
Verifying property babel.dist exists in config...OK 
Files: js/es6/utils.js -> js/es6/utils.new.js 
Options: sourceRoot="etc/", sourceMap=false, presets=["babel-preset-es2015"], plugins=["babel-plugin-transform-es2015-classes"] 
Warning: Unknown plugin "babel-plugin-transform-es2015-classes" specified in "base" at 0, attempted to resolve relative to "js/es6" Use --force to continue. 

はここに私のGruntfile configです "バベル" タスクエラー

実行を取得しています。私は自分のアプリケーションのソースファイルがどこにあるのかとは別にnode_modulesとgruntfileを持っています。

grunt.initConfig({ 
    pkg: grunt.file.readJSON('package.json'), 
    // Babel - transpiler from ES6 to ES5 
    babel: { 
     options: { 
      sourceRoot: 'etc/', 
      sourceMap: false, 
      presets: ['babel-preset-es2015'], 
      plugins: ["babel-plugin-transform-es2015-classes"] 
     }, 
     dist: { 
      files: [{ 
      expand: true, 
      src: ['js/es6/*.js'], 
      ext: '.new.js' 
      }] 
     } 
    } 
    }); 
// Set default file path 
    grunt.file.setBase('../python/marvin/web/static/'); 

私のアプリケーションツリーはこのように見えますが、私はetc /ディレクトリ内でgruntを実行しています。すべての私のjavascriptファイルはjsサブディレクトリの下に多くのレベルがあります。

• トランク/
  • など/
    • node_modules/
    • Gruntfile.js
    • パッケージ。JSON
  • パイソン/
    • マーヴィン/
      • ウェブ/静的
        • /
          • JS/
            • ES6/
              • utils.js
          • CSS/

プリセット/プラグインが1つのディレクトリにありますが、javascriptファイルは別のディレクトリにあることをバベル設定にどのように伝えることができますか？

Answer 1

まあ、私は私の見た他の例ともっと一致するように私のディレクトリシステムを再構成することで解決しました。基本的に私のGruntfile、package.json、およびnode_modulesはソースファイルと同じディレクトリレベルにあります。ここに私の新しい構造がある...

• トランク/
  • など/
  • パイソン/
    • マーヴィン/
      • ウェブ/
        • 静的/ の
          • JS/
          • CSS/
          • SRC/
          • Gruntfile.js
          • package.json
          • node_modules/

と私のGruntfileファイルに私の新しいバベルの設定

babel: { 
    options: { 
     sourceMap: false, 
     presets: ['es2015'] 
    }, 
    dist: { 
     files: [{ 
     expand: true, 
     cwd: 'src', 
     src: ['**/*.js'], 
     dest: 'js', 
     ext: '.js' 
     }] 
    } 
} 

のように見えるすべてが正しくtranspiles、と私はきちんとuglifyjsを縮小化することができます。