Using babel-standalone in the browser

javascript node.js babeljs polyfills
Jamgreen picture Jamgreen · Oct 11, 2016 · Viewed 11.4k times · Source

I am using babel-standalone and I am doing the exact same thing as https://github.com/Daniel15/babel-standalone/blob/master/examples/scriptTag-src.htm, but I get the warning

You are using the in-browser Babel transformer. Be sure to precompile your scripts for production - https://babeljs.io/docs/setup/

I don't know what to do. Shouldn't it just translate all my ES6 code to code supported by older browsers?

Answer

Frxstrem picture Frxstrem · Oct 11, 2016

It's just a warning, nothing to worry about.

It's just telling you that you shouldn't run Babel in the browser on production sites, because running Babel in the browser is slower than precompiling your files with Babel, because the browser will have to compile your files every time you open a page. But if you're running it for development or personal pages, or if you just don't care (e.g., you don't have that much code), you won't need to worry about this warning.

Related questions

How do I install the babel-polyfill library?

I just started to use Babel to compile my ES6 javascript code into ES5. When I start to use Promises it looks like it's not working. The Babel website states support for promises via polyfills. Without any luck, I tried …

Read More
Using Node.js require vs. ES6 import/export

In a project I'm collaborating on, we have two choices on which module system we can use: Importing modules using require, and exporting using module.exports and exports.foo. Importing modules using ES6 import, and exporting using ES6 export Are …

Read More
Babel 6 regeneratorRuntime is not defined

I'm trying to use async, await from scratch on Babel 6, but I'm getting regeneratorRuntime is not defined. .babelrc file { "presets": [ "es2015", "stage-0" ] } package.json file "devDependencies": { "babel-core": "^6.0.20", "babel-preset-es2015": "^6.0.15", "babel-preset-stage-0": "^6.0.15" } .js file "use strict"; async function foo() { await bar(); } function bar() { } …

Read More