프론트엔드

Flutter와 Firebase 연동 완벽 가이드: 'flutterfire' 명령어 오류부터 해결까지

Jin-Co 2025. 9. 25. 14:10
반응형

오늘은 많은 개발자들이 겪는 FlutterFire 연동 과정의 문제점과 해결 방법을 상세히 알려드리려고 합니다. 특히 'command not found'와 'Failed to fetch Firebase projects' 오류를 중심으로 살펴보겠습니다.

Flutter 프로젝트 생성 및 VS Code 연동

먼저 Flutter 프로젝트를 생성하고 VS Code와 연동하는 과정부터 시작해 보겠습니다.

Flutter 프로젝트 생성하기

  1. VS Code를 엽니다. 아직 설치하지 않았다면 VS Code 공식 사이트에서 다운로드 및 설치해 주세요.
  2. VS Code 확장(Extensions) 마켓플레이스에서 Flutter 및 Dart 확장 프로그램이 설치되어 있는지 확인합니다. 없다면 검색하여 설치해 주세요.
  3. Ctrl+Shift+P (macOS에서는 Cmd+Shift+P)를 눌러 명령 팔레트를 엽니다.
  4. flutter를 입력하고 "Flutter: New Project"를 선택합니다.
  5. 프로젝트 타입으로 "Application"을 선택합니다.
  6. 프로젝트를 저장할 디렉터리를 선택하고, 프로젝트 이름을 입력합니다. (예: my_firebase_app)
  7. 프로젝트 생성이 완료되면, VS Code가 새롭게 생성된 프로젝트 폴더를 자동으로 열어줄 것입니다.

2. Firebase 프로젝트 생성하기

Firebase와 연동하기 전에 먼저 Firebase 프로젝트를 생성해야 합니다.

  1. Firebase 공식 사이트에 접속하여 '시작하기'를 클릭합니다.
  2. 'Add project'(프로젝트 추가)를 선택합니다.
  3. 프로젝트 이름을 입력하고 Google 애널리틱스 설정 여부를 선택합니다.
  4. '계속'을 클릭하여 프로젝트 생성을 완료합니다.

3. FlutterFire CLI 설치 및 오류 해결하기

이제 본격적으로 FlutterFire CLI를 설치하고 자주 발생하는 오류들을 해결해 보겠습니다.

Firebase CLI 설치

먼저 Firebase CLI를 설치해야 합니다:

npm install -g firebase-tools

Node.js 버전 호환성 문제가 발생한다면, Windows 환경에서는 다음 단계에 따라 Node.js를 업데이트해 주세요:

  1. Node.js 공식 웹사이트에 접속하여 최신 LTS(Long Term Support) 버전의 Windows 설치 관리자(.msi) 파일을 다운로드합니다.
  2. 다운로드한 설치 파일을 실행하여 Node.js를 설치합니다. 설치 프로그램이 기존 버전을 자동으로 덮어쓰게 됩니다.
  3. 설치 완료 후, 터미널을 새로 열어 node -v 명령어로 업데이트된 Node.js 버전을 확인합니다.

FlutterFire CLI 설치

Firebase CLI 설치 후, FlutterFire CLI를 설치합니다:

dart pub global activate flutterfire_cli

'command not found' 오류 해결하기

설치 후 flutterfire 명령어를 실행했을 때 'command not found' 오류가 발생하는 경우가 많습니다. 이를 해결하기 위한 방법들 중 가장 효과적인 방법을 소개합니다.

해결 방법: dart pub global run 사용하기 (가장 권장)

PATH 설정이나 경로 문제로 고민하지 않고, 바로 다음 명령어를 사용하세요:

dart pub global run flutterfire_cli:flutterfire configure

이 명령어는 PATH 설정과 관계없이 직접 flutterfire_cli 패키지를 실행하므로, 대부분의 환경에서 작동합니다. 복잡한 설정 없이 바로 실행할 수 있어 가장 확실한 방법입니다.

다른 방법들 (시도했지만 효과가 없었던 방법들)

환경 변수 PATH를 추가하거나 직접 경로를 지정하는 방법도 있지만, 이러한 방법들은 종종 다양한 이유로 실패하는 경우가 많습니다:

  • 환경 변수 PATH 추가: Windows에서 시스템 환경 변수에 Pub Cache 경로를 추가해도 터미널 세션이 이를 인식하지 못하는 경우가 있습니다.
  • 직접 경로 지정: 전체 경로를 명시적으로 지정해도 경로 형식 문제나 권한 문제로 명령이 실행되지 않는 경우가 있습니다.

따라서 dart pub global run flutterfire_cli:flutterfire configure 명령어를 사용하는 것이 가장 안정적이고 확실한 방법입니다.

'Failed to fetch Firebase projects' 오류 해결하기

flutterfire 명령어는 실행되지만 'Failed to fetch Firebase projects' 오류가 발생한다면, Firebase 인증 문제일 가능성이 높습니다.

해결 방법:

먼저 Firebase에서 로그아웃합니다:

firebase logout

다시 로그인합니다:

firebase login

로그인이 성공적으로 완료되었는지 확인합니다:

firebase projects:list

이제 다시 FlutterFire 구성을 실행합니다:

dart pub global run flutterfire_cli:flutterfire configure

연결에 성공하면 아래처럼 프로젝트 선택 후 플랫폼 선택가능

4. Flutter 앱에 Firebase 설정 완료하기

FlutterFire 구성이 성공적으로 완료되면, 다음 단계를 진행합니다:

  1. 필요한 Firebase 패키지를 pubspec.yaml에 추가합니다: 
    dependencies:
  firebase_core: ^latest_version
  # 필요에 따라 다른 Firebase 패키지 추가
  2. lib/main.dart 파일에 Firebase 초기화 코드를 추가합니다: 
    import 'package:firebase_core/firebase_core.dart';
import 'firebase_options.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );
  runApp(MyApp());
}
  3. 패키지를 설치하고 앱을 실행합니다: 
    flutter pub get
flutter run

결론

Flutter와 Firebase 연동은 처음에는 여러 오류로 인해 어려울 수 있지만, 이 글에서 설명한 방법들을 차근차근 따라 하면 대부분의 문제를 해결할 수 있습니다. 특히 dart pub global run flutterfire_cli:flutterfire configure 명령어는 PATH 설정 문제를 우회하는 가장 확실한 방법입니다.

728x90
반응형
저작자표시 비영리 변경금지 (새창열림)