Private methods do not compile

[argomez]

Description

Would like to use private class methods, including get/set methods. However this fails to compile.

Steps to Reproduce

https://stackblitz.com/edit/salesforce-lwc-hzkzus?file=src%2Fmodules%2Fx%2Fcounter%2Fcounter.js

import { LightningElement, api } from 'lwc';

export default class extends LightningElement {
    @api label;

    counter = 0;

    #increment() {
        this.counter++;
    }
    decrement() {
        this.counter--;
    }
}

Expected Results

Component compiles and renders as expected, with the increment function on the x-counter component being private.

Actual Results

rollup v4.28.0
bundles src/main.js → dist/main.js...
[!] (plugin rollup-plugin-lwc-compiler) Error: SyntaxError: LWC1007: /home/projects/salesforce-lwc-uug6np/src/modules/x/counter/counter.js: Class private methods are not enabled. Please add `@babel/plugin-transform-private-methods` to your configuration.

Browsers Affected

Brave latest
v1.73.97 (Dec 4, 2024)

Version

-"lwc": "8.11.0",

Possible Solution

I assume this plugin needs to be added here but not sure
https://github.com/salesforce/lwc/blob/master/packages/%40lwc/compiler/src/transformers/javascript.ts

Additional context/Screenshots
Add any other context about the problem here. If applicable, add screenshots to help explain.

[nolanlawson]

I debugged this (743290b). The issue is our usage of @babel/plugin-transform-class-properties. If I remove this Babel plugin, the error goes away (although I see other errors).

Currently, removing this plugin is blocked because it is an observable (breaking) change: #3537