web-dev-qa-db-ja.com

醜化に失敗しました。予期しない文字 '`'

gulp-uglifyは、このコードをuglifyできません。

    var alertString = `<?xml version="1.0" encoding="UTF-8" ?>
        <document>
          <alertTemplate>
            <title>${title}</title>
            <description>${description}</description>
          </alertTemplate>
        </document>`

それは文字で文句を言います： `。この文字は、AppleのJSフレームワークに有効です。 uglifyパッケージ内には、これらの文字とその中のテキスト文字列を無視するものが何も表示されません。ドキュメントから何かが足りませんか？

gulpgulp-uglifytvmltvjs
9
sailens

Gulp-uglifyは、ECMAScript 2015（別名ES6、別名Harmony）をまだ公式にサポートしていませんが、少し変更を加えるだけで、開発中のリポジトリを使用できます。

方法：

  1. コンソールを開き、次のように入力します

_cd node_modules/gulp-uglify_

  1. Package.jsonを編集します

_dependencies": { "uglify-js": "git+https://github.com/mishoo/UglifyJS2.git#harmony" },_

  1. コンソール入力：

_npm update_

そして、.pipe(uglify())を再度実行する準備ができました

代替ソリューション

  1. npmから以下をダウンロードします。

_npm install --save-dev gulp-uglify gulp-babel babel-preset-es2015_

  1. _gulpfile.js_に次の要件を追加します。

var babel = require('gulp-babel'), uglify = require('gulp-uglify');

  1. Gulpタスクは次のようになります。

gulp.task('uglify', function(){ gulp.src('*.js') .pipe(babel({ presets: ['es2015'] })) .pipe(uglify().on('error', function(e){ console.log(e); })) .pipe(gulp.dest('js')); });

これは、すべてのEcmaScript 2015 JSコードをEcmaScript5にトランスパイルし、それを醜くします。

15
sailens

ES6は、 gulp-uglify-es と呼ばれる新しいバージョンのgulp-uglifyでサポートされています。 Gulp 4を使用している場合は、.browserlistrcを使用することもできます。以下は、私が使用しているプロジェクトの例で、ChromeおよびFirefox56のサポートが必要です。

gulpfile.js

    const uglify = require('gulp-uglify-es').default;

    .pipe(babel({
        presets: ['@babel/preset-env'],
        compact:false
     }))
     .pipe(uglify())

.browserlistrc（ browserlistで詳細を読む ）

last 2 chrome versions
firefox 56
1
mbokil