SolidJS•2mo ago

Dependency configuration in Astro

I'm trying to add solid-bootstrap as a dependency in an Astro + Solid project. This results in the solid export flag being turned on, so solid-bootstrap exports dist/esm/index.jsx by default. Then I get the error Could not import ./Accordion, I guess because .jsx isn't getting resolved as a default extension. I feel like this is probably standard... Is there some Vite configuration I should add? I tried

vite: {
    optimizeDeps: {include: 'solid-bootstrap'},
    ssr: {noExternal: ['solid-bootstrap']},
  },

vite: {
    optimizeDeps: {include: 'solid-bootstrap'},
    ssr: {noExternal: ['solid-bootstrap']},
  },

(and also optimizeDeps.exclude) but didn't see any difference. Alternatively, is solid-bootstrap doing something wrong? I thought it worked with SSR... But maybe not Astro?

11 Replies

Birk Skyum•2mo ago

what solid flag are we talking about?

Erik Demaine•2mo ago

The one that impacts package.json exports. Sorry, I always forget their proper name in Node.

Birk Skyum•2mo ago

Can you do SSR with solid start + solid-bootstrap?

Erik Demaine•2mo ago

I believe so, given past GH issues on solid-bootstrap I seem to have isolated my problem to a different Vite extension (that I cowrote), for Civet 😦 https://stackblitz.com/edit/github-9xb3p3-rvdeyn?file=package.json works, but if I add the Civet extension, I get the same error

Birk Skyum•2mo ago

https://stackblitz.com/edit/github-ftzkhd?file=src%2Fentry-server.tsx

Birk Skyum

StackBlitz

Solid-start Bare Example - StackBlitz

Run official live example code for Solid-start Bare, created by Solidjs on StackBlitz

Erik Demaine•2mo ago

So I guess that the Civet extension is somehow messing things up... though it shouldn't be doing anything with .jsx files

Birk Skyum•2mo ago

That is SSR of solid-bootstrap with Solid Start So what we know is that solid-bootstrap is alright with ssr. I don't know the astro-solid integration or civet config that well, but it's one of those.

Erik Demaine•2mo ago

Here's a fork of your StackBlitz that shows the problem: https://stackblitz.com/edit/github-ftzkhd-zaqeky?file=app.config.ts so not Astro specific, must be Civet which at least I control... but not sure what's broken Source is here in case you're willing to look at it

Birk Skyum•2mo ago

I won't have time to debug it rn, but it's in civit for sure. weird that it finds the index.jsx, but not the .jsx files imported from there If I manually add the .jsx extensions to the imports like below, then civit can suddenly find the files, so it's related to that

// @refresh skip
export { StartServer } from "./StartServer.jsx";
export { createHandler } from "./handler.jsx";
export { getServerFunctionMeta } from "./serverFunction.jsx";

// @refresh skip
export { StartServer } from "./StartServer.jsx";
export { createHandler } from "./handler.jsx";
export { getServerFunctionMeta } from "./serverFunction.jsx";

Erik Demaine•2mo ago

Curious. I've tried commenting almost all of the Civet extension (e.g. just always returning null from resolveId) and it still doesn't work. ah, I isolated it to these lines not sure why they don't work but at least I can easily skip them 🙂 Here's the fix in case anyone is curious: https://github.com/DanielXMoore/Civet/pull/1157

mdynnl•2mo ago

yeah, even though https://vitejs.dev/guide/api-plugin.html#config says, the config is deeply merged, they does

const resolveOptions = {
  ...
  extensions: config.resolve?.extensions ?? DEFAULT_EXTENSIONS,
  ...
}

const resolveOptions = {
  ...
  extensions: config.resolve?.extensions ?? DEFAULT_EXTENSIONS,
  ...
}

Gaming

Programming

Dependency configuration in Astro