Les navigateurs qui prend en charge l'importation et l'exportation de la syntaxe pour ECMAScript 6?

Je suis en train d'écrire une application web à l'aide de la MOYENNE de la Pile, et je suis d'essayer d'écrire du code dans ECMAScript 6 JavaScript; cependant, j'obtiens des erreurs dans Chrome et Firefox lors de l'utilisation de l'importation et l'exportation de la syntaxe. Sont t-il actuellement des navigateurs qui prennent entièrement en charge ECMAScript 6?

Note: je ne suis pas de demander quand ECMAScript 6 seront pris en charge par les navigateurs. Je me demande lequel des navigateurs prennent en charge ECMAScript 6 importation et à l'exportation de la syntaxe. Voir https://developer.mozilla.org/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_6_support_in_Mozilla#Features_not_yet_supported_by_Firefox

stackoverflow.com/questions/13355486/...
Mais la réponse à cette question des liens vers un fantastique à jour de la ressource.
Il semble d'importation et d'exportation sont manquantes à partir de cette page. Cependant, je suis lié à la MDN tableau de compatibilité pour spécifiquement que ci-dessus. En bref: pas de navigateur entièrement prend en charge les ES6 à ce point, et, apparemment, aucun ne prend en charge l'importation/exportation.
Me semble que ce n'est pas encore pris en charge sur n'importe quel navigateur. Citant le site web: "Remarque: Cette fonctionnalité n'est pas implémentée dans tous les navigateurs en mode natif en ce moment. Il est mis en œuvre dans de nombreux transpilers, tels que le Traceur du Compilateur et de l'ES6 Module Transpiler." developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/...
La réelle chargeur de module ne fait pas partie de l'ES6 standard et il n'y a actuellement pas de norme pour elle. Si un navigateur ne peut pas charger les modules (selon une norme), il n'a pas beaucoup de sens à l'appui de la syntaxe pour les modules. Donc je suppose que nous devrons attendre jusqu'à ce qu'un standard c'est fini.

OriginalL'auteur Gregory R. | 2015-11-04

  1. 11

    Chrome et Firefox soutien import et export syntaxe (il existe des tests pour bon l'analyse).

    Ce qui n'est pas pris en charge est le chargement de module - vous ne pouvez pas charger le module par tous les moyens, parce que la spécification pour il n'est pas complet. Vous avez à utiliser un certain type de module bundler pour cela. Je ne suis pas développeur front-end, mais j'ai entendu de bonnes opinions sur Cumulatif de mes collègues de travail.

    Webpack, SystemJS, AMD, pour ne nommer que quelques bundlers 🙂
    Cumulatif est le meilleur (super rapide) et la plus facile pour commencer, et exiger zéro de l'apprentissage. il suffit d'exécuter la commande, et cela fonctionne. Je l'ai utilisé pendant plus d'une année avec beaucoup de succès de plusieurs projets allant dans les tailles.
    SystemJS est chargeur de module , et webpack est module gaffe.. est ma compréhension correcte ?
    Qu'entendez-vous par Chrome soutenant import et export syntaxe? Je suis Unexpected token export
    Donc, attendez, il "prend en charge", mais ne peut pas l'utiliser dans n'importe quel contexte? N'est-ce pas plutôt lâche usage du terme de "prise en charge"?

    OriginalL'auteur Ginden

  2. 32

    Il est pris en charge dans:

    • Safari 10.1
    • Chrome 61
    • Firefox 54 – derrière les dom.moduleScripts.paramètre activé dans about:config.
    • Bord 16
    nice , merci pour cette
    Maintenant nativement dans Firefox depuis v60

    OriginalL'auteur Ali

  3. 4

    Maintenant, il y a un pollyfill que vous pouvez utiliser pour importer des ES6 module.

    Je l'ai testé avec succès sur Chrome.

    Voici le lien: http://github.com/ModuleLoader/browser-es-module-loader

    Il est également mis en œuvre de manière native dans Bord 14:

    https://blogs.windows.com/msedgedev/2016/05/17/es6-modules-and-beyond

    Il y a une raison pour laquelle le support est très limitée... je vais écrire une réponse

    OriginalL'auteur Supersharp

  4. 4

    Comme d'autres l'ont dit, le support est encore très limitée. Mais même si il n'y avait plein de soutien.... serait-il être intelligent pour l'utiliser? Comment pourrions-nous le faire?

    Penser. Un typique JS application écrite avec Node JS facilement les modules contient des dizaines, voire des centaines de (très petit) paquet. Voulons-nous vraiment que beaucoup de demandes?

    Browserify, Webpack, Cumulatif etc sont si populaires parce qu'ils permettent de regrouper de nombreux petits paquets dans un téléchargement rapide. Avec code de fractionnement nous pouvons laisser le module bundler décider à transpilation temps, basé sur le code de nos pages utilisent et sur certains paramètres de configuration, comment de nombreuses offres afin de créer et quoi mettre dans chacun d'eux. De cette façon, nous pouvons écrire de nombreuses petit paquets et de les servir comme un (deux) grands ensembles.

    Mon point est que nous devrions diviser notre code en paquets qui fonctionne bien sur un plan conceptuel, puis les combiner ces paquets en faisceaux qui fonctionnent bien sur une technique (réseau). Si nous écrire notre code sur la base de réseau optimale à la taille du paquet, on finit par sacrifier la modularité dans le processus.

    Dans le temps, à l'aide, il ne sera probablement qu'ajouter à la confusion. Par exemple, regardez l'exemple sur le Bord de blog:

    import { sum } from './math.js';

    Notez comment ils ajouter l'extension .js à la from chaîne? En Node JS nous avons l'habitude d'écrire ce que:

    import { sum } from './math';

    Le code ci-dessus également le travail sur le Bord? Et que dire de paquets nommés? Je crains que nous allons voir beaucoup d'incompatibilité ici avant nous à comprendre comment faire de ces chemins travail à travers le conseil d'administration.

    J'aurait danger pour deviner que pour la plupart des développeurs, System.import restera la plupart du temps invisible dans les navigateurs et que seul le regroupement logiciel lui-même vont commencer à l'utiliser (pour des raisons d'efficacité) quand il devient mainstream.

    Notez que HTTP v2 signifie que 1000s de petites demandes ne dispose que d'une faible surcharge par rapport à la fabrication 1 grand. Node js est également utilisé pour le côté serveur des applications et des scripts, des outils, etc, qui ne souffrent pas de la demande ("importer" seraient pour la plupart identiques à l'aide de 'besoin' de celles-ci en termes de sémantique).
    Et si vous regardez plus en détail, vous découvrirez qu'en réalité, le Nœud trop a issues lorsque vous utilisez trop de petits paquets. Pour les grands systèmes composés de centaines de petits colis, le premier besoin de l'arbre peut devenir si grand que vous obtenez (nombre de) secondes de retard de démarrage. En fait, certaines personnes recommandent le regroupement pour le côté serveur (également pour l'HMR, etc).
    toutes ces centaines de demandes de peut être mis en cache. Ou même serviceworker-ed.
    Pas besoin d'insulter. Il ya une raison que dans les lignes directrices pour le progrès des applications web, des conseils vous à inline votre critique de styles et de code JS dans le head du document. Ces demandes feront mal de votre Temps Pour Interactive dans le monde réel. Oui, ces demandes peuvent être mis en cache... puis de nouveau ils ne pourraient pas. Tout le monde à prendre de la perf au sérieux est en train de faire de leur mieux pour minimiser le nombre de demandes, le nombre d'allers-retours et de la taille de la charge utile selon la demande. Parce que c'est ce qui tue les performances si vous n'avez pas de limite.
    La première couche d'inlining est nécessaire pour arrêter de 200 msec temps de chargement de l'écran vide. C'est uniquement pour le chargement initial. Tous les autres demande de ne pas obtenir inline dans HTTP 2.0 comme il y a de multiplexage. Même en HTTP 1.0, si elles sont au service workered, alors qu'ils sont déjà considéré comme inline.

    OriginalL'auteur Stijn de Witt

  5. 0

    Selon Javascript de Google Guide de Style:

    Ne pas utiliser ES6 modules encore (c'est à dire la export et import mots-clés),
    comme leur sémantique ne sont pas encore finalisés. Notez que cette politique
    être réexaminée une fois que la sémantique est complètement standard.

    //Don't do this kind of thing yet:
//------ lib.js ------
export function square(x) {
    return x * x;
}
export function diag(x, y) {
    return sqrt(square(x) + square(y));
}

//------ main.js ------
import { square, diag } from 'lib';

    Cependant, import et export sont mis en œuvre dans de nombreux transpilers, tels que le Traceur Compilateur, Babel ou Cumulatif.

    OriginalL'auteur Gregory R.