S
SolidJS•2mo ago
Odama626

changing base Path

in vite it is just base, but it looks like the vinxi config omits that, and after doing some digging I found this comment where Ryan mentioned that he was going to leave it up to Nikhil https://github.com/solidjs/solid-start/discussions/1279#discussioncomment-8239480 after some more digging it looks like vinxi exposes a base property https://vinxi.vercel.app/api/router/client.html#base ....and after some more digging, https://github.com/solidjs/solid-start/blob/6f737ecc0f7e38febf829916e4e42455c75a53ee/packages/start/config/index.js#L113 it looks like that is not exposed. is there another canonically solidstart way of setting this? or do I need to use something else in the meantime?
Client Router API | Vinxi
Vinxi Documentation
GitHub
One Month of SolidStart Beta 2 · solidjs solid-start · Discussion...
It was almost a year ago I wrote one month into our first SolidStart beta and I can already see the differences this time around. That being said we are still working through bugs and there are thi...
GitHub
solid-start/packages/start/config/index.js at 6f737ecc0f7e38febf829...
SolidStart, the Solid app framework. Contribute to solidjs/solid-start development by creating an account on GitHub.
2 Replies
Madaxen86
Madaxen86•2mo ago
You need to add this in 2x places: 1. app.config.ts --> 
{
 server:{
  baseURL:"/foo"
 }
}
{
 server:{
  baseURL:"/foo"
 }
}
2. app.tsx 
<Router
      base="/foo"
<Router
      base="/foo"
Odama626
Odama626OP•2mo ago
ok, so I am not using a router, but settings the server: { baseURL: './' } seems to get some things to work, but asset URLs are still wrong it seems like imports get copied into assets, but the urls still have the base of / well, I got a little further, this works with build, but when I run dev hydration fails 
import { defineConfig } from '@solidjs/start/config';
import topLevelAwait from 'vite-plugin-top-level-await';
import wasm from 'vite-plugin-wasm';

export default defineConfig({
  ssr: false,
  server: {
    static: true,
    baseURL: './',
  },
  vite({ router, ...rest }) {
    console.log({ router, rest });
    return {
      base: router === 'client' ? './' : undefined,
      plugins: [wasm(), topLevelAwait()],
    };
  },
});
import { defineConfig } from '@solidjs/start/config';
import topLevelAwait from 'vite-plugin-top-level-await';
import wasm from 'vite-plugin-wasm';

export default defineConfig({
  ssr: false,
  server: {
    static: true,
    baseURL: './',
  },
  vite({ router, ...rest }) {
    console.log({ router, rest });
    return {
      base: router === 'client' ? './' : undefined,
      plugins: [wasm(), topLevelAwait()],
    };
  },
});
I got it working, I just had to provide 2 different configs.. 1 for dev and 1 for prod dev 
import { defineConfig } from '@solidjs/start/config';
import topLevelAwait from 'vite-plugin-top-level-await';
import wasm from 'vite-plugin-wasm';

export default defineConfig({
  ssr: false,
  server: {
    static: true,
  },
  vite: {
    plugins: [wasm(), topLevelAwait()],
  },
});
import { defineConfig } from '@solidjs/start/config';
import topLevelAwait from 'vite-plugin-top-level-await';
import wasm from 'vite-plugin-wasm';

export default defineConfig({
  ssr: false,
  server: {
    static: true,
  },
  vite: {
    plugins: [wasm(), topLevelAwait()],
  },
});
prod 
import { defineConfig } from '@solidjs/start/config';
import topLevelAwait from 'vite-plugin-top-level-await';
import wasm from 'vite-plugin-wasm';

export default defineConfig({
  ssr: false,
  server: {
    static: true,
    baseURL: './',
  },
  vite({ router }) {
    return {
      base: router === 'client' ? './' : undefined,
      plugins: [wasm(), topLevelAwait()],
    };
  },
});
import { defineConfig } from '@solidjs/start/config';
import topLevelAwait from 'vite-plugin-top-level-await';
import wasm from 'vite-plugin-wasm';

export default defineConfig({
  ssr: false,
  server: {
    static: true,
    baseURL: './',
  },
  vite({ router }) {
    return {
      base: router === 'client' ? './' : undefined,
      plugins: [wasm(), topLevelAwait()],
    };
  },
});
that still didn't account for some of the internal imports in node_modules, so I just had to copy some assets to the public folder as well

Did you find this page helpful?