Questions tagged [babeljs]

Babel (formerly 6to5) is a JavaScript compiler. It transforms ES6+/ES2015 code into ES5 code.

Babel (formerly 6to5) is a JavaScript compiler.
It transforms ES6+/ES2015 code into ES5 code.


Important Note about Babel v6

With Babel v6, Babel became a platform for JS code transformations. That means it doesn't include any ES2015 to ES5 transformers by default. This has to be enabled explicitly.

Please see


Resources:

9692 questions
1300
votes
11 answers

Using Node.js require vs. ES6 import/export

In a project I am 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…
kpimov
  • 13,632
  • 3
  • 12
  • 18
845
votes
12 answers

Call async/await functions in parallel

As far as I understand, in ES7/ES2016 putting multiple await's in code will work similar to chaining .then() with promises, meaning that they will execute one after the other rather than in parallel. So, for example, we have this code: await…
Victor Marchuk
  • 13,045
  • 12
  • 43
  • 67
825
votes
48 answers

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", …
BrunoLM
  • 97,872
  • 84
  • 296
  • 452
519
votes
19 answers

Getting Unexpected Token Export

I am trying to run some ES6 code in my project but I am getting an unexpected token export error. export class MyClass { constructor() { console.log("es6"); } }
Jason
  • 5,247
  • 2
  • 10
  • 3
392
votes
6 answers

How do I generate sourcemaps when using babel and webpack?

I want to set up a config to generate sourcemaps. I'm running webpack serve from the command line, which compiles successfully. But I really need sourcemaps. This is my webpack.config.js. var webpack = require('webpack'); module.exports = { …
user916367
340
votes
8 answers

babel-loader jsx SyntaxError: Unexpected token

I'm a beginner in React + Webpack. I found a weird error in my hello world web app. I'm using babel-loader in webpack to help me convert jsx into js, but it seems like babel can't understand jsx syntax. Here are my dependencies: "devDependencies":…
Keyu Lin
  • 3,669
  • 3
  • 12
  • 8
308
votes
26 answers

How to resolve "Cannot use import statement outside a module" from Jest when running tests?

I have a React application (not using Create React App) built using TypeScript, Jest, Webpack, and Babel. When trying to run yarn jest, I get the following error: I have tried removing all packages and re-adding them. It does not resolve this. I…
Logan Shoemaker
  • 3,377
  • 2
  • 13
  • 11
306
votes
8 answers

ES6 exporting/importing in index file

I am currently using ES6 in an React app via webpack/babel. I am using index files to gather all components of a module and export them. Unfortunately, that looks like this: import Comp1_ from './Comp1.jsx'; import Comp2_ from './Comp2.jsx'; import…
MoeSattler
  • 6,684
  • 6
  • 24
  • 44
268
votes
10 answers

Correct way to import lodash

I had a pull request feedback below, just wondering which way is the correct way to import lodash? You'd better do import has from 'lodash/has'.. For the earlier version of lodash (v3) which by itself is pretty heavy, we should only import a…
Bill
  • 17,872
  • 19
  • 83
  • 131
242
votes
19 answers

Unable to access React instance (this) inside event handler

I am writing a simple component in ES6 (with BabelJS), and functions this.setState is not working. Typical errors include something like Cannot read property 'setState' of undefined or this.setState is not a function Do you know why? Here is…
user3696212
  • 3,381
  • 5
  • 18
  • 31
233
votes
11 answers

Null-safe property access (and conditional assignment) in ES6/2015

Is there a null-safe property access (null propagation / existence) operator in ES6 (ES2015/JavaScript.next/Harmony) like ?. in CoffeeScript for example? Or is it planned for ES7? var aThing = getSomething() ... aThing = possiblyNull?.thing This…
P Varga
  • 19,174
  • 12
  • 70
  • 108
220
votes
11 answers

What does "The code generator has deoptimised the styling of [some file] as it exceeds the max of "100KB"" mean?

I added a new npm package to my project and require it in one of my modules. Now I get this message from webpack, build modulesNote: The code generator has deoptimised the styling of "D:/path/to/project/node_modules/ramda/dist/ramda.js" as it…
Johan Alkstål
  • 5,225
  • 9
  • 36
  • 48
217
votes
7 answers

Export multiple classes in ES6 modules

I'm trying to create a module that exports multiple ES6 classes. Let's say I have the following directory structure: my/ └── module/ ├── Foo.js ├── Bar.js └── index.js Foo.js and Bar.js each export a default ES6 class: // Foo.js export…
vimfluencer
  • 3,106
  • 3
  • 17
  • 25
205
votes
4 answers

Babel 6 changes how it exports default

Before, babel would add the line module.exports = exports["default"]. It no longer does this. What this means is before I could do: var foo = require('./foo'); // use foo Now I have to do this: var foo = require('./foo').default; // use foo Not a…
kentcdodds
  • 27,113
  • 32
  • 108
  • 187
198
votes
13 answers

"unexpected token import" in Nodejs5 and babel?

In js file, i used import to instead of require import co from 'co'; And tried to run it directly by nodejs since it said import is 'shipping features' and support without any runtime flag (https://nodejs.org/en/docs/es6/), but i got an…
johugz
  • 2,023
  • 2
  • 13
  • 9
1
2 3
99 100