Step 1: Install Firebase CLI
- Open your terminal and install Firebase CLI globally:
npm install -g firebase-tools
- Verify the installation:
firebase --version
Step 2: Log in to Firebase
- Log in to your Firebase account:
- firebase login
Follow the instructions in your browser to complete the authentication.
Step 3: Initialize Firebase Hosting
Navigate to your project folder:
cd your-project-folder
Initialize Firebase Hosting:
firebase init
- Follow the prompts:
- Select Features: Use arrow keys to select Hosting: Configure files for Firebase Hosting (press space to select, then press enter).
- Select Project: Choose an existing Firebase project or create a new one.
- Public Directory: Enter the folder containing your built files (e.g., dist or build).
- Single-Page App: Choose Yes for "Configure as a single-page app."
- Overwrite Files: Choose No if it asks to overwrite index.html. Step 4: Build Your Project If your project requires building (e.g., React or Vue), run:
npm run build
Ensure the output folder (e.g., dist or build) contains the production-ready files.
**
Step 5: Deploy Your Project**
Deploy the project to Firebase Hosting:
firebase deploy
- Once deployed, Firebase will provide a live URL for your project. Step 6: Update and Redeploy
Make changes to your project locally.
Build your project again:
**
npm run build
**
- Deploy the updated project:
firebase deploy
Step 7: Debugging Common Issues
Incorrect Public Directory: Ensure the folder specified during initialization contains your index.html.
Cache Issues: Clear your browser cache and hard reload the page.
Error Logs: Check deployment logs in the terminal for debugging.
Congratulations! Your project is now live on Firebase Hosting. 🎉
Top comments (0)