nuxt / module-builder

Complete solution to build and ship Nuxt modules.
MIT License
224 stars 24 forks source link

JSX support #177

Closed not-Ryan closed 5 months ago

not-Ryan commented 11 months ago

Is there any way to support JSX in module files?

I've tried changing the esbuild options in unbuild:

// build.confg.ts
import { defineBuildConfig } from 'unbuild'

export default defineBuildConfig({
  rollup: {
    esbuild: {
      jsx: 'preserve',
      // or jsxFactory: 'h',
    },
  }
})

But it seems to ignore those options.

I still get React.createElement as output.

If I run mkdist --jsx=preserve I do get the runtime output with jsx preserved.

not-Ryan commented 11 months ago

For now I fixed this in a major round about way:

// build.config.ts
import { defineBuildConfig } from 'unbuild'

export default defineBuildConfig({
  hooks: {
    'build:before'(ctx) {
      const entry: any = ctx.options.entries.find(e => e.input.endsWith('src/runtime'))
      if (!entry) {
        throw new Error('No entry found for src/runtime')
      }

      entry.esbuild ??= {}
      entry.esbuild.jsx = 'transform'
      entry.esbuild.jsxFactory = 'h'
    },
  },
})

However, I do feel like there is a better way of doing this....