Webpack babel 6 ES6 decorators

by

This Babel plugin worked for me:

https://github.com/loganfsmyth/babel-plugin-transform-decorators-legacy

npm i --save-dev babel-plugin-transform-decorators-legacy

.babelrc

{
  "presets": ["es2015", "stage-0", "react"],
  "plugins": [
    ["transform-decorators-legacy"],
    // ...
  ]
}

or

Webpack

{
  test: /\.jsx?$/,
  loader: 'babel',
  query: {
    cacheDirectory: true,
    plugins: ['transform-decorators-legacy' ],
    presets: ['es2015', 'stage-0', 'react']
  }
}

React Native

With react-native you must use the babel-preset-react-native-stage-0 plugin instead.

npm i --save babel-preset-react-native-stage-0

.babelrc

{
  "presets": ["react-native-stage-0/decorator-support"]
}

Please see this question and answer for a complete explanation.

More Related Contents:

  1. Getting Unexpected Token Export
  2. ES6 exporting/importing in index file
  3. Javascript object bracket notation ({ Navigation } =) on left side of assign
  4. Unable to access React instance (this) inside event handler [duplicate]
  5. Using Node.js require vs. ES6 import/export
  6. Why does babel rewrite imported function call to (0, fn)(…)?
  7. Call async/await functions in parallel
  8. “You may need an appropriate loader to handle this file type” with Webpack and Babel
  9. Extending built-in natives in ES6 with Babel
  10. Can’t require() default export value in Babel 6.x
  11. Browserify, Babel 6, Gulp – Unexpected token on spread operator
  12. Why doesn’t instanceof work on instances of Error subclasses under babel-node?
  13. SyntaxError: ‘import’ and ‘export’ may appear only with ‘sourceType: module’ – Gulp
  14. where is create-react-app webpack config and files?
  15. Extending Error in Javascript with ES6 syntax & Babel
  16. Unable to use Arrow functions inside React component class [duplicate]
  17. How to publish a module written in ES6 to NPM?
  18. ES6 `export * from import`?
  19. Error: Missing class properties transform
  20. Clean way to keep original variable and destructure at the same time
  21. JavaScript object destructuring and aliasing
  22. In the `import` syntax of ES6, how is a module evaluated exactly?
  23. Difference between import X and import * as X in node.js (ES6 / Babel)?
  24. Babel 7 – ReferenceError: regeneratorRuntime is not defined
  25. “unexpected token import” in Nodejs5 and babel?
  26. require(‘babel/register’) doesn’t work
  27. Import ES module in Next.js ERR_REQUIRE_ESM
  28. Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: Cannot find module ‘babel-preset-react’
  29. How to setup TypeScript + Babel + Webpack?
  30. How to correctly use ES6 “export default” with CommonJS “require”?

Leave a Comment