“<script> 加载失败”404 错误 - Svelte

Posted

技术标签:

【中文标题】“<script> 加载失败”404 错误 - Svelte【英文标题】:"Loading failed for the <script>" 404 Error - Svelte 【发布时间】:2021-01-25 04:51:18 【问题描述】:

我在使用 Svelte 时遇到错误,导致无法在 GitHub 页面上托管的网站上加载 bundle.jsbundle.cssglobal.cssfavicon.png

我已通读this question,但该问题在其他浏览器上仍然存在,没有任何 ***、干净的 Firefox 配置文件或没有扩展,并且似乎是接受文件内容类型的问题。

Firefox 控制台中的错误信息是:

GET https://path/to/global.css    [HTTP/2 404 Not Found 9ms]

GET  https://path/to/bundle.css   [HTTP/2 404 Not Found 9ms]

GET https://path/to/bundle.js     [HTTP/2 404 Not Found 7ms]

Loading failed for the <script> with source “https://path/to/bundle.js”

GET https://path/to/favicon.png   [HTTP/2 404 Not Found 7ms]

然后“网络”选项卡返回:

带有favicon.png 的响应和请求标头:

// Request

GET /favicon.png HTTP/2
Host: kitchefs.github.io
User-Agent: Mozilla/5.0 (X11; Fedora; Linux x86_64; rv:81.0) Gecko/20100101 Firefox/81.0
Accept: image/webp,*/*
Accept-Language: en-GB,en;q=0.5
Accept-Encoding: gzip, deflate, br
Connection: keep-alive
Referer: https://kitchefs.github.io/beta/
TE: Trailers

// Response

HTTP/2 404 Not Found
content-type: text/html; charset=utf-8
server: GitHub.com
strict-transport-security: max-age=31556952
etag: W/"5f4de496-313"
access-control-allow-origin: *
content-encoding: gzip
x-proxy-cache: MISS
x-github-request-id: EAA2:03EC:1BFD04:221937:5F816340
accept-ranges: bytes
date: Sat, 10 Oct 2020 07:39:07 GMT
via: 1.1 varnish
age: 475

其他响应头都显示text/html的内容类型类型,尽管它们都不接受text/html

我在 gh-pages 分支上使用 GitHub 页面,我可以确认文件存在。如果这是 GitHub 页面或 Svelte 的问题,我正在措辞,以及我可以做些什么来修复/防止这个问题在未来发生。

如果需要,这里是the code,可以通过https://kitchefs.github.io/beta访问网站。

【问题讨论】:

【参考方案1】:

删除 public/index.html 中的前导 /

<link rel='icon' type='image/png' href='favicon.png'>
<link rel='stylesheet' href='global.css'>
<link rel='stylesheet' href='build/bundle.css'>
<script defer src='build/bundle.js'></script>

Gh 页面将在 URL 中使用您的存储库名称进行解析。因此,您不在基本路径上。

https://kitchefs.github.io/beta/

【讨论】:

谢谢,这行得通。您是否知道配置 Svelte 或使用一些 Github Action 自动执行此操作的方法,或者我每次都必须手动编辑它? 我在公用文件夹中创建了一个“静态”index.html。 (添加到 git)。这对我有用。例如参见:github.com/ivosdc/svelte-generic-crud-table ...dist 文件夹。我正在使用 travis.ci 部署 gh-pages 哇 - 为什么我花了这么长时间才找到这个 - 谢谢!我想知道为什么苗条的应用程序一开始就没有与此更改打包在一起。

以上是关于“<script> 加载失败”404 错误 - Svelte的主要内容,如果未能解决你的问题,请参考以下文章

如何设置404页面,404错误页面自定义方法

404错误页面设置_啥是网页404错误-我该如何设置404页面

如何用实际的 404 状态代码响应替换 Blazor 默认“软 404”

Nginx自定义404页面

nginx 404 返回404 状态码 (非200)

HTACCESS 错误文档 404 /404.htm 不工作