I'm trying to use Firebase's Cloud Firestore from a preact-cli generated project but have been caught at the first hurdle. I chose Firebase's v9 SDK, that's in beta, to get ahead of the curve (but maybe that was a mistake). When building, there's an error from a Firebase SDK file but I'm not sure if it's caused by the SDK itself, babel, webpack, preact-cli or a combination. I also don't know how to go about diagnosing it, since I'm new to these tools.
Steps below, any ideas what the cause of this error might be?
npx preact-cli create typescript webapp
npm install --save firebase@9.0.0-beta.1
Then in src/components/app.tsx
, make use of the Firestore SDK by adding
import { getFirestore } from "firebase/firestore";
getFirestore();
But the build fails.
$ npm run build
> webapp@0.0.0 build
> preact build
Build [== ] 12% (1.3s) building(13200:6) switch-case fall-through not supported - added break. See https://github.com/MatAtBread/nodent#differences-from-the-es7-specification
[BABEL] Note: The code generator has deoptimised the styling of ../node_modules/@firebase/firestore/dist/exp/index.browser.esm2017.js as it exceeds the max of 500KB.
✖ ERROR ../node_modules/@firebase/firestore/dist/exp/index.browser.esm2017.js 5055:431
Module parse failed: Unsyntactic break (5055:431)
File was processed with these loaders:
* ../node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
(Source code omitted for this binary file)
@ ../node_modules/firebase/firestore/dist/index.esm.js 1:0-36 1:0-36
@ ./components/app.tsx
@ ./index.ts