Babel es2015 Presets nicht übersetzen Karte und auf ES5

Ich bin mit großen Schluck-babel meines es6 Code übersetzenBabel es2015 Presets nicht übersetzen Karte und auf ES5

gulp.task('build_all_debug', ['config', 'compile'], function() { 
    var stream = gulp.src(['public/js/config.js', 'public/js/*.js', 'public/compiled/*.js']) 
     .pipe(babel({ 
      presets: ['es2015'] 
     })) 
     .pipe(concat('app.js')) 
     .pipe(gulp.dest('public/dist')); 
    return stream; 
});

bis ES5 Während es meistens gut funktioniert, ist es nicht wirklich Karte übersetzen und Einstellen. Mein Ergebnis js Code enthält sie noch, und wenn ich Unit-Test mit Karma/Mocca/PhantomJS laufen, bekam ich folgende Fehlermeldung:

PhantomJS 2.1.1 (Mac OS X 0.0.0) notes.controller "before each" hook: workFn for "loads notes from the service" FAILED 
    Can't find variable: Map 
    [email protected]/dist/app.js:2402:39

Gibt es eine Möglichkeit babel zu zwingen Karte und Set zu übersetzen Objekt und Array in es5?

Quelle

2016-11-02 swang

Wenn Sie ES6 über Babel verwenden, sollten Sie Ihre Dateien nicht miteinander verketten. Sie werden in Schwierigkeiten geraten, wenn Sie das tun, anstatt einen Modulbündler zu verwenden. – loganfsmyth

@loganfsmyth, können Sie bitte vorschlagen, welche Modul Bundler ist die "übliche" Wahl für Babel? Ich fühle mich jetzt wie in einem Kaninchenloch, der einzige Grund, warum ich Babel benutze, ist, dass ich Typescript aufgrund desselben Map/Set-Problems nicht direkt zu es5 kompilieren kann. Aus Kompatibilitätsgründen muss ich babel verwenden ein Babel-Rohr hinzufügen, aber jetzt sieht es so aus, als müsste ich den ganzen Bauprozess ändern? – swang

Ein relativ normaler Workflow heutzutage wäre ein Modulbündler wie Webpack oder Browserify. – loganfsmyth

Sie haben babel-polyfill im Code enthalten.

Sie müssen es installieren mit npm:

npm install babel-polyfill

und dann, wenn Sie ES6 Module verwenden:

import 'babel-polyfill';

oder:

require('babel-polyfill');

Wenn Sie möchten, führe deinen Code im Browser aus, du kannst ihn von cdnjs laden:

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/6.16.0/polyfill.min.js"></script>

Quelle

2016-11-02 19:51:51

Leider, da das OP gulp-concat verwendet, hat es kein Modulsystem und somit keine einfache Möglichkeit, dies zu tun :( – loganfsmyth

@loganfsmyth So ist es nicht möglich, externe Module mit 'gulp-concat' zu verwenden? –

'babel-polyfill' ist CommonJS, also müsste ich browserify ausführen und das dann auf dein Bundle übertragen? – loganfsmyth

Babel kann Map und Set nicht "übersetzen", weil sie keine Sprachfunktionen sind (obwohl sie in der ES-Spezifikation beschrieben sind). Sie sind Klassen, die im globalen Umfang existieren.

Sie sollten ein Polyfill verwenden, das die ES6-Sammlungen definiert, damit Sie sie in Browsern verwenden können, die keine Unterstützung bieten. Ich bin mir nicht sicher, welche Bibliothek Babel verwendet, aber es6-shim sollte alle wichtigen Teile abdecken.

Sie müssen Ihren Code nicht ändern, um das Polyfill zu verwenden, es definiert nur Map (und Freunde) für den normalen Gebrauch später.

Quelle

2016-11-02 19:50:25 ssube

bin ich richtig Es6-Shim ist eine nicht-browser-spezifische nicht-babel-spezifische Bibliothek, die von Browser, Node und Babel verwendet werden kann? sollte ich in diesem fall babel-polyfill bevorzugen? – swang

Babel transpiliert nicht Map und Set zu ES5.

Verwenden Sie stattdessen ihre polyfill:

In order to support Maps, Sets, WeakMaps, and WeakSets in all environments you must include the Babel polyfill.

Source

Quelle

2016-11-02 19:50:42 Timo

Babel es2015 Presets nicht übersetzen Karte und auf ES5

Antwort

Verwandte Themen