无法将firebase导入React

Question

I used npm i firebase to install Firebase, then I used import * as firebase from "firebase" to import Firebase to my .jsx file, however I always get this error :

'fs' is imported by node_modules/firebase/node_modules/dom-storage/lib/index.js, but could not be resolved – treating it as an external dependency
'fs' is imported by commonjs-external:fs, but could not be resolved – treating it as an external dependency
'url' is imported by node_modules/firebase/node_modules/xmlhttprequest/lib/XMLHttpRequest.js, but could not be resolved – treating it as an external dependency
'child_process' is imported by node_modules/firebase/node_modules/xmlhttprequest/lib/XMLHttpRequest.js, but could not be resolved – treating it as an external dependency
'fs' is imported by node_modules/firebase/node_modules/xmlhttprequest/lib/XMLHttpRequest.js, but could not be resolved – treating it as an external dependency
'http' is imported by node_modules/firebase/node_modules/xmlhttprequest/lib/XMLHttpRequest.js, but could not be resolved – treating it as an external dependency
'https' is imported by node_modules/firebase/node_modules/xmlhttprequest/lib/XMLHttpRequest.js, but could not be resolved – treating it as an external dependency
'url' is imported by commonjs-external:url, but could not be resolved – treating it as an external dependency
'child_process' is imported by commonjs-external:child_process, but could not be resolved – treating it as an external dependency
'http' is imported by commonjs-external:http, but could not be resolved – treating it as an external dependency
'https' is imported by commonjs-external:https, but could not be resolved – treating it as an external dependency
'fs' is imported by node_modules/firebase/server-auth-node/token-generator.js, but could not be resolved – treating it as an external dependency
'https' is imported by node_modules/firebase/server-auth-node/token-generator.js, but could not be resolved – treating it as an external dependency
'buffer' is imported by node_modules/firebase/node_modules/safe-buffer/index.js, but could not be resolved – treating it as an external dependency
'buffer' is imported by commonjs-external:buffer, but could not be resolved – treating it as an external dependency
'stream' is imported by node_modules/firebase/node_modules/jws/lib/data-stream.js, but could not be resolved – treating it as an external dependency
'util' is imported by node_modules/firebase/node_modules/jws/lib/data-stream.js, but could not be resolved – treating it as an external dependency
'stream' is imported by commonjs-external:stream, but could not be resolved – treating it as an external dependency
'util' is imported by commonjs-external:util, but could not be resolved – treating it as an external dependency
'buffer' is imported by node_modules/firebase/node_modules/buffer-equal-constant-time/index.js, but could not be resolved – treating it as an external dependency
'crypto' is imported by node_modules/firebase/node_modules/jwa/index.js, but could not be resolved – treating it as an external dependency
'util' is imported by node_modules/firebase/node_modules/jwa/index.js, but could not be resolved – treating it as an external dependency
'crypto' is imported by commonjs-external:crypto, but could not be resolved – treating it as an external dependency
'stream' is imported by node_modules/firebase/node_modules/jws/lib/sign-stream.js, but could not be resolved – treating it as an external dependency
'buffer' is imported by node_modules/firebase/node_modules/jws/lib/tostring.js, but could not be resolved – treating it as an external dependency
'util' is imported by node_modules/firebase/node_modules/jws/lib/sign-stream.js, but could not be resolved – treating it as an external dependency
'stream' is imported by node_modules/firebase/node_modules/jws/lib/verify-stream.js, but could not be resolved – treating it as an external dependency
'util' is imported by node_modules/firebase/node_modules/jws/lib/verify-stream.js, but could not be resolved – treating it as an external dependency
'crypto' is imported by node_modules/firebase/node_modules/hoek/lib/index.js, but could not be resolved – treating it as an external dependency
'path' is imported by node_modules/firebase/node_modules/hoek/lib/index.js, but could not be resolved – treating it as an external dependency
'util' is imported by node_modules/firebase/node_modules/hoek/lib/index.js, but could not be resolved – treating it as an external dependency
'path' is imported by commonjs-external:path, but could not be resolved – treating it as an external dependency
'net' is imported by node_modules/firebase/node_modules/joi/lib/string.js, but could not be resolved – treating it as an external dependency
'dns' is imported by node_modules/firebase/node_modules/isemail/lib/isemail.js, but could not be resolved – treating it as an external dependency
'dns' is imported by commonjs-external:dns, but could not be resolved – treating it as an external dependency
'net' is imported by commonjs-external:net, but could not be resolved – treating it as an external dependency
'fs' is imported by node_modules/firebase/server-auth-node/auth.js, but could not be resolved – treating it as an external dependency
'https' is imported by node_modules/firebase/server-auth-node/credential.js, but could not be resolved – treating it as an external dependency
events.js:141
      throw er; // Unhandled 'error' event
      ^

Error: Could not resolve '_stream_writable' from /Users/Steve/node_modules/firebase/database-node.js
    at Error (native)
    at /Users/Steve/node_modules/rollup-plugin-node-resolve/dist/rollup-plugin-node-resolve.cjs.js:78:21
    at /Users/Steve/Code/node_modules/resolve/lib/async.js:47:14
    at process (/Users/Steve/node_modules/resolve/lib/async.js:174:43)
    at ondir (/Users/Steve/node_modules/resolve/lib/async.js:189:17)
    at load (/Users/Steve/node_modules/resolve/lib/async.js:70:43)
    at onex (/Users/Steve/node_modules/resolve/lib/async.js:93:31)
    at /Users/Steve/node_modules/resolve/lib/async.js:23:47

How can I resolve this error? Thank you!

Answer 1

I've got firebase locally installed and that's how I import it.

It has always worked for my projects.

If that doesn't work, check your npm config path or your node_modules location.

import firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/firestore';