Parcel: stage-0 Babel plugin not applying class properties transform

[oliverjam]

🐛 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

[simplyjane]

got the same issue. I have installed babel-preset-stage-1

[dackers86]

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

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

[Offirmo]

Same problem, stage-0

[edit] (ping @CesarLanderos) My problem was happening in a sub module (monorepo linked through node_modules)
The solution was to add a .babelrc in the submodule root.

[CesarLanderos]

still happening in 1.9.6

[CesarLanderos]

to give a little bit of context, i am working on a tool, the tests on that tool repo are working fine (not compiling files/modules with classes tho)

so when i try to integrate that tool into a webapp repo (which does have classes on its codebase, because of react), i get that error.

it gets fixed by adding the class properties plugin to babel, but that is already specified in stage-0 AFAIK, so its weird that i have to set that in the .babelrc file.

PD: the webapp build process uses another build tool (webpack, it just happens to be already configure with that, not complaining or anything) that grabs the same .babelrc as parcel (without adding the class properties plugin) and it works just fine.

[lcx-seima]

update: still happening in 1.9.7 😅

[qm3ster]

Also, I get Unknown plugin "transform-class-properties" specified in "base" at 0 if installing with pnpm

[GioLogist]

Can confirm this issue is still present in 1.9.7. Not a problem on 1.5.1

[alanyinjs]

update: still happening in 1.10.3

[nephix]

Still happening in 1.11.0

[mxrguspxrt]

Hope you doing well! Having the same issue.

[samhenri]

I'm having the same issue. Already added in babelrc and packages

[tlrobinson]

This is probably related to https://github.com/babel/babel/issues/6604

[tlrobinson]

I got this working with the following package.json:

{
  "name": "react-app-parcel",
  "dependencies": {
    "react": "^16.8.6",
    "react-dom": "^16.8.6"
  },
  "devDependencies": {
    "@babel/core": "^7.4.3",
    "@babel/plugin-proposal-class-properties": "^7.4.0",
    "@babel/preset-env": "^7.4.3",
    "babel-preset-react-app": "7",
    "parcel-bundler": "^1.12.3"
  },
  "scripts": {
    "start": "parcel index.html"
  },
  "babel": {
    "presets": [
      ["@babel/preset-env", { "useBuiltIns": "entry" }],
      ["babel-preset-react-app", { "absoluteRuntime": false }]
    ],
    "plugins": [
      "@babel/proposal-class-properties"
    ]
  }
}