Firebase/firestore issue

⚠️ IMPORTANT ⚠️ Please check the following list before proceeding. If you ignore this issue template, your issue will be directly closed.

• Read the docs.
• Use Vite >=2.0. (1.x is no longer supported)
• If the issue is related to 1.x -> 2.0 upgrade, read the Migration Guide first.

Describe the bug

When trying to use Firebase 8.2.3 I get this error:

[plugin:vite:import-analysis] Deep import "firebase/app" should be avoided because dependency "firebase" has been pre-optimized. Prefer importing directly from the module entry:

import { ... } from "firebase"

If the used import is not exported from the package's main entry and can only be attained via deep import, you can explicitly add the deep import path to "optimizeDeps.include" in vite.config.js.

I searched the issues and found related issues to firebase auth, but I’m not including firebase auth, only firestore.

Reproduction

Just add this anywhere:

import Firebase from 'firebase/app'
import 'firebase/firestore'

System Info

• vite version: ^2.0.0-beta.29
• Operating System: macOS Big Sur
• Node version: 15.5
• Package manager (npm/yarn/pnpm) and version: npm

Question

When the error says add the deep import path to "optimizeDeps.include" in vite.config.js. how can I know what the “deep import path” is?

Thanks a lot!!

[mesqueeb]

it worked when I did this in vite.config.ts

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

export default defineConfig({
  optimizeDeps: { include: ['firebase/app', 'firebase/firestore'] },
  plugins: [vue()]
})

[yyx990803]

It’s no longer needed in most cases.