sveltejs / sveltejs/kit

Allow for relative paths of assets when building for static deployments

Open
#9,569 37 comments 23 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

paths.base pkg:adapter-static
Dominant language
JavaScript
Stars
20.8k
Forks
2.3k
Avg merge
1d 16h
Merged PRs (30d)
156

Description

Describe the problem

I'm developing a Kit app that, when deployed, will have a few directories above it, e.g., in dev a route might look like:

http://localhost/about

But in production, after rendering to static and deploying “somewhereoutthere”, the same route will be:

https://wwwcompanycom/canada/markting/about

The problem is—and maybe there’s an option for this that I'm missing—is that the static JS and CSS assets assume a route path:

<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />

<link rel="modulepreload" href="/_app/immutable/entry/start.42e3e50b.js">
<link rel="modulepreload" href="/_app/immutable/chunks/index.ebe9a2c4.js">
Describe the proposed solution

Allow for an option in svelte.config.js to allow for relative asset paths so that we can get:

<link rel="apple-touch-icon" sizes="180x180" href="./apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="./favicon-32x32.png" />

<link rel="modulepreload" href="./_app/immutable/entry/start.42e3e50b.js">
<link rel="modulepreload" href="./_app/immutable/chunks/index.ebe9a2c4.js">

(See the ./ ?)

Alternatives considered

No response

Importance

i cannot use SvelteKit without it

Additional Information

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

The request names svelte.config.js and the generated static HTML asset links; start by tracing how static deployments produce those links and where configuration is read. Done means an option can produce relative ./ paths for the listed icon, JavaScript, and CSS assets when the site is hosted below a domain root.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
build-system, frontend, web-dev
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.