Deploy Evidence to non-root path / folder

[BenJoyenConseil]

Evidence Maintainer Edit

Non-root paths are not supported, but we are keeping this issue up to date as we frequently get asked about this.

You may want to consider the following alternative options:

• deploying to a subdomain: subdomain.yourwebsite.com
• embedding Evidence inside your app: using an iframe or similar on your desired subfolder

It is possible we will support non-root paths in the future, but it is not on the near term roadmap. Below are some workarounds though they are likely to be fragile.

Feature Description

I would like to override sveltekit's base URI and others settings like outDir when I run evidence build. The documentation of sveltekit suggests to use svelte.config.js,

Goal of Feature

I would like to deploy a static evidence's build on Github Pages or something equivalent. Github Pages requires the urls to be relative or following the URI of the repository, so I need to set the sveltekig --base parameter. But it is not suffisant because the URIs in the Evidence.dev html (ex /favicon.ico) are all hard coded to point to the root "/".

Current Solution

The current source code in cli.js does not allow to override svelte.config.js, it overrides the svelte.config.js everytime we run evidence build

So my current solution is using unix's find to track all urls

mv -R ./build ./public
find ./public/* -type f -not -path '*.ico' -exec sed -i '' "s,=\"/,=\"/my_github_uri/,g" {} +

[aaronsteers]

@BenJoyenConseil - I came here looking for help on the same. My issue logged below seems to describe the same issue you describe above.

• Published Evidence site is getting 404 on subpages meltano/jaffle-shop-template#6

Are you still using the above workaround? I tried on my side but it didn't seem to work.

[mcrascal]

A few possible ways to implement this:

1. An option in settings + env vars to set the root path
2. A cli flag
3. Allow an override of the svelte.config (not preferred, similar to treatment of layout)

Finished: successful deployment on github pages

[mcrascal]

Hi all,

We took a look at supporting this, see: #764, and are not going to move ahead for the time being.

While exposing the base path configuration option is straightforward, supporting it across our entire builtin component library, and maintaining it is too much of a headache relative to the other things we'd like to be focusing on at the moment.

We'll likely revisit this, since there are use cases for this beyond just GH pages, but in the meantime netlify and vercel are both great deployment targets for public projects.

[svrooij]

And I guess you can just map your repo website to a subdomain, while still being hosted at GitHub Pages? Then it only requires you to setup a subdomain, which requires 1 additional file in the repo and some dns changes. Your pages are then hosted at the subdomain without a repo directory in front.

[jdimmerman]

For what its worth, I was able to get this working by doing the following, but it is a cat and mouse game each time we upgrade Evidence/svelte/vite so maybe not worth it.

• Turning off vite preload so that static assets aren't loaded from the wrong absolute path (I had to do this by manually modifying node_modules/@evidence-dev/evidence/template/vite.config.js during build, which is ugly, but would be straightforward if it were possible to adjust vite.config.js directly)
• override +layout.js to grab data from a data from a relative path instead of absolute

[archiewood]

@jdimmerman this is cool

Out of interest, did you have issues with breadcrumbs, table of contents, sidebar etc not knowing about the changes to the base path?

[jdimmerman]

That's a good question... We are not using any of those features or routing in general - all one page with tabs we styled to be on the left - so my comment may be entirely worthless to others

[KarimJedda]

Ben's script did not work for me on Ubuntu, this worked (on a very trivial example, this will definitely break for something more complex):

BASE_PATH="/public"

find public/ -type f \( -name "*.js" -o -name "*.html" \) -exec sed -i "s,href=\"/,href=\"$BASE_PATH/,g" {} +
find public/ -type f \( -name "*.js" -o -name "*.html" \) -exec sed -i "s,src=\"/,src=\"$BASE_PATH/,g" {} +

echo "URL replacement complete."

I hope this helps anyone. Good luck.

[BenJoyenConseil]

Ben's script did not work for me on Ubuntu, this worked (on a very trivial example, this will definitely break for something more complex):

BASE_PATH="/public"

find public/ -type f \( -name "*.js" -o -name "*.html" \) -exec sed -i "s,href=\"/,href=\"$BASE_PATH/,g" {} +
find public/ -type f \( -name "*.js" -o -name "*.html" \) -exec sed -i "s,src=\"/,src=\"$BASE_PATH/,g" {} +

echo "URL replacement complete."

I hope this helps anyone. Good luck.

It is probably because of the different implementations of the Sed tool between mac and GNU world (the -i option with empty quotes is for mac implem)

[KarimJedda]

You're absolutely correct! Although I have to say it's unfortunate we even have to use this "hack"-around 😶‍🌫️

[RoelofSpijker]

Also would be very interested in having the ability to host on non-root paths. My usecase is not GH Pages but offering Evidence-based reports within the context of a broader web app. Unfortunately that is currently not workable.
The workarounds also are not really viable as, at least in current versions, a lot of the links are generated in the HTML but then replaced in the browser by svelte. So even if you "fix" the links using sed the changes will still be reverted in many places through browser JS.

I'll be looking for alternatives, if anyone has any recommendations I'd be very interested. Really like the project otherwise, unfortunately it does not support my use-case at the moment.

[ccollie]

My current workaround for this is outlined here:

https://gist.github.com/ccollie/5e86724a11611560572529774b7faead

[archiewood]

Non-root paths are not supported, but we are keeping this issue up to date as we frequently get asked about this.

You may want to consider the following alternative options:

• deploying to a subdomain: subdomain.yourwebsite.com
• embedding Evidence inside your app: using an iframe or similar on your desired subfolder

It is possible we will support non-root paths in the future, but it is not on the near term roadmap. Below are some workarounds though they are likely to be fragile.

[archiewood]

This feature was merged in #2738 , and will be available in the next release.

https://next.docs.evidence.dev/deployment/base-paths/

You adjust the base path in evidence.config.yaml (new file!)

deployment:
  basePath: /analytics