reactjs SharedArrayBuffer从M91开始将需要跨源隔离,大约在2021年5月

pgx2nnw8  于 2023-01-30  发布在  React
关注(0)|答案(7)|浏览(511)

通过npx create-react-app创建react应用并运行时,DevTools(Chrome 88和89)中会弹出警告:
scheduler. development. js:298 [弃用] SharedArrayBuffer从M91开始将需要跨源隔离,大约在2021年5月。更多详细信息请参见https://developer.chrome.com/blog/enabling-shared-array-buffer/

    • 环境**
current version of create-react-app: 4.0.1
  running from /Users/mahdi/.npm/_npx/25767/lib/node_modules/create-react-app
  Binaries:
    Node: 14.15.4 - ~/.nvm/versions/node/v14.15.4/bin/node
    Yarn: 1.22.4 - /usr/local/bin/yarn
    npm: 6.14.10 - ~/.nvm/versions/node/v14.15.4/bin/npm
  Browsers:
    Chrome: 88.0.4324.96
    Edge: 87.0.664.66
    Firefox: 84.0
    Safari: 14.0.2
  npmPackages:
    react: ^17.0.1 => 17.0.1
    react-dom: ^17.0.1 => 17.0.1
    react-scripts: Not Found
  npmGlobalPackages:
    create-react-app: Not Found

    • 重现步骤**
  1. npx create-react-app myapp
  2. cd myapp && npm start Open
  3. http://localhost:3000,适用于Chrome 88或89,常规或隐身模式
    1.打开开发工具:将显示警告
    • 解决此警告的任何建议?**
kgqe7b3p

kgqe7b3p1#

reactreact-dom版本从17.0.1更新为==〉17.0.2可以解决此问题。
您只需要在命令提示符或bash中运行npm update,希望您将看到package.json文件中的更改(如果您希望升级持续到package.json,则为yarn upgrade react --latestyarn upgrade react-dom --latest)。
以下是应用更新后我的应用的git报告:

zysjyyx4

zysjyyx42#

如警告所示,Chrome从91版开始需要跨源隔离才能使用SharedArrayBuffer。据我所知,除了等待响应更新之外,你无法解决警告。
其他客户也存在此问题,如herehere所示
此问题已在this拉取请求中修复,但尚未发布。

**编辑:**此问题现已在react 17.0.2版本中得到修复。

ufj5ltwl

ufj5ltwl3#

实际上react-dom更新到最新版本后我解决了这个问题,单靠react并没有解决它:

npm i react@latest react-dom@latest

yarn add react@latest react-dom@latest
hc8w905p

hc8w905p4#

对于那些还没有准备好升级到v17的用户(由于其他遗留库的原因),一个简单的解决方法是将以下代码放在index.html的任意部分

<script>
      // See https://github.com/facebook/react/issues/20829#issuecomment-802088260
      if (!crossOriginIsolated) SharedArrayBuffer = ArrayBuffer;
    </script>
7lrncoxx

7lrncoxx5#

此问题已在React version 17.0.2中得到修复如果您还使用react-dom,您也应该更新它。运行npm update(或yarn中的相应命令,或您正在使用的任何管理器)将更新所有内容,因此解决了弃用警告。

这是我的package.json更新后:

but5z9lq

but5z9lq6#

将react和react-dom版本更新为17.0.2、yarn upgrade react --latestyarn upgrade react-dom --latest
此外,如果使用@hot-loader/react-dom或react-hot-loader,还需要运行yarn upgrade @hot-loader/react-dom --latestyarn upgrade react-hot-loader --latest

hi3rlvi2

hi3rlvi27#

我知道你已经得到了你的答案,但如果有人只用途:如果react和react-dom的当前版本为16.x.x,并且您的项目未被EJECTED,则npm i react@latest react-dom@latest不会将react和react-dom更新到版本17.0.2。该命令仅用于将react和react-dom更新到版本16.14.0。如果您处于这种情况,则需要首先将react-script、react和react-dom版本迁移到17:npm install react-scripts@4.0.0 react@17.0.0 react-dom@17.0.0。更多信息:https://dev.to/keonik/upgrading-to-react-17-create-react-app-edition-fe

相关问题