# How to make SolidJS application work from a subfolder

In this article, I'll show how to make [SolidJS](https://www.solidjs.com/) application work from a subdirectory - for example, deployed on GitHub pages.

# Code
First, let's generate code following [the documentation](https://www.solidjs.com/guide):

```sh
$ npx degit solidjs/templates/js solid-subfolder
npx: installed 1 in 0.785s
> cloned solidjs/templates#HEAD to solid-subfolder
```

# The problem
After installing with `npm install` & build with `npm run build`, your output will fail if you access it from a subdirectory. So, in my case, I try to access it on `http://localhost/github/solid-subfolder/dist/`, and I get:
![solid-subfolder-fail.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1628412352257/TWmhUr_-9.png)

As you can see, by default, `index.html` tries to load assets from the domain root - for example, it tries loading `http://localhost/assets/index.1b7ca044.js`.

# The fix
Vite controls the base imports on the HTML side. As it's shown in [the documentation](https://vitejs.dev/config/#base) the default value is `/`. We can change it in `vite.config.js`:
```js
 export default defineConfig({
   plugins: [solidPlugin()],
+  base: "./",
   build: {
     target: "esnext",
     polyfillDynamicImport: false,
```

With this change in place, the application works as expected:
![working-app.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1628413277799/xik7jF3cV.png)

# Links
Here you can find the [repo](https://github.com/marcin-wosinek/solid-subfolder) & the [working app](https://marcin-wosinek.github.io/solid-subfolder/dist)

# Summary
In this article, we have seen how to make the SolidJS app work when deployed to a subfolder.