Comment faire pour installer babel et à l'aide de ES6 localement sur Navigateur?

Donc, je suis le tutoriel pour apprendre ES2015 ici:

http://k33g.github.io/2015/05/02/ES6.html

Mais, je ne trouve pas ce fichier basé sur le tutoriel:

node_modules/babel-core/browser.js

Où puis-je obtenir browser.js? Parce qu'après j'ai de l'exécuter:

npm install babel-core

il y a 2 browser.js dans node_modules\babel-core

1 node_modules\babel-core\lib\api\register\browser.js
2 node_modules\babel-core\lib\api\browser.js

Lequel dois-je copier?

OriginalL'auteur sekti92 | 2015-11-11

  1. 6

    Depuis babel 6.2.0 browser.js a été supprimé.

    Suivantes Babel documentation, vous avez deux options:

    1. Utilisation babel-standalone:

    Il est autonome construire de Babel pour une utilisation dans non-Node.js les environnements, y compris les navigateurs. C'est un remplacement de babel-browser et est utilisé dans l'officiel de Babel repl

    2. Bundle de votre propre fichier:

    Utiliser un système de regroupement comme browserify/webpack et exiger directement babel-core mnp module et assurez-vous de configurer correctement browserify ou webpack afin d'éviter toute erreur en raison de la pure nœud dépendances et ainsi de suite.

    Exemple de config à l'aide de webpack (j'ai laissé qu'un seul):

    {
    ...
    module: {
      loaders: [
        ...
        {
          loader: 'json-loader',
          test: /\.json$/
        }
      ]
    },
    node: {
      fs: 'empty',
      module: 'empty',
      net: 'empty'
    }
}

    Puis dans votre code:

    import {transform} from 'babel-core';
import es2015 from 'babel-preset-es2015';
import transformRuntime from 'babel-plugin-transform-runtime';

...
transform(
        /* your ES6 code */,
        {
          presets: [es2015],
          plugins: [transformRuntime]
        }
      )
...

    Noter que les plugins et les presets besoin d'être requis de le code et ne peut pas être passé en tant qu'option de chaîne.

    Alors... Webpack pourrait se moquer de nœud de modules, c'est cool. Je pensais ne jamais la faire construire avant de Babel sortir un guide sur l'utilisation de Babel 6 dans les navigateurs.

    OriginalL'auteur JBE

  2. 8

    En navigateur transpiling a été retiré de Babel 6, cependant Daniel15 a créé autonome de construire pour une utilisation en "non-Node.js les milieux, y compris les navigateurs" ici:

    https://github.com/Daniel15/babel-standalone

    Tout ce que vous devez faire est d'ajouter cette référence à votre page:
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.4.4/babel.min.js"></script>

    Et puis assurez-vous que vous utilisez le script type="text/babel" attribut dans vos références à d'autres fichiers de script.

    est-ce le soutien à l'exportation et à l'importation? Récemment, j'ai utiliser la fonction importer et exporter à l'aide de gulp + babelify + browserify + vinyle-source-ruisseau
    Le bon repo est maintenant dans @babel babeljs.io/docs/en/next/babel-standalone.html
    Encore suite à @BrianM.Chasse commentaire: github.com/babel/babel/tree/master/packages/babel-standalone

    OriginalL'auteur Mark Gibaud

  3. 1

    Vous avez besoin d'utiliser browser.js de babel-browser package: https://babeljs.io/docs/usage/browser/

    Et le meilleur de tous à utiliser une compilation sur le côté serveur.

    il n'y a pas de babel-browser à l'intérieur de node_modules/babel-core/ homme
    Vous avez besoin d'installer ce paquet: npm install babel-browser --save
    babel-navigateur 6.1.19 ne semble pas compatible avec babel 6.2.0
    Liées github discussion: github.com/babel/babel/commit/...
    Personne ne sait d'une bonne recette pour le montage de réagir/JSX côté serveur transpiling dans un django flux de travail? C'est très bien, si à l'aide d'un nœud principal - mais nous ne sommes pas.

    OriginalL'auteur stdob--