What's the difference between node_modules\@firebase and node_modules\firebase packages?

I'm working on my code splitting logic and I want to split firebase chunks.

So I'm logging out the module.context on my splitChunks configuration on webpack.config.ts

webpack.config.ts

optimization: {
  ...,
  splitChunks: {
    chunks: "all",
    cacheGroups: {
     firebase: {
       test: /[\\/]node_modules[\\/].*firebase/,
       name: (module: webpack.Module, chunks: webpack.Chunk[], cacheGroupKey: string) => {
         const { context } = module;
         console.log(context);
         return "firebase";
       }
     }
   }
 }
}

This what gets logged:

C:\PROJECT\node_modules\firebase\app\dist
C:\PROJECT\node_modules\firebase\auth\dist
C:\PROJECT\node_modules\firebase\firestore\dist
C:\PROJECT\node_modules\firebase\storage\dist
C:\PROJECT\node_modules\@firebase\auth\dist
C:\PROJECT\node_modules\@firebase\app\dist
C:\PROJECT\node_modules\@firebase\storage\dist
C:\PROJECT\node_modules\@firebase\firestore\dist\esm5
C:\PROJECT\node_modules\@firebase\firestore\dist\esm5
C:\PROJECT\node_modules\@firebase\util\dist
C:\PROJECT\node_modules\@firebase\component\dist
C:\PROJECT\node_modules\@firebase\logger\dist
C:\PROJECT\node_modules\@firebase\webchannel-wrapper\dist

What is the difference between the node_modules\firebase and the node_modules\@firebase packages?


I came up with the same question while working with SvelteKit. Here's a piece to the puzzle that helped my build:

It works but you have to change all "import {} from 'firebase/..'" to "import {} from '@firebase/..'". Internally the first import just does a "export * from '@firebase/..'".

For more info, see this link.

If my reading of the NPM docs is correct, node_modules@firebase/ is a scoped package of node_modules/firebase/