我正在创建上下文来处理typescript应用程序中的身份验证。

/*-- Imports --*/

/*--  AuthContextType interface and defaults -- */

const AuthContext = createContext<AuthContextType>(contextDefaults);

export const useAuth = () => {
  return useContext(AuthContext);
};

interface AuthProviderProps {
  children: ReactNode;
}

const AuthProvider = ({ children }: AuthProviderProps) => {
  const [user, setUser] = useState<User | null>(null);

  const isLoggedIn = !!user;

  const login = (data: User) => {
    setUser(data);
  };

  const logout = () => {
    setUser(null);
  };

  return (
    <AuthContextType.Provider value={{ user, isLoggedIn, login, logout }}>
      {children}
    </AuthContextType.Provider>
  );
};

export default AuthProvider;

然后我用这个AuthProvider Package App;

/* --- imports ---*/

const App = () => {
  return (
      <AuthProvider>
        <div>App</div>
      </AuthProvider>
  );
};

export default App;

这段代码给出了错误，当我在JavaScript应用程序中编写相同的代码时，它工作正常。
AuthContext.ts错误

错误

任何帮助都将不胜感激。
谢谢