[Bug?]: Router "base" property is flaky

[birkskyum]

UPDATE (moving focus from base prop in vite.config to base prop on Router): For repro instructions, see #1158 (comment)

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Current behavior 😯

Currently the /_build is the default base path:

solid-start/packages/start/config/index.js

Line 156 in cfe17fa

base: "/_build"

Expected behavior 🤔

I expected either / or '' to be the default base path unless set otherwise. If i set it to these values, my routes return nothing.

Steps to reproduce 🕹

• npm create solid.
• choose bare template

set the vite config to:

export default defineConfig({
  base: "/test/"
});

• launch the dev server and go to `http://localhost:3000/test/
• result is that page isn't found, and that it's still only on http://localhost:3000

Context 🔦

I'm making a SSG docs site, on a subpath like this example.com/subpath/routes and thus need to set the base to /subpath/

this is to some extend a remake of the now obsolete

• Setting Vite BASE_URL creates paths containing "//" i.e. "/base-url//page1" #831 (comment)

Your environment 🌎

@solidjs/start 0.4
@solidjs/router 0.10
macos - arm64
chrome 120

[ryansolid]

@nksaraf was there a reason for this?

[nksaraf]

The internal routers have their own base paths. /_build is similar to /_next. This base issue is a bug and the solution is two-step:

1. solid-start should wire the base config to vinxi's server.baseURL config which is passed to nitro.
2. Vinxi should make sure that the baseURL is applied correctly during development, it probably already works fine in production.

[birkskyum]

Interesting. I stumbled upon /_build in dev mode when I used import.meta.env.BASE_URL in an app (where I hadn't explicitly set the base). Per Vite docs the BASE_URL is:

import.meta.env.BASE_URL: {string} the base url the app is being served from. This is determined by the base config option.

so it would seem like a bug that it's picking up the internals.

[nksaraf]

Hmm and you want it to be the BASE_URL for the whole app. Mind you that the client assets are served on the /_build path regardless. We could switch the import.meta.env.BASE_URL to be app's base URL instead of the internal client router's base.

[birkskyum]

Yes, I'd like it to be the BASE_URL for the whole app. It's so I can make a static build of the site, and put this docs site on a github pages which isn't the root domain (https://maplibre.org/maplibre-style-spec/). The workaround I've been using with the old start was to set the base, and then append all links in the navigation with import.meta.env.BASE_URL.

I had to give up on the client-routing "A", and use "a" instead and make my own active link check etc, because I couldn't get the client-routing to include the BASE_URL. Probably there is a more elegant way to do this, where i.e. client routing would be aware of this url "offset" and append the import.meta.env.BASE_URL automatically like i.e. -> example.com/${BASE_URL}/about

[nksaraf]

Yup I think @solidjs/router accepts a base prop that does exactly this. And accounts for it during SPA routing.

[birkskyum]

That is quite very interesting! It appear to be quite flaky though. I tried setting it in the basic template, to /offset:

    <Router
      base="/offset"
      root={(props) => (
        <MetaProvider>
          <Title>SolidStart - Basic</Title>
          <A href="/">Index</A>
          <A href="/about">About</A>
          <Suspense>{props.children}</Suspense>
        </MetaProvider>
      )}
    >

and then when i click the link to the /about page it does direct to /offset/about which is great, but I get a "Page not Found", and when I refresh on /offset/about it can find that page. ( note: I applied #1170 )

[nksaraf]

@ryansolid is this an issue for @solidjs/router

[birkskyum]

@nksaraf okay, i made an issue in there instead:

• "base" property is flaky solid-router#334