文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

为什么我的React应用程序不能在Edge 84 (铬)中正确加载，但在chrome中可以？

React应用程序在不同浏览器中加载的问题可能是由于浏览器兼容性或配置问题引起的。以下是一些可能导致React应用程序在Edge 84中无法正确加载的常见原因：

  1. 版本兼容性：React应用程序可能使用了一些在Edge 84中不受支持的React或相关库的最新特性。在不同浏览器中，特定版本的React可能会有不同的行为。您可以尝试更新React和相关库的版本，以确保其与Edge 84兼容。
  2. 浏览器缓存：有时浏览器会缓存旧版本的应用程序代码，导致新版本无法正确加载。您可以尝试清除Edge 84的缓存，或者在应用程序的URL中添加一个唯一的查询参数，以确保浏览器加载最新的代码。
  3. 浏览器配置：Edge 84的某些配置可能与React应用程序的要求不兼容。您可以尝试在Edge 84中禁用一些扩展或配置项，以查看是否解决了加载问题。
  4. Polyfills和转译：某些浏览器可能不支持ES6+的新特性，您可能需要使用polyfills或转译工具（如Babel）来确保您的代码在Edge 84中能够正确加载。您可以查看React官方文档或相关资源，了解如何配置polyfills和转译工具。
  5. 第三方库或插件：如果您的React应用程序依赖于第三方库或插件，这些库或插件可能与Edge 84不兼容。您可以尝试更新这些库或插件的版本，或者查看它们的文档以了解是否存在与Edge 84相关的已知问题。

总结起来，要解决React应用程序在Edge 84中无法正确加载的问题，您可以尝试更新React和相关库的版本、清除浏览器缓存、调整浏览器配置、使用polyfills和转译工具，以及检查第三方库或插件的兼容性。如果问题仍然存在，您可以查阅React官方文档、Edge 84的文档或社区论坛，以获取更多关于此问题的帮助和解决方案。

腾讯云相关产品和产品介绍链接地址：

  • 腾讯云服务器（CVM）：https://cloud.tencent.com/product/cvm
  • 腾讯云云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
  • 腾讯云数据库（TencentDB）：https://cloud.tencent.com/product/cdb
  • 腾讯云CDN加速（CDN）：https://cloud.tencent.com/product/cdn
  • 腾讯云人工智能（AI）：https://cloud.tencent.com/product/ai
  • 腾讯云物联网（IoT）：https://cloud.tencent.com/product/iot
  • 腾讯云移动开发（移动推送、移动分析）：https://cloud.tencent.com/product/mps
相关搜索:为什么我的handleLogout函数不能在我的react应用程序中工作？为什么我的post请求可以在POSTMAN中工作，但不能在react应用程序中工作？我的React应用程序不能在浏览器中自动重新加载当我使用react时，为什么我不能在chrome中调试没有括号的部分代码？为什么我的SVG可以在Chrome中正常显示，但不能在Firefox中显示？为什么我的Post api可以在postman中运行，但不能在react原生应用中运行为什么我在Squarespace中的动画可以在Chrome上运行，而不能在Safari上运行？为什么我的Express.js BackEnd可以在Chrome中成功删除cookie，但在火狐中不能成功删除？为什么我的CSS在Safari中不能像预期的那样工作，但在Chrome上却可以正常工作useParams在控制台日志中获得0，但在我尝试在curd react应用程序中编辑时，url中的id正确为什么我必须先加载包和文件，然后才能在R中运行漂亮的应用程序？在React中，我的POST fetch请求可以在桌面上工作，但不能在Chrome上的iPad上工作，有什么问题吗？Redux + React如何在充满对象的数组中只更改一个元素值？我有可以工作的应用程序，只是想确保我做得正确我有一个可以工作的Chrome react网络音频应用程序。当在火狐中运行时，变量会被列为undefined.Why吗？为什么我的socket.io事件侦听器在一个UI组件上可以正常工作，但在React中的另一个组件上却不能工作？
相关搜索:
页面内容是否对你有帮助？
有帮助
没帮助

相关·内容

【译】在生产环境中使用原生JavaScript模块

但是那时候，尽管能够在生产中部署现代JavaScript，大多数浏览器也都支持模块，我仍然建议打包你的代码。 为什么？主要是因为我觉得在浏览器中加载模块很慢。...它只是说，如果你将数百个未经过压缩的模块文件部署到生产环境中，Chrome将无法像加载单个经过压缩的模块一样快速的加载它们。...一般来说，你可以将可能在同一时间发生变化的包(例如， React和 react-dom)分组，因为它们必须一起失效(例如，我稍后展示的示例应用程序将所有React依赖项分组为同一个文件)。...这个演示程序可以在不支持动态 import()的浏览器中运行(如Edge 18和Firefox ESR)，也可以在不支持模块的浏览器中运行(如Internet Explorer 11)。...为了说明这个策略不仅适用于简单的用例，我还包含了当今复杂的JavaScript应用程序需要的许多特性: Babel转换（包括JSX） CommonJS的依赖关系（例如react，react-dom） CSS

1.3K20

    • 深入探讨 Web 开发中的预渲染和 Hydration

    让我们来检查一下流程以解释这一点： 单页面应用程序流程 用户最终看到 HTML 页面需要几个步骤。 首先，浏览器会获取 HTML。这个初始的 HTML 会是空白且不正确的。为什么呢？...由于初始的 HTML 是错误的，网络爬虫和搜索引擎将无法在网站上找到相关内容并跳过它。 看一下下面的 GIF 图。在这里，在 Chrome 开发者工具中禁用了 JavaScript。...它加载使我们的应用程序具有交互性的 JavaScript。 在 React 中，“Hydration”是 React 如何“附着”到已经在服务器环境中由 React 渲染的现有 HTML 上。...这是一个 gif 动图，我 DevTool 中禁用了 JavaScript。...使用Gatsby（一个具有 SSR 功能的静态站点生成框架）创建了我的应用 即使没有 JavaScript，我们仍然可以在我的应用上看到内容。那是因为用户收到了预渲染的 HTML！

    13410

    ReactJS和React-Native的主要区别在哪里

    React-Native在某种程度上与ReactJS非常相似，但在开始第一个本机应用程序之前，您需要知道它们之间的差异。...你也可以看看NavigatorExperimental，但在我认为，它还不适于应用于生产环境中。...如果您决定使用第二点，React-Native可以检测您正在运行代码的平台，并为正确的平台加载正确的代码。...开发者工具 当您启动新的本机项目时，您可以从React中获得几个开发人员工具，而无需安装任何内容，这在我看来非常棒。当您需要对应用程式的样式做小修改时，非常适合使用热加载。...对于影响应用程序逻辑的更大更改，我通常更喜欢使用Live Reload，当您在代码中进行更改时，将完全重新加载您的应用程序。 ?

    17K30

    JavaScript框架--迈向2023年

    React 18的发布增加了对流媒体的支持，并在Next和Remix中得到应用，同时也为React服务器组件和Next 13应用目录提供了动力。...我并不确信每个人都在同一页面上，但是该领域的许多领先思想实际上对某件事情有共识。这不是一件可以轻视的事情。 我们所处的位置 单页应用程序并不是最适合一切的架构。...在初始加载之后，根据导航渲染下一页。即使是 Qwik，它本来可以作为优化的部分加载应用程序启动，并且可以扩展到完整的 SPA，但它在所有示例和演示中都更喜欢服务器路由（MPA）。...你不能在短时间内在一个领域倾注大量创新，而不希望出现什么问题。...Edge ：未曾探索的边界 在过去的 12 个月中，几乎所有元框架都支持了边缘函数。在这一点上，绝大多数元框架都可以部署到各种服务器less 和边缘产品中。但是，这并没有改变我们的开发方式。

    1.4K10

    浏览器测试的三大挑战及解决方案【译】

    这就是为什么大多数 Web 应用程序都设计为与多个浏览器兼容的原因。这对于任何响应式 Web 应用程序都非常重要，因为必须确保应用程序在任何给定时间与每个浏览器和浏览器版本兼容。...随着时间的推移，客户的注意力持续时间越来越短，如果网站加载看起来有问题，他们会毫不犹豫地按下浏览器上的后退按钮。那么，有什么解决办法让Web应用程序和网站在每个浏览器、设备和平台上都能完美运行吗？...但在此之前，让我们了解什么是跨浏览器测试以及为什么需要它。...跨浏览器测试，为什么重要 简单来说，跨浏览器测试是确保 Web 应用程序的功能在不同浏览器、浏览器版本和操作系统之间保持一致的过程，从而为其用户提供轻松的用户体验。...使用左移方法，可以在将应用程序移至生产环境之前开始在本地暂存环境中测试您的应用程序。这就必需我们进行跨浏览器测试，即使在生产中部署后，还可以跟踪和修复BUG。

    38210

    2020前端性能优化清单（三）

    一旦在代码中定义了分割点，Webpack 就可以处理依赖关系和输出文件。它可以让浏览器保持较小的初始下载量，并在应用程序请求时按需请求代码。...Web Worker 的典型使用场景是预加载数据和渐进式 Web 应用程序[29]，这种方式可以预先加载和存储一些数据，以便后续在需要时使用它。...，介绍了有关如何在浏览器中运行原生代码，以及为什么要这么做和这对 JavaScript 和 Web 开发的未来意味着什么。...Chrome 中的 CSS 和 JavaScript 代码覆盖率工具[62]可以使你了解哪些代码已执行或应用，哪些未执行。你可以启动一个覆盖率检查，在页面上执行操作，然后查看覆盖率结果。...你可以将该技术集成到你的 Next.js 应用程序[93]，Angular 和 React 中[94]，并且有一个Webpack 插件[95]可以自动执行设置过程。

    2.1K10

    2020前端性能优化清单（三）

    一旦在代码中定义了分割点，Webpack 就可以处理依赖关系和输出文件。它可以让浏览器保持较小的初始下载量，并在应用程序请求时按需请求代码。...Web Worker 的典型使用场景是预加载数据和渐进式 Web 应用程序[29]，这种方式可以预先加载和存储一些数据，以便后续在需要时使用它。...，介绍了有关如何在浏览器中运行原生代码，以及为什么要这么做和这对 JavaScript 和 Web 开发的未来意味着什么。...Chrome 中的 CSS 和 JavaScript 代码覆盖率工具[62]可以使你了解哪些代码已执行或应用，哪些未执行。你可以启动一个覆盖率检查，在页面上执行操作，然后查看覆盖率结果。...你可以将该技术集成到你的 Next.js 应用程序[93]，Angular 和 React 中[94]，并且有一个Webpack 插件[95]可以自动执行设置过程。

    2.2K20

    2020前端性能优化清单（五）

    Chrome、Firefox、Edge 的支持不错，Samsung Internet 也还可以。WebKit 预览版也已支持。降级方案如何？...在 Chrome、Firefox、Safari 和 Edge 中可以对该 API 提供部分支持[53]，在所有现代浏览器中都支持 service worker[54]。 45....如果你想再深入一点，这里有一些资源: Addy Osmani 演示了如何在 React 中实现自适应服务[64] React 自适应加载钩子和工具[65]为 React 实现提供了代码片段 Netanel...Addy 关于“Chrome 中的加载优先级[77]”的文章展示了 Chrome 如何准确地解析 resource hint，一旦你决定了哪些资源对渲染是至关重要的，你就可以为它们分配高优先级。...另外，Priority Hints[84] 将帮助我们标示脚本的加载优先级。

    2K20

    前端与HTML - 笔记

    兼容性 用户体验 # 前端的边界 由于前端的高速发展和日益完善的生态，前端的边界已经被扩展的很广，使用现代前端技术，我们可以： 开发服务端：Node.js 开发客户端：Electron、React-Native...开发 3D 游戏：WebGL # 开发环境 前端的开发环境很简单，只需要有浏览器（Chrome、Firefox、Edge 等）+ 编辑器（VSCode、Vim 等）即可 个人使用的主要是 Chrome...">我是一段文字 ，其中 class="note" 就是这个元素的一个属性，不同的属性使用空格隔开 标签和属性不区分大小写，推荐小写 空标签可以不闭合，比如 input、meta 属性值推荐用双引号包裹...Firefox Edge 文本编辑器 VSCode Vim Notepad++ 特殊列表：列表定义 dl、列表中的标题 dt、列表中的数据项 dd（注意：一个 dt 可对应多个 dd） <...HTML 中的 元素 、 属性 及 属性值 都拥有某些含义 开发者应该遵循 语义 来编写 HTML 有序列表用 ol ; 无序列表用 ul lang 属性表示内容所使用的语言 为什么要使用？

    1.4K40

    跨平台桌面开发，Electron还是WebView2 （下篇）

    （严格的说，WebView2是基于Edge内核，但我们都知道Edge内核只是Chrome内核的fork版本而已） 这意味着你可以用你熟悉的React或是Vue，语言上可以选择JavaScript或TypeScript...但是对于微软这么一个Windows的厂商，它的这个承诺多久能实现，我个人还是觉得有待观察的。 也许大家会很奇怪，为什么WebView2还没有真正跨平台，只是号称。...不都是Chrome内核+前端技术的方案要么，不是天然支持的么。 这就是说到它们的不同之外了，因为它们与原生API打交道的语言并不一样。...这意味着什么，意味着仅凭一个前端团队，是没法利用WebView2开发出一个独立的应用程序，还需要一个原生开发团队配合着来做一个壳的应用。 这和移动开发中的混合开发Hibrid模式是不是非常相似。...（大公司，有钱，土豪请自觉将自己排除在外） 远方以及更远 当然，我在这篇文章中，主要还是围绕前端开发技术下的跨平台桌面开发。

    11.8K30

    React诞生十年后，前端是否已进入后React时代？

    鉴于 React 自 2014 年 Oscon 以来在前端开发生态系统中的主导地位，在这篇文章中，我将重新审视 React 背后的概念，并确定它们在多大程度上经受住了时间的考验。...这在 2024 年尤其重要，因为像 Microsoft Edge 这样的主要软件产品已经开始探索我称之为 后 React 方法 的 Web 开发（Microsoft Edge 团队称之为“HTML-first...为什么 React 在 2014 年席卷 Web 开发 在 2014 年的演讲中，Chedeau 解释说，React 的起源来自 Facebook 在 2010 年 2 月作为开源软件发布的 PHP 扩展...Chedeau 有一个简洁的引言概括了 React 的优势：“我倾向于将 React 视为 DOM 的版本控制”（归功于 AdonisSMU）。因此，在这个框架中，React 就像前端的 Git。...React 确实提供了一种革命性的 Web 应用程序开发方法——它特别适合数据变化很大的大型应用程序。有影响力的开发人员开始注意到这一点，React 的采用在 2014 年增长。

    8710

    【吴恩达-AIGCChatGPT提示工程课程】第三章 - 迭代式提示开发

    当使用 LLM 构建应用程序时，我从来没有在第一次尝试中就成功使用最终应用程序中所需的 Prompt。...我认为在提示方面，第一次成功的几率可能会高一些，但正如上所说，第一个提示是否有效并不重要。最重要的是为您的应用程序找到有效提示的过程。...如果第一次效果不好，那么迭代的过程就是找出为什么指令不够清晰或为什么没有给算法足够的时间思考，以便改进想法、改进提示等等，循环多次，直到找到适合您的应用程序的 Prompt。...因此，我可以进一步改进这个提示，要求在描述的结尾，包括在技术说明中的每个7个字符产品ID。...对于一些更复杂的应用程序，可以对多个样本进行迭代开发提示并进行评估。最后，可以在更成熟的应用程序中测试多个Prompt在多个样本上的平均或最差性能。

    71610

    如何选一款适合自己的网页浏览器？-2023

    个人结论： 以mainland china为例： edge>firefox>opera>chrome 关闭不需要的功能 关闭数据收集 不华丽分割 如下为整理：  综述 所有网络浏览器都具有相同的基本功能...Firefox 还可以识别图像中的文本，选择后会将其复制到剪贴板。最后，Firefox Colorways 提供了优化 Firefox 屏幕外观的新选项。...由于它比 Chrome 存在的时间更长，因此一些较旧的 Web 应用程序（您可能会在大学或工作场所遇到类似应用程序）在 Firefox 上比在 Chrome 上运行得更好。...可以看到，已经进入了令人毛骨悚然的领域，这就是为什么重要的是要记住，对浏览器的选择，比每天使用的任何其他服务或应用程序，完全取决于个人喜好——什么最适合你。...考虑浏览器性能：浏览器的性能对于用户体验至关重要。你需要选择一款具有快速加载页面、响应速度快、不卡顿的浏览器。在选择浏览器时，可以查看其性能评测和用户评价，以了解其性能表现。

    29920

    JavaScript框架的四个时代

    这就是为什么我们今天的标准最终实现了这两种方式，但在这之前，我们需要使用库来编写能在两种浏览器上使用的代码。 这些库主要用于制作小型的、独立的用户界面组件。...以组件为中心的视图层 我不认为React发明了组件，但说实话，我也不太清楚它们最早来自哪里。但至少可以追溯到.NET中的XAML，而 web 组件也在那时开始作为一种规范发展。...使用像React和Vue这样的框架，你可以一次一个小部件或组件地将它们的一小部分放入现有的应用程序中，允许开发人员增量地迁移他们现有的代码。...释放了Edge Computing，为基于JavaScript的服务器应用程序提供了SPA在分布/响应时间方面的好处（Spas以前由于在CDN上是静态文件，因此通常可以更快地开始加载加载，即使它们花了更长的时间才能完全加载并在结束...但趋势是正确的，如果我们继续朝着共享解决方案的方向发展，我认为我们可以用比以前更好的方式解决这些问题。 我还对将这些模式进一步提升到 web平台本身背后的潜力感到兴奋。

    50330

    用 Arweave 构建 Web3 应用

    在这篇文章中，你将了解什么是Arweave，为什么我认为它很重要，以及你如何能开始用它来构建。这篇文章的重点是文件存储和检索，而不是运行你自己的生产型Arweave网关。...Arweave[4]是一个全球性的、永久性的、去中心化的数据和文件存储层。 对我来说，Arweave的革命性之处在于，我可以存储一次东西，并期望它将永远可用，而不必再支付任何费用，也不必担心它消失。...这种数据的永久性在web3中特别重要，因为我们正在建立不可改变的应用基础设施。区块链数据在本质上已经是不可变的，但你经常看到开发者仍在以不遵守去中心化或不可变性最佳实践的方式存储链外数据。...你可以直接将其安装为chrome扩展，并开始与使用Arweave的网络应用进行交互。 安装后，你可以用任何支持的交易所[7]为钱包提供资金，或者你可以导入你在之前创建的钱包。...我们要做的第一件事是使用create-react-app创建一个新的React应用程序。

    1.1K30

    JavaScript框架的四个时代

    这就是为什么我们今天的标准最终实现了这两种方式，但在这之前，我们需要使用库来编写能在两种浏览器上使用的代码。 这些库主要用于制作小型的、独立的用户界面组件。...以组件为中心的视图层 我不认为React发明了组件，但说实话，我也不太清楚它们最早来自哪里。但至少可以追溯到.NET中的XAML，而 web 组件也在那时开始作为一种规范发展。...使用像React和Vue这样的框架，你可以一次一个小部件或组件地将它们的一小部分放入现有的应用程序中，允许开发人员增量地迁移他们现有的代码。...释放了Edge Computing，为基于JavaScript的服务器应用程序提供了SPA在分布/响应时间方面的好处（Spas以前由于在CDN上是静态文件，因此通常可以更快地开始加载加载，即使它们花了更长的时间才能完全加载并在结束...但趋势是正确的，如果我们继续朝着共享解决方案的方向发展，我认为我们可以用比以前更好的方式解决这些问题。 我还对将这些模式进一步提升到 web平台本身背后的潜力感到兴奋。

    56420

    如何在Fedora 29中安装Chromium Browser

    但是，两个浏览器存在一些差异，正如其名称所示， Google Chrome的以下功能在默认的Chromium版本中不存在： 自动更新功能 跟踪使用和崩溃报告的机制 某些Google服务的API密钥 集成的...但是，现在可以从Fedora软件存储库免费安装该软件包。 要安装Chromium ，您可以使用Fedora Workstation中的软件工具并搜索铬 ，然后安装软件包。...在Fedora中安装软件工具中的Chromium 或者，您可以使用以下dnf命令来安装它，如图所示。...$ sudo dnf install chromium 在Fedora中安装Chromium 安装完成后，在GNOME Shell或桌面菜单中搜索应用程序，然后单击它以启动它。...$ sudo dnf upgrade chromium 在Fedora中升级Chromium Chromium是一个功能齐全的浏览器，可以为Google Chrome浏览器提供绝大多数代码。

    1.2K10
    点击加载更多

    扫码

    添加站长 进交流群

    领取专属 10元无门槛券

    手把手带您无忧上云

    扫码加入开发者社群

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2024 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

      领券