question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

stage-0 Babel plugin not applying class properties transform

See original GitHub issue

🐛 Bug Report

My class properties have stopped working after updating a small React app to Parcel 1.6.1. I was using babel-preset-stage-0, which worked fine before updating Parcel. Switching to use babel-plugin-transform-class-properties fixes the problem, but the stage-0 preset should include this.

(I also tried the stage-2 preset, but that doesn’t work either. Only specifically installing the transform plugin gets the app to build)

🎛 Configuration

.babelrc

{
  "presets": ["stage-0"]
}

package.json

{
  "name": "parcel-babel-error",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "parcel index.html"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-preset-stage-0": "^6.24.1",
    "parcel-bundler": "^1.6.1"
  },
  "dependencies": {
    "react": "^16.2.0",
    "react-dom": "^16.2.0"
  }
}

CLI command

npm start

🤔 Expected Behavior

Class properties should be transpiled by babel-preset-stage-0 and the app should build

😯 Current Behavior

A build error:

🚨  /Users/oliverjam/Web/parcel-babel-error/index.js:5:4: /Users/oliverjam/  3 | rcel-babel-error/index.js: Missing class properties transform.
  4 | class App extends React.Component {
> 5 |     state = {}
    |     ^
  6 |     render() {
  7 |         return <h1>Hello</h1>
  8 |     }

🔦 Context

I’m trying to use class properties via the stage-0 Babel preset, which should encompass all features in the stages above (class properties are in the stage-2 preset).

💻 Code Sample

Should be fully reproducible here: https://github.com/oliverjam/parcel-babel-error-repro

🌍 Your Environment

Software Version(s)
Parcel 1.6.1
Node 8.9.4
npm/Yarn npm 5.6.0
Operating System macOS 10.13.3

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Reactions:11
  • Comments:15 (1 by maintainers)

github_iconTop GitHub Comments

9reactions
CesarLanderoscommented, Jul 13, 2018

still happening in 1.9.6

8reactions
dackers86commented, Feb 16, 2018

I’ve had to install manually, new .babelrc is now…

{ “presets”: [“preact-app”], “plugins”: [“transform-class-properties”] }

Read more comments on GitHub >

github_iconTop Results From Across the Web

Error: Missing class properties transform - Stack Overflow
The fix in my case was defining 'transform-class-properties' plugin in the options attribute of my webpack.config.js, i'm using babel V6
Read more >
Plugins - Babel.js
These plugins apply transformations to your code. Transform plugins will enable the corresponding syntax plugin so you don't have to specify both. Syntax ......
Read more >
Migrating from Babel - SWC
babel -plugin-proposal-class-properties, ✔️. babel-plugin-proposal- ... babel-plugin-transform-object-set-prototype-of-to-assign, ❌.
Read more >
storybook missing class properties transform. - You.com
Storybook 6.2.0-beta.13 not transforming class properties #14197 - GitHub ... However, it looks like @babel/plugin-proposal-class-properties is still ...
Read more >
升级到 Babel 7 · Babel 中文网
Can check the stage-0 README for more migration steps. ... @babel/plugin-proposal-function-bind (Stage 0); @babel/plugin-transform-class-properties is now ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found