umijs/hox

一直加载中是怎么回事?

lebron112 opened this issue · 2 comments

import React, { useEffect } from "react";
import { RouteComponentProps } from "react-router";
import useCounterModal from "~/models/global";
import styles from './index.less';

export default (props: RouteComponentProps & { children: React.ReactNode }) => {
  const { children } = props;
  console.log(props);
  const { count,increment, decrement } = useCounterModal();
  // useEffect(() => {
  //   console.log(count);
  // }, [count])
  return (
    <div className={styles.main_layout}>
      <div>我是layout啊</div>
      {children}
      {/* {count}
      <div onClick={increment}>按我+1</div>
      <div onClick={decrement}>点我-1</div> */}
    </div>
  );
};

modal--

import { createModel } from 'hox';
import { useState } from 'react';

const useCounter = (initCount?: number) => {
  const [count, setCount] = useState(initCount || 0);
  const decrement = () => setCount(count - 1);
  const increment = () => setCount(count + 1);
  return {
    count,
    decrement,
    increment
  };
};
const useCounterModal = createModel(useCounter, 10);
export default useCounterModal;

开发时候直接加载不动了,一直在转圈,把useCounterModal 那块注释掉就好了
hox: 1.1.14 react:16.13.1
webpack 配置了 externals

externals: {
        'react': 'React',
        'react-dom': 'ReactDOM',
    },

浏览器debugger 后发现 一直会进入handleError, 无限循环
image
image
发现res 没有打印了,reconciler.updateContainer(reactElement, container, null, null); 这一行内一直在执行中,貌似是react-reconciler 引起的问题

我也是。暂时
1,把external - react 去掉。
2,把src 指向 npm里的umd。

2选1,dev和prd都能测通。

但如果本地指向bootcdn的umd production确实就会卡。看了官方目前recoiler暂时也是experiment,不知道和他的自定义容器有没有关系。

补充一下,本地调试的话,如果 react 用的 cdn 引入,把 react 的 production 版本改成 development 版本就好了。
production 包里 React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED 没有 ReactDebugCurrentFrame 属性,导致了死循环