我的网站包含不同的“项目”，每个项目都链接到自己的 Git 存储库并从 Netlify 构建。例如，如果我的网站是 www.thedivtagguy.com , www.thedivtagguy.com/project1和 www.thedivtagguy.com/project2是两个不同的网站，但作为子目录链接到主域(而不是 project1.thedivtagguy.com )。
一个这样的示例站点可用 here .如您所见，它正确呈现了所有样式。但是，如果我通过我的主站点的重定向访问它，this is what happens .没有样式。
对于上面的内容，我只是设置了一个重定向规则来链接/testing/至 https://thedivtagguy2.netlify.app .
这就是public当我运行 npm build 时目录看起来像:
📦public
┣ 📂api
┣ 📂assets
┣ 📂common
┣ 📜app.css
┗ 📜index.html
即使在本地运行，index.html 也不会呈现正确的样式。这是 <head> 中包含的内容index.html 的标签:
<link rel="modulepreload" href="/_app/start-428f887f.js">
<link rel="modulepreload" href="/_app/chunks/vendor-28205438.js">
<link rel="modulepreload" href="/_app/pages/__layout.svelte-da7e95f6.js">
<link rel="modulepreload" href="/_app/pages/index.svelte-33b339ff.js">
<link rel="modulepreload" href="/_app/chunks/Meta-7977247e.js">
<link rel="stylesheet" href="/_app/assets/start-c446e5f0.css">
<link rel="stylesheet" href="/_app/assets/pages/__layout.svelte-aa99de20.css">
<link rel="stylesheet" href="/_app/assets/pages/index.svelte-e673c7ca.css">
<script type="module">
import { start } from "/_app/start-428f887f.js";
start({
target: document.querySelector("#svelte"),
paths: {"base":"","assets":""},
session: {},
host: location.host,
route: true,
spa: false,
trailing_slash: "never",
hydrate: {
status: 200,
error: null,
nodes: [
import("/_app/pages/__layout.svelte-da7e95f6.js"),
import("/_app/pages/index.svelte-33b339ff.js")
],
page: {
host: location.host, // TODO this is redundant
path: "\u002F",
query: new URLSearchParams(""),
params: {}
}
}
});
</script>
如您所见，它似乎为样式、图像和 JS 包引用了一些不同的路径。
我的直觉猜测是我需要为我的build设置正确的相对路径，以便它在本地构建时以及通过重定向访问时都能正常工作。
我该怎么做？如何解决这个问题，以便正确呈现我的样式和其他 Assets ？
我的存储库是 here .
最佳答案
在 vite.config.ts(如果你不使用 TypeScript，大概是 vite.config.js)，添加 base: './' 到配置。
关于javascript - 如何使用所有相对路径构建我的 Svelte 网站？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/70481804/