程序员经验分享-hwhale

在 nextjs 之前加载闪屏

2024-01-03

我有一个 NextJS 网站，我想在网站加载之前添加一个启动屏幕

但是因为闪屏也在NextJS代码中，所以当nextjs在服务器上渲染并且JS在客户端下载并执行时，它就会加载。事实上，它是没有用的，因为它会在页面准备好后执行！

在完全加载和执行反应之前如何执行启动屏幕？

我也用nginx for proxy_pass


您可以轻松使用文件夹中的loading.js 文件，请参阅文档 -https://nextjs.org/docs/app/building-your-application/routing/loading-ui-and-streaming https://nextjs.org/docs/app/building-your-application/routing/loading-ui-and-streaming

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

ReactJS

Nginx

Nextjs

splashScreen

在 nextjs 之前加载闪屏 的相关文章

随机推荐

  • 了解 Qt 中的表单布局机制

    Qt具有灵活且强大的布局机制来处理桌面应用程序窗口的视图 但它是如此灵活 以至于当出现问题并需要微调时 它几乎无法被理解 而且如此强大 以至于它可以击败任何试图压倒 Qt 关于表单外观的观点的人 那么 谁能解释一下 或者提供一下Qt的定位机

  • PDO 因记录过多、缓冲查询而失败

    这个脚本昨天运行良好 但是今天 由于我最初选择的表中现在有大约 150 000 条记录 所以它失败了 说我正在从 null 获取 据我所知 这是因为我的记录太多了 因此 我最终通过向初始查询 1000 添加限制和这一行来纠正它 MysqlC

  • Bash 中的文件名未正确打印，带有下划线“_”[重复]

    这个问题在这里已经有答案了 我正在用这个 DATE FOLDER date b d a G FILENAME HOME date1 tar gz echo BACKUP DESTINATION DATE FOLDER FOLDERNAME

  • Python 继承：何时以及为何使用 __init__

    我是一个Python新手 试图理解继承方法背后的哲学 逻辑 问题最终涉及为什么以及何时必须使用 init 子类中的方法 例子 看来从超类继承的子类不需要有自己的构造函数 init 方法 下面 狗继承了哺乳动物的属性 名字 年龄 和方法 发出

  • 产品密钥的正则表达式

    我正在尝试做一个正则表达式来显示所有具有该值的产品密钥 这是我创建的正则表达式 A Z0 9 5 A Z0 9 5 A Z0 9 5 A Z0 9 5 A Z0 9 5 由于某种原因它不起作用 您打算使用哪种正则表达式工具 grep egr

  • 无法登录活动管理。有什么办法可以创建管理员用户吗？ [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 当我尝试使用默认管理员用户登录时 我收到 无效的电子邮件或密码 有没有办法用代码创建用户并尝试以这种方式登录 我可以登录我的实时网站 但不

  • 像 Perl 一样在 JavaScript 正则表达式中嵌入注释

    有没有办法在 JavaScript 正则表达式中嵌入注释 例如你可以用 Perl 做 https stackoverflow com questions 632795 how do you comment a perl regular ex

  • WCF - 序列化继承类型

    我有这些课程 DataContract public class ErrorBase DataContract public class FileMissingError ErrorBase DataContract public clas

  • 如何找到上次访问数据库的时间？

    在 SQL Server 2005 中 您能否轻松确定某人上次查询数据库的时间 扩展詹姆斯 艾伦的答案 SELECT d name last user seek MAX last user seek last user scan MAX l

  • 在 C++ 中使用 RK-4 求解洛伦兹方程

    我用 C 编写了使用 RK 4 方法求解洛伦兹方程的代码 我必须绘制吸引子图 并且在使用 RK 4 方法求解 3 一阶耦合微分方程时遇到一些困难 这是我的代码 Solving 3 coupled first order differenti

  • 系统在哪里存储图标位置？

    任何文件夹上的 图标视图 和 文件夹视图 实际上都是 SysListView 如果取消选中 自动排列图标 您可以在图标周围移动 下次打开文件夹时 所有图标都将位于与上次相同的位置 我的问题是 系统在哪里存储图标的 x 和 y 位置 设置为桌

  • Angular 的控制器方法如何使 $scope 可用于我的函数参数

    我正在寻找伪代码答案或概念答案 经过多年的编程 我从未创建过接收函数参数的类方法 以便该方法的调用者自动访问 不可见 属性 如果我尝试在我的范围之外访问 scopemy app controller 方法 我收到一个错误 所以我知道它不是全

  • 如何在 Rust 中声明公共静态指针？ [复制]

    这个问题在这里已经有答案了 我只是想声明一个指向由我的项目的多个组件共享的包中的结构的指针 但使用相同的过程 我的意思是目标是只初始化一次 type Box u64 64 pub static mut mmaped mut Box 在编译时

  • 在 python 中导入 pandas 会改变 matplotlib 处理日期时间对象的方式吗？

    在我的 debian squeeze 系统上 我遇到了一个 python 问题 可以将其简化为以下内容 import numpy import datetime from matplotlib import pyplot x datetim

  • 在不修改待办事项的情况下，什么会导致交互式 git rebase 失败？

    假设我想对具有漫长而复杂的合并历史的存储库的主分支进行变基 我想回溯大约 100 次提交 SHA 我可以这样做git rebase i SHA or git rebase i SHA rebase merges 如果我理解正确 后者包括合并

  • 在文本视图上设置印度卢比符号

    我正在开发一个应用程序 我需要在文本视图上设置印度卢比的符号 该符号用文本设置为金额 Symbol 我在 Assets fonts 文件夹中拥有该字体或 TTF 文件 我尝试将其用作 Typeface typeFace Rupee Type

  • 请求方法是 OPTIONS 而不是 post（现有的 StackExchange post 没有帮助）

    在你说之前还有另一篇文章 jQuery ajax post 在 Firefox 中发送 OPTIONS 作为 REQUEST METHOD https stackoverflow com questions 1099787 jquery a

  • Firebase/Swift 2 - 如何获取经过身份验证的用户密码和电子邮件

    我正在尝试使用 swift 2 和 Firebase 在应用程序中设置密码重置 以下 Firebase 示例 let ref Firebase url https

  • sql server中“=”和“is”的区别

    我在理解时遇到问题 and isSQL Server 中的运算符 考虑以下示例查询 它们在各自的输出中具有不同的行为 SELECT FROM tableName WHERE colName IS NULL SELECT FROM table

  • 在 nextjs 之前加载闪屏

    我有一个 NextJS 网站 我想在网站加载之前添加一个启动屏幕 但是因为闪屏也在NextJS代码中 所以当nextjs在服务器上渲染并且JS在客户端下载并执行时 它就会加载 事实上 它是没有用的 因为它会在页面准备好后执行 在完全加载和执

热门标签