Vite app with Solid and React files simultaneously
I'm using a Laravel app in which i have several Solid components that I used in my traditional server side templates. I use Vite for bundling and transpiling these components with
vite-plugin-solid and it worked fine until i added React and its Vite plugin (@vitejs/plugin-react) as I also plan to use React as my main "templating engine" with some Solid components sprinkled (e.g. with https://github.com/Sawtaytoes/reactjs-solidjs-bridge package).
My guess is that Vite gets confused and either uses Solid to compile React's JSX or vice versa.
Is there a way i can tell Vite some files use Solid's flavor of JSX and the rest use React's? Just like I'm telling TypeScript I'm using Solid's JSX in Solid component files by using @jsxImportSource pragma.GitHub
GitHub - Sawtaytoes/reactjs-solidjs-bridge: Render Solid.js compone...
Render Solid.js components in React.js and visa versa. - GitHub - Sawtaytoes/reactjs-solidjs-bridge: Render Solid.js components in React.js and visa versa.
2 Replies
I tried using the
babel.only/babel.ignore options in vite-plugin-solid config, but it appears to me that the plugin itself still processes ignored files, just doesn't transform the JSX in them and in turn that results in build errors, of course.
Do I have to wait for that PR https://github.com/solidjs/vite-plugin-solid/pull/94 to release?GitHub
feat: determine which modules to operate on by include or exclude o...
Use include or exclude options to determine whether or not certain modules should be operated upon. This can make it work better with other frameworks. Plugins like vue, react, svelte also support...
Oh, it's already released, I just had an old version installed... 🤦♂️