Anyone have an idea what this bug is about
The inferred type of authClient cannot be named without a reference to ../../../../node_modules/better-auth/dist/shared/better-auth.Bi8FQwDD . This is likely not portable. A type annotation is necessary.
I have added dom to tsconfig, cleared my node_modules and cache, updated to better-auth: ^1.2.4, as well.
This is what I am trying to do, example from docs
import { createAuthClient } from "better-auth/react";
export const authClient = createAuthClient({
baseURL: import.meta.env.VITE_API_BASE_URL,
});5 Replies
set
declaration:false in your tsconfigdoes not seem to change anything same issue
can you send your auth config?
import { useContext, createContext, useState, useEffect } from "react";
import { authClient } from "./lib/auth-client";
import { ReactNode } from "@tanstack/react-router";
export type getSession = Awaited<ReturnType<typeof authClient.getSession>>;
type googleSignIn = Awaited<ReturnType<typeof authClient.signIn.social>>;
type AuthContextType = {
session: getSession;
signIn: googleSignIn;
};
const AuthContext = createContext<AuthContextType | undefined>(undefined);
export const AuthProvider = ({ children }: { children: ReactNode }) => {
const [session, setSession] = useState<getSession | undefined>(undefined);
const [loading, setLoading] = useState(true);
useEffect(() => {
const fetchSession = async (): Promise<getSession> => {
try {
const data = await authClient.getSession();
if (data.data) {
console.log(data.data?.user);
setSession(data);
setLoading(false);
}
} catch (e) {
throw new Error("could not grab session");
} finally {
setLoading(false);
}
};
fetchSession();
}, []);
const googleSignIn = async () => {
await authClient.signIn.social({
provider: "google",
callbackURL: import.meta.env.VITE_APP_BASE_URL,
});
};
return (
<AuthContext.Provider value={{ session, signIn: googleSignIn }}>
{loading ? (
<div className="text-red border-1 border-white flex flex-row gap-2 items-center justify-center h-screen">
<div className="h-6 w-6 animate-spin rounded-full border-b-2 border-current" />
<div>Loading your data ...</div>
</div>
) : (
children
)}
</AuthContext.Provider>
);
};
export const useAuth = (): AuthContextType => {
const context = useContext(AuthContext);
if (!context) {
throw new Error("You need to provide an authentication context");
}
return context;
};
this? or the backend config?
"declarationMap": false as well, not only "declaration"