404 无法加载资源将 Flutter Web 应用程序部署到 GitHub 页面 [英] 404 Failed to load resource Deploying Flutter Web App to GitHub Pages

查看:27
本文介绍了404 无法加载资源将 Flutter Web 应用程序部署到 GitHub 页面的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试将我的 Flutter 应用程序部署到 GitHub Pages.应用程序使用 flutter run -d chrome 运行良好,并使用 flutter build web --release

成功构建

我将代码推送到我的存储库:

解决方案

标签在您的 index.html 中.将其更改为您的 github 存储库的基本路径.在这种情况下,这将是 />.如果你没有它,你可以将它添加到 标签中.

基本上问题是 flutter 尝试定位 main.dart.js 文件而不考虑部署的基本路径,因为您没有使用正确的 base 标签配置小路.如果托管服务提供商向主域添加了额外的路径,则在部署 Flutter Web 应用程序或任何 Web 应用程序时,这是一个常见问题.

您可以通过以下链接看到 main.dart.js 可用.https://learyjk.github.io/superpacecalcweb/main.dart.js

<块引用>

请注意,在本地测试时,您仍然需要将其设置回 href="/".否则本地部署将不起作用.有一个开放的 issue 可以使此配置.

I am trying to deploy my Flutter app to GitHub Pages. App runs fine with flutter run -d chrome and builds successfully using flutter build web --release

I push the code to my repository: https://github.com/learyjk/superpacecalcweb

Deployment Activity Log shows successful deployment. But when I click the "View Deployment" button I just get a blank page. Javascript console says:

Failed to load resource: server responded with status of 404 () https://learyjk.github.io/main.dart.js

I have tried to append /index.html to the end of the URL as well but no luck.

Any ideas? The error output is not very verbose, so I don't quite know where to start...

GitHub pages link: https://learyjk.github.io/superpacecalcweb/

Thank you!

解决方案

There is <base href=''/> tag in your index.html. Change it to the base path of your github repo. In this case this would be <base href="/superpacecalcweb/"/>. If you don't have it you can add it inside the <head> tag.

Basically the problem is flutter tries to locate main.dart.js file without considering the base path of your deployment as you haven't configured the base tag with correct path. This is common issue while deploying flutter web app or any web app for the sake if the hosting provider adds an additional path to main domain.

You can see that the main.dart.js is available through the following link. https://learyjk.github.io/superpacecalcweb/main.dart.js

Please do note that while testing locally you will still have to set it back to href="/". Otherwise the local deployment won't work. There is an open issue to make this configurable.

这篇关于404 无法加载资源将 Flutter Web 应用程序部署到 GitHub 页面的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆