Parcel build JS file error - @parcel/transformer-js: Expected ',', got 'class'

[mariodever]

🐛 bug report

🎛 Configuration (.babelrc, package.json, cli command)

• .babelrc file:

  
  {
  "presets": [],
  "plugins": [
      ["@babel/plugin-transform-react-jsx", {
          "pragma": "m",
          "pragmaFrag": "'['"
      }]
  ]
  }

- Build command:

./node_modules/.bin/parcel build --no-source-maps --dist-dir static/ --cache-dir ./spiritualblossom --public-url /static/ static_src/js/new-applicants/psychic/survey.js --no-cache

- Package version (`package.json` file)

{ "devDependencies": { "@babel/core": "^7.25.2", "@babel/preset-env": "^7.25.4", "@parcel/transformer-less": "^2.12.0", "buffer": "^6.0.3", "parcel": "^2.12.0", "process": "^0.11.10", "typescript": "^5.6.3" }, }

## 🤔 Expected Behavior

<!--- Tell us what should happen -->

It should build a js file.

## 😯 Current Behavior

<!--- Tell us what happens instead of the expected behavior -->

Instead of building js file, it gives me an error message.

<!--- If you are seeing an error, please include the full error message and stack trace -->

@parcel/transformer-js: Expected ',', got 'class'

## 💁 Possible Solution

<!--- Not obligatory, but suggest a fix/reason for the bug -->

## 🔦 Context

<!--- How has this issue affected you? What are you trying to accomplish? -->

I am trying to build JS files for production environment.

<!--- Providing context helps us come up with a solution that is most useful in the real world -->

## 💻 Code Sample

<!-- Please provide a code repository, gist, code snippet or sample files to reproduce the issue -->

import m from "mithril";

import { SurveyForm } from "./components/form"; import { StepInfo } from "./components/preview"; import { State, Actions } from "./model";

const SurveyView = (state, actions) => (

Survey

{!["completed", "pending-approval"].includes(state.statusId) && (

)} {state.statusId === "completed" ? (

{gettext( "One of our interviewers will contact you soon to schedule a video interview. Please check your emails and follow the instructions." )}

) : null}

);

export const Survey = (stepId) => { const state = State(stepId); const actions = Actions(state);

return { oninit: () => actions.fetchData(), view: () => (state.statusId === undefined ? null : SurveyView(state, actions)), }; };

## 🌍 Your Environment

<!--- Include as many relevant details about the environment you experienced the bug in -->

| Software         | Version(s) |
| ---------------- | ---------- |
| Parcel           | 2.12.0 |
| Node             | 18.17.1 |
| npm/Yarn         | npm@9.6.7 |
| Operating System | macOS Sequoia 15.0.1 |

<!-- Love parcel? Please consider supporting our collective:
👉  https://opencollective.com/parcel/donate -->

[mariodever]

I solved the problem by installing react as dev dependency. I don't know why.