SolidJS•13mo ago

How do we configure babel proposal decorators with Solid's vite plugin?

I've got this Stackblitz: https://stackblitz.com/edit/solidjs-templates-wyjc1i?file=index.html,src%2Findex.tsx,vite.config.ts,package.json No luck configuring decorators like so:

export default defineConfig({
  plugins: [
    solidPlugin({
      babel: {
        plugins: ['@babel/plugin-proposal-decorators', { version: '2023-05' }],
      },
    }),
  ],

export default defineConfig({
  plugins: [
    solidPlugin({
      babel: {
        plugins: ['@babel/plugin-proposal-decorators', { version: '2023-05' }],
      },
    }),
  ],

Stackblitz terminal shows this error:

[BABEL] /home/projects/solidjs-templates-wyjc1i/src/index.tsx: The decorators plugin, when .version is '2018-09' or not specified, requires a 'decoratorsBeforeExport' option, whose value must be a boolean. (While processing: "/home/projects/solidjs-templates-wyjc1i/node_modules/.pnpm/@[email protected]_@[email protected]/node_modules/@babel/plugin-proposal-decorators/lib/index.js$inherits")

[BABEL] /home/projects/solidjs-templates-wyjc1i/src/index.tsx: The decorators plugin, when .version is '2018-09' or not specified, requires a 'decoratorsBeforeExport' option, whose value must be a boolean. (While processing: "/home/projects/solidjs-templates-wyjc1i/node_modules/.pnpm/@[email protected]_@[email protected]/node_modules/@babel/plugin-proposal-decorators/lib/index.js$inherits")

Ask me why I have tooling fatigue. 🙃 Buildless for the win.

StackBlitz

Solidjs - Templates (forked) - StackBlitz

Vite + solid templates

5 Replies

Joe PeaOP•13mo ago

Ah, I was missing brakcets, that's all. This,

        plugins: ['@babel/plugin-proposal-decorators', { version: '2023-05' }],

        plugins: ['@babel/plugin-proposal-decorators', { version: '2023-05' }],

needs to be

        plugins: [['@babel/plugin-proposal-decorators', { version: '2023-05' }]],

        plugins: [['@babel/plugin-proposal-decorators', { version: '2023-05' }]],

lxsmnsyc•13mo ago

take note that at some point we will be removing babel plugins, since we are delegating the remaining transforms to esbuild. No worries though, esbuild supports decorators

Joe PeaOP•13mo ago

Esbuild does not support "standard decorators" yet, only old TypeScript legacy (experimental) decorators, if I read this correctly: https://github.com/evanw/esbuild/issues/104

GitHub

Feature request: Decorators support · Issue #104 · evanw/esbuild

error: Decorators are not supported yet Any plan to support decorators?

Joe PeaOP•13mo ago

As long as we can still plug in Babel while esbuild doesn't have new decorators, then it'll be ok. But hopefully esbuild will have it soon! @lxsmnsyc 🤖 are Babel plugins being dropped in general? Or just in Vite? I currently use Babel on its own for compiling JSX

lxsmnsyc•13mo ago

Vite. We can't drop it in general. and we are not dropping Babel in Vite, we are. dropping the process of compiling TS with Babel

Gaming

Programming

How do we configure babel proposal decorators with Solid's vite plugin?