Instructions unclear, got precompile is not a function.

[NullVoxPopuli]

babel config

```js import { createRequire } from 'module'; const require = createRequire(import.meta.url); const resolve = require.resolve; export default { plugins: [ [ resolve('@babel/plugin-transform-typescript'), { allowDeclareFields: true, onlyRemoveTypeImports: true, // Default enums are IIFEs optimizeConstEnums: true, }, ], [ resolve('@babel/plugin-proposal-class-properties'), { // Only support browsers that also support class properties... // If all addons do this, it greatly reduces shipped JS loose: true, }, ], [resolve('babel-plugin-ember-template-compilation'), { enableLegacyModules: [ 'ember-cli-htmlbars', ] }], resolve('@embroider/addon-dev/template-colocation-plugin'), ], }; ```

rollup config

```js import path from 'path'; import { nodeResolve } from '@rollup/plugin-node-resolve'; import { babel } from '@rollup/plugin-babel'; import { Addon } from '@embroider/addon-dev/rollup'; const addon = new Addon({ srcDir: 'src', destDir: 'dist', }); const extensions = ['.js', '.ts']; const rollupConfig = { input: [path.join('src', 'index.ts'), path.join('src', 'registration.ts')], // This provides defaults that work well alongside `publicEntrypoints` below. // You can augment this if you need to. output: { ...addon.output(), entryFileNames: '[name].js' }, plugins: [ // this is needed so we can have files that import other files... nodeResolve({ resolveOnly: ['./'], extensions }), // These are the modules that users should be able to import from your // addon. Anything not listed here may get optimized away. addon.publicEntrypoints(['index.js', 'registration.js']), // These are the modules that should get reexported into the traditional // "app" tree. Things in here should also be in publicEntrypoints above, but // not everything in publicEntrypoints necessarily needs to go here. // addon.appReexports(['components/**/*.js', 'services/**/*.js']), // This babel config should *not* apply presets or compile away ES modules. // It exists only to provide development niceties for you, like automatic // template colocation. // See `babel.config.json` for the actual Babel configuration! babel({ babelHelpers: 'bundled', extensions }), // Follow the V2 Addon rules about dependencies. Your code can import from // `dependencies` and `peerDependencies` as well as standard Ember-provided // package names. addon.dependencies(), // Ensure that standalone .hbs files are properly integrated as Javascript. addon.hbs(), // addons are allowed to contain imports of .css files, which we want rollup // to leave alone and keep in the published output. // addon.keepAssets(['**/*.css']), // Remove leftover build artifacts when starting a new build. addon.clean(), ], }; export default rollupConfig; ```

Error:

[build:js] [!] (plugin babel) TypeError: /✂️/ember-statechart-component/ember-statechart-component/src/registration.ts: precompile is not a function
[build:js] src/registration.ts
[build:js] TypeError: /✂️/ember-statechart-component/ember-statechart-component/src/registration.ts: precompile is not a function
[build:js]     at insertCompiledTemplate (/✂️/ember-statechart-component/node_modules/babel-plugin-ember-template-compilation/src/plugin.ts:107:34)
[build:js]     at PluginPass.TaggedTemplateExpression (/✂️/ember-statechart-component/node_modules/babel-plugin-ember-template-compilation/src/plugin.ts:177:11)
[build:js]     at newFn (/✂️/ember-statechart-component/node_modules/@babel/traverse/lib/visitors.js:177:21)
[build:js]     at NodePath._call (/✂️/ember-statechart-component/node_modules/@babel/traverse/lib/path/context.js:53:20)

Code that was trying to be transpiled:

import { setComponentManager, setComponentTemplate } from '@ember/component';
import { hbs } from 'ember-cli-htmlbars';
// ...
setComponentTemplate(hbs`{{yield this.state this.send}}`, StateNode.prototype);

All options properties in the README say "optional" (?:)

[NullVoxPopuli]

This is my fix (and my tests pass!)

• install @glimmer/compiler

• change babel config to have:

  import { precompile } from '@glimmer/compiler';
  
  //  ...
  
  [resolve('babel-plugin-ember-template-compilation'), {
    precompile,
    enableLegacyModules: [
      'ember-cli-htmlbars',
    ],
  }],
  

matches what's in dist of my addon:

[ef4]

This issue is out of date with the current API, closing as not relevant anymore.