reactjs - 找不到模块导入路径

Question

我正在使用React上下文来全局处理用户身份验证。

我已经实现 了获取当前上下文的useAuth函数。AuthContext.ts当我尝试像在Auth.ts编译错误中一样使用它时，返回

以下错误：

./src/contexts/AuthContext.tsx 未找到模块：您尝试导入项目 src/ 目录之外的 ../../server/controller/firebaseConfig。不支持 src/ 之外的相对导入。

AuthContext：

import { auth } from '../../server/controller/firebaseConfig';
import { 
    createUserWithEmailAndPassword,
    signInWithEmailAndPassword,
    signInAnonymously,
    signInWithPopup,
    GoogleAuthProvider,
    FacebookAuthProvider,
    GithubAuthProvider,
    onAuthStateChanged,
    User
}
from 'firebase/auth';
import { createContext, useContext, useEffect, useState } from 'react';

const AuthContext = createContext({
    user : null as User|null,
    error : '',
    isPending : false,
    methods : {
        register : (email : string, password : string) => 
        createUserWithEmailAndPassword(auth,email,password),
        login : (email : string, password : string) => 
        signInWithEmailAndPassword(auth,email,password),
        signInAsGuest : () => signInAnonymously(auth),
        googleLogin : () => signInWithPopup(auth, new GoogleAuthProvider()),
        facebookLogin : () => signInWithPopup(auth, new FacebookAuthProvider()),
        githubLogin : () => signInWithPopup(auth, new GithubAuthProvider())
    }
});


export const useAuth = () => useContext(AuthContext);

Auth：

import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap-icons/font/bootstrap-icons.css';
import { useRef, useState } from 'react';
import { useAuth } from '../contexts/AuthContext';

export default function Authenticate() : JSX.Element {
    const { user, error, isPending, methods } = useAuth(); // error here

    const email = useRef() as React.MutableRefObject<HTMLInputElement>;
    const password = useRef() as React.MutableRefObject<HTMLInputElement>;
    const [show, setShow] = useState(false);

    return  <></>

}

很高兴有任何帮助

标签： reactjsreact-hooksreact-router