Add support for components using private methods

[chadhietala]

@babel/plugin-proposal-private-methods requires seeing
@babel/plugin-proposal-class-properties being set before it can run. In
Babel plugins run before presets. Because of this, these 2 plugins must
exist in the preset.

[rwjblue]

Do we actually use private methods? Do we have to?

[chadhietala]

I'm trying to migrate to this and was supporting private methods. The issue is that babel plugins run before presets and the private method plugin depends on the class properties plugin.

Now it would be "fine" to have these as both plugins but the issue is that when the preset runs the fields have already been transformed and thus presets can't find static template = to transforming it. For example this is the current output if you both set as plugins:

Input:

  import { Hello } from "../Hello.js";
  import Component, { hbs } from '@glimmerx/component';
  export default class MyPage extends Component {
    static template = hbs\`
      <Hello />
    \`
  }

Current Output:

class MyPage extends _glimmerx_component__WEBPACK_IMPORTED_MODULE_2__.default {}
MyPage.template = (0,_glimmer_core__WEBPACK_IMPORTED_MODULE_0__.setComponentTemplate)((0,_glimmer_core__WEBPACK_IMPORTED_MODULE_0__.createTemplateFactory)(
/*
          <Hello />
*/
{
  "id": "Ng5WBitS",
  "block": "[[[1,\"\\n          \"],[8,[32,0],null,null,null],[1,\"\\n        \"]],[],false,[]]",
  "moduleName": "(unknown template module)",
  "scope": () => [_var_folders_0_6vsqqq293r1_rddztq1585xc0008c7_T_broccoli_97650kjsjBvbcT6M6_out_2_broccoli_persistent_filter_babel__WEBPACK_IMPORTED_MODULE_1__.Hello],
  "isStrictMode": true
}), (0,_glimmer_core__WEBPACK_IMPORTED_MODULE_0__.templateOnlyComponent)("MyPage", "_MyPage"));

You could do a thing where you have plugins that re-transform transformed code but that seems like a slippery slope.

[rwjblue]

Chatted with @chadhietala and @pzuraq, and I think the path forward here is to remove { loose: true } (and use strict mode) and then we can land/release.