如何将动态导入用于redux‘action’来优化包大小

// 定义一个动态导入的函数，用于异步加载action模块
const importAction = (actionName) => import(`./actions/${actionName}`);

// 创建一个异步的action创建函数
const createAsyncAction = (actionName, payload) => {
  return async (dispatch) => {
    try {
      // 动态导入action模块
      const actionModule = await importAction(actionName);
      // 调用action模块中的函数创建action对象
      const action = actionModule.createAction(payload);
      // 分发action
      dispatch(action);
    } catch (error) {
      console.error('Failed to create action:', error);
    }
  };
};

// 在组件中使用异步的action创建函数
const MyComponent = () => {
  const dispatch = useDispatch();

  const handleClick = () => {
    // 异步创建action
    dispatch(createAsyncAction('myAction', { data: 'example' }));
  };

  return (
    <button onClick={handleClick}>Dispatch Action</button>
  );
};