9장 369쪽 firebase

[parkJue]

이러한 오류가 뜨면서 실행이 안되네요
책에는 코드가 다른형식으로 나와있긴 한데 그것도 안됐습니다.
그래서 저자님이 깃허브에 올려주신 코드 복붙해서 실행해봤는데도 오류가 납니다.

[Alchemist85K]

에러 메시지 일부만 나타난것 같네요. 에러 메시지 나머지 부분에 다음과 같은 메시지가 있나요?

... this package itself specifies a 'main' module field that could not be resolved '.../index.cjs'. 

루트 경로에 metro.config.js 파일을 만들고, 다음과 같이 작성하세요.

const { getDefaultConfig } = require('@expo/metro-config');

const defaultConfig = getDefaultConfig(__dirname);

defaultConfig.resolver.assetExts.push('cjs');

module.exports = defaultConfig;

그리고 리액트 네이티브를 종료하고 다시 실행해 보세요.

https://docs.expo.dev/guides/customizing-metro/#adding-more-file-extensions-to--assetexts
https://github.com/Alchemist85K/my-first-react-native/blob/main/chapter09/react-native-simple-chat/metro.config.js

[parkJue]

감사합니다! 그런데
Android Bundling complete 3672ms
WARN AsyncStorage has been extracted from react-native core and will be removed in a future release. It can now be installed and imported from '@react-native-async-storage/async-storage' instead of 'react-native'. See https://github.com/react-native-async-storage/async-storage
이렇게 떠서 @react-native-async-storage/async-storage 이걸 설치하고 재실행 했는데도

로그인이 안되네요

[Alchemist85K]

복붙해주신 메시지는 스크린샷 에러와 연관이 없습니다.
메시지는, React Native에서 제공하던 AsyncStorage가 deprecated 되었고, 삭제될 예정이니, react-native-async-storage를 사용하라는 얘기입니다. 이 워닝 메시지는 firebase 라이브러리 내에서 React Native의 AsyncStorage를 사용하고 있어서 나타나는 메시지로, 따로 설치하실 필요가 없습니다.

스크린샷에 나타난 에러 메시지를 보니, login 함수를 firebase 라이브러리에서 import 해서 사용하고 계신것으로 보입니다.
firebase에는 login 함수가 없습니다.
코드를 전체적으로 확인해 보면서 import에 오타는 없는지,
함수를 호출하는 곳에서 잘못된 함수를 호출하고 있지는 않은지 확인해 보세요.

[parkJue]

감사합니다!! 해당 부분은 제가 변수 입력을 잘못한 것을 발견하고 고쳐서 잘 되는데,
회원가입을 할 때

이런 오류가 뜹니다

import {
  getAuth,
  signInWithEmailAndPassword,
  createUserWithEmailAndPassword,
} from "firebase/auth";
import config from "../../firebase.json";

export const app = initializeApp(config);
const auth = getAuth(app);

export const login = async ({ email, password }) => {
  const { user } = await signInWithEmailAndPassword(auth, email, password);
  return user;
};
const uploadImage = async (uri) => {
  const blob = await new Promise((resolve, reject) => {
    const xhr = new XMLHttpRequest();
    xhr.onload = function () {
      resolve(xhr.response);
    };
    xhr.onerror = function (e) {
      reject(new TypeError("Network request Failed"));
    };
    xhr.responseType = "blob";
    xhr.open("GET", uri, true);
    xhr.send(null);
  });
  const user = auth.currentUser;
  const ref = app.storage().ref(`/profile/${user.uid}/photo.png`);
  const snapshot = await ref.put(blob, { contentType: "image/png" });
  blob.close();
  return await snapshot.ref.getDownloadURL();
};
export const signup = async ({ name, email, password, photoUrl }) => {
  const { user } = await createUserWithEmailAndPassword(auth, email, password);
  const storageUrl = photoUrl.startsWith("https")
    ? photoUrl
    : await uploadImage(photoUrl);
  await user.updateProfile({ displayName: name, photoURL: storageUrl });

  return user;
};

firebase.js는 이렇게 작성하였습니다. startsWith는 그냥 함수인데 왜 실행안되는 걸까요..?
책의 코드 말고 저자님이 올려주신 깃허브 코드를 그대로 복사 붙여넣기해도 똑같이 실행이 안됩니다!
버튼 누르면 저러한 오류가 뜨긴 떠도 파이어베이스 인증에는 잘 넘어옵니다.

[Alchemist85K]

오타 확인해 보시기 바랍니다.
signup을 호출하는 곳에서 photoUrl을 잘못 넘기고 있을것 같네요

startsWith를 호출하기 전에 createUserWithEmailAndPassword 하고 있어서
계정 생성은 되는 것입니다.