Closed
Description
[REQUIRED] Describe your environment
- Operating System version: OS X
- Browser version: doesn't matter - its compile time warnings
- Firebase SDK version: latest (8.3.0)
- Firebase Product: init, auth, firestore - everything really
[REQUIRED] Describe the problem
I set up a fresh preact project, import firebase and it immediately takes a sh*t. Here's the console log:
Compiled successfully!
You can view the application in browser.
Local: http://0.0.0.0:8080
On Your Network: http://10.196.35.140:8080
⚠ WARN ../node_modules/@firebase/component/dist/index.esm.js 242:26-39
"export '__spreadArray' was not found in 'tslib'
@ ../node_modules/@firebase/app/dist/index.esm.js
@ ../node_modules/firebase/app/dist/index.esm.js
@ ./components/app.js
@ ./index.js
@ ../node_modules/preact-cli/lib/lib/entry.js
⚠ WARN ../node_modules/@firebase/component/dist/index.esm.js 242:40-53
"export '__spreadArray' was not found in 'tslib'
@ ../node_modules/@firebase/app/dist/index.esm.js
@ ../node_modules/firebase/app/dist/index.esm.js
@ ./components/app.js
@ ./index.js
@ ../node_modules/preact-cli/lib/lib/entry.jsSteps to reproduce:
1. Environment Setup
# install preact-cli and create a project
$ npm install -g preact-cli
$ preact create default test
# add firebase
$ cd test
$ npm install --save firebase2. Initialize firebase in the app
Add the init to the main app component src/components/app.js
import { h } from 'preact';
import { Router } from 'preact-router';
import { useEffect } from 'preact/hooks';
import firebase from "firebase/app";
import Header from './header';
// Code-splitting is automated for `routes` directory
import Home from '../routes/home';
import Profile from '../routes/profile';
const App = () => {
// Initialize firebase
useEffect(() => firebase.initializeApp({
// Config goes here
}), [])
return <div id="app">
<Header />
<Router>
<Home path="/" />
<Profile path="/profile/" user="me" />
<Profile path="/profile/:user" />
</Router>
</div>
}
export default App;3. Give it a run
$ npm run devRelevant Code:
☝️See above
Notes
The project will still technically load in a browser until you do something meaty like import 'firebase/firestore'.
I'm pretty sure that the import issues are all related to this weird linking error I'm reporting, but I could be wrong.