子应用动态挂载子app时会出现destroy 不是一个function

Question

子应用动态挂载子app时会出现destroy 不是一个function

Emma-Alpha opened this issue 2 years ago · comments

Describe the bug

Uncaught TypeError: destroy is not a function
at safelyCallDestroy (react-dom.development.js:22927:5)
at commitHookEffectListUnmount (react-dom.development.js:23095:11)
at commitPassiveUnmountInsideDeletedTreeOnFiber (react-dom.development.js:25096:11)
at commitPassiveUnmountEffectsInsideOfDeletedTree_begin (react-dom.development.js:25043:5)
at commitPassiveUnmountEffects_begin (react-dom.development.js:24951:11)
at commitPassiveUnmountEffects (react-dom.development.js:24936:3)
at flushPassiveEffectsImpl (react-dom.development.js:27033:3)
at flushPassiveEffects (react-dom.development.js:26979:14)
at commitRootImpl (react-dom.development.js:26930:5)
at commitRoot (react-dom.development.js:26677:5)

Reproduction

https://stackblitz.com/edit/garfish-demo-xe7dqh?file=main/src/index.js

Used Package Manager

npm

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 16.14.2 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 7.17.0 - /usr/local/bin/npm

Validations

Read the docs.
Read the common issues list.
Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
Make sure this is a Garfish issue and not a framework-specific issue.
The provided reproduction is a minimal reproducible example of the bug.

Emma commented 2 years ago

@zhoushaw

Zhou xiao · Answer 1 · Mon Apr 17 2023 13:22:42 GMT+0800 (China Standard Time)

我这边无法打开你的 ide，你可以尝试在 provider 下面添加这段代码吗

if (window.__GARFISH__ && typeof __GARFISH_EXPORTS__ !== 'undefined') {
  // eslint-disable-next-line no-undef
  __GARFISH_EXPORTS__.provider = provider;
}

Emma · Answer 2 · Mon Apr 17 2023 13:55:21 GMT+0800 (China Standard Time)

我这边无法打开你的ide，你可以试试在provider下面添加这段代码吗
if (window.__GARFISH__ && typeof __GARFISH_EXPORTS__ !== 'undefined') {
  // eslint-disable-next-line no-undef
  __GARFISH_EXPORTS__.provider = provider;
}

我更新了代码仓库地址了，麻烦大佬看看？

Zhou xiao · Answer 3 · Mon Apr 17 2023 13:59:06 GMT+0800 (China Standard Time)

可以把你的代码 clone 到 github 仓库，给我一个仓库的地址吗，stackblitz 在多仓库时经常有 bug

Emma · Answer 4 · Mon Apr 17 2023 14:01:05 GMT+0800 (China Standard Time)

嗯嗯，我复制到github上，稍等

Emma · Answer 5 · Mon Apr 17 2023 14:22:19 GMT+0800 (China Standard Time)

可以把你的代码 clone 到 github 仓库，给我一个仓库的地址吗，stackblitz 在多仓库时经常有 bug

大佬，代码放到这个仓库里面了 https://github.com/Emma-Alpha/garfish_demo

Emma · Answer 6 · Mon Apr 17 2023 17:40:29 GMT+0800 (China Standard Time)

@zhoushaw 大佬，这个问题好处理吗？

Zhou xiao · Answer 7 · Mon Apr 17 2023 17:50:29 GMT+0800 (China Standard Time)

@Emma-Alpha 我在本地 clone 运行了看着是正常的呢，你在本地运行过吗

Emma · Answer 8 · Mon Apr 17 2023 18:01:46 GMT+0800 (China Standard Time)

@zhoushaw 运行过了，要不我提供一个视频给你？

Emma · Answer 9 · Mon Apr 17 2023 18:06:45 GMT+0800 (China Standard Time)

@zhoushaw

2023-04-17.18.03.55.-.Compressed.with.FlexClip.mp4

Emma · Answer 10 · Mon Apr 17 2023 19:29:41 GMT+0800 (China Standard Time)

更换成以下写法，开发环境是没有任何报错的。

但是，打包后出现provider is undefind。

Karina · Answer 11 · Mon Apr 17 2023 19:37:49 GMT+0800 (China Standard Time)

我来看看

Karina · Answer 12 · Mon Apr 17 2023 19:46:25 GMT+0800 (China Standard Time)

你 useEffect 里面 async 函数这种写法本身就是有问题的吧

Emma · Answer 13 · Mon Apr 17 2023 19:48:05 GMT+0800 (China Standard Time)

是的，我看到了React提示出来的警告，因此我更改成了新的写法。只不过出现了新的错误。

Karina · Answer 14 · Mon Apr 17 2023 19:48:16 GMT+0800 (China Standard Time)

你按照右边这种写法有什么问题吗，我理解这不是garfish 的问题，useEffect 里面 async 你这种用法就是有问题的

Karina · Answer 15 · Mon Apr 17 2023 19:48:43 GMT+0800 (China Standard Time)

是的，我看到了React提示出来的警告，因此我更改成了新的写法。只不过出现了新的错误。

什么错误呢

Emma · Answer 16 · Mon Apr 17 2023 19:49:38 GMT+0800 (China Standard Time)

你按照右边这种写法有什么问题吗，我理解这不是garfish 的问题，useEffect 里面 async 你这种用法就是有问题的

这种写法是参考大佬的哦

Emma · Answer 17 · Mon Apr 17 2023 19:49:49 GMT+0800 (China Standard Time)

@zhoushaw

出现这个错误

Karina · Answer 18 · Mon Apr 17 2023 19:51:16 GMT+0800 (China Standard Time)

我们更新下 demo 哈

Karina · Answer 19 · Mon Apr 17 2023 19:52:21 GMT+0800 (China Standard Time)

@zhoushaw

出现这个错误

是打包后吗，我本地没有出现这个问题

Emma · Answer 20 · Mon Apr 17 2023 19:52:41 GMT+0800 (China Standard Time)

@zhoushaw

出现这个错误

是打包后吗，我本地没有出现这个问题

是的，通过webpack编译之后就出现了

Emma · Answer 21 · Mon Apr 17 2023 19:53:24 GMT+0800 (China Standard Time)

是否需要我这边提供完整的webpack config？

Karina · Answer 22 · Mon Apr 17 2023 19:56:13 GMT+0800 (China Standard Time)

是的，通过webpack编译之后就出现了

demo 打包后能复现吗

Karina · Answer 23 · Mon Apr 17 2023 20:11:13 GMT+0800 (China Standard Time)

provider 为 null 参考下这个问题：https://www.garfishjs.org/issues/#provider-is-null . 我看了你的 webpack 配置没有问题，dev 下我这边没复现过。一般来说打包后和 dev 表现是一样的，所以这边你看下能不能 dev 如果你能复现的话提供下复现环境。其他的除了上面说的那个问题外，我没发现其它的问题哈。

Emma · Answer 24 · Mon Apr 17 2023 20:12:37 GMT+0800 (China Standard Time)

我看了你的 webpack 配置没有问题，dev 下我这边没复现过。一般来说打包后和 dev 表现是一样的，所以这边你看下能不能 dev 如果你能复现的话提供下复现环境。其他的除了上面说的那个问题外，我没发现其它的问题哈。

打包后，配置dist比较麻烦。。稍等，我看看怎么弄。

Karina · Answer 25 · Mon Apr 17 2023 20:13:42 GMT+0800 (China Standard Time)

我看了你的 webpack 配置没有问题，dev 下我这边没复现过。一般来说打包后和 dev 表现是一样的，所以这边你看下能不能 dev 如果你能复现的话提供下复现环境。其他的除了上面说的那个问题外，我没发现其它的问题哈。

打包后，配置dist比较麻烦。。稍等，我看看怎么弄。

嗯嗯好的，你复现了可以推下代码我这边拉下来看下

Karina · Answer 26 · Mon Apr 17 2023 20:29:28 GMT+0800 (China Standard Time)

我这边 serve dist 下面的目录也不会复现哦

Emma · Answer 27 · Mon Apr 17 2023 20:30:06 GMT+0800 (China Standard Time)

嗯，我这边迁移一下线上使用的webpack config 看看先，我刚刚配置了一下本地简单的demo 确实是没有出现

Karina · Answer 28 · Mon Apr 17 2023 20:34:49 GMT+0800 (China Standard Time)

建议优先检查下线上配置，目前还没有碰到过本地表现和生产环境不一致的情况。配置可以参考这里 https://www.garfishjs.org/issues/#provider-is-null

Emma · Answer 29 · Mon Apr 17 2023 21:49:28 GMT+0800 (China Standard Time)

感谢大佬，我找到原因了。。(线上的 node_modules 和 yarn 环境有毒，我清空缓存就OK了)