Firebase Storage Not working in Express Server Environment

Question

I am currently building an app and am trying to test the production server environment I created using Express. The application works fine when served via webpack-dev-server, but when my Express server.js is bundled by webpack, and node server.bundle.js is run I get the following error regarding Firebase storage.

/Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp/server.bundle.js:533
  var storage = _firebaseConfig2.default.storage();
                                         ^

TypeError: _firebaseConfig2.default.storage is not a function

Node ends up just switching to running my dev environment.

Below are my package.json containing my dependencies and npm scripts followed by the log from my terminal.

All google/stackoverflow searching I did on '_firebaseConfig2.default.storage is not a function' turned up just about nothing.

Package.json

{
  "name": "mtbparks-member-app",
  "version": "0.1.0",
  "main": "index.html",
  "scripts": {
    "start": "if-env NODE_ENV=production && npm run start:prod || npm run start:dev",
    "start:dev": "webpack-dev-server --inline --content-base build/ --history-api-fallback && postcss --use autoprefixer -d build src/styles.css",
    "start:prod": "npm run build && node server.bundle.js",
    "build:client": "webpack && postcss --use autoprefixer -d build src/styles.css",
    "build:server": "webpack --config webpack.server.config.js",
    "build": "npm run build:client && npm run build:server",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "license": "ISC",
  "devDependencies": {
    "autoprefixer": "^6.3.6",
    "babel-core": "^6.8.0",
    "babel-loader": "^6.2.4",
    "babel-polyfill": "^6.9.0",
    "babel-preset-es2015": "^6.6.0",
    "babel-preset-react": "^6.5.0",
    "eslint": "^2.9.0",
    "eslint-loader": "^1.3.0",
    "eslint-plugin-react": "^5.1.1",
    "http-server": "^0.9.0",
    "postcss-cli": "^2.5.2",
    "postcss-loader": "^0.9.1",
    "webpack": "^1.13.0",
    "webpack-dev-server": "^1.14.1"
  },
  "dependencies": {
    "compression": "^1.6.2",
    "express": "^4.13.4",
    "firebase": "3.0.2",
    "foundation-sites": "^6.2.1",
    "if-env": "^1.0.0",
    "re-base": "^1.5.1",
    "react": "^15.0.2",
    "react-dom": "^15.0.2",
    "react-router": "^2.4.0"
  }
}

Logs

=> NODE_ENV=production npm start

> mtbparks-member-app@0.1.0 start /Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp
> if-env NODE_ENV=production && npm run start:prod || npm run start:dev


> mtbparks-member-app@0.1.0 start:prod /Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp
> npm run build && node server.bundle.js


> mtbparks-member-app@0.1.0 build /Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp
> npm run build:client && npm run build:server


> mtbparks-member-app@0.1.0 build:client /Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp
> webpack && postcss --use autoprefixer -d build src/styles.css

Hash: cf9ca8bbc1315fc1c9db
Version: webpack 1.13.0
Time: 14624ms
        Asset     Size  Chunks             Chunk Names
    bundle.js   855 kB       0  [emitted]  main
bundle.js.map  4.59 MB       0  [emitted]  main
   [0] multi main 40 bytes {0} [built]
    + 538 hidden modules

> mtbparks-member-app@0.1.0 build:server /Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp
> webpack --config webpack.server.config.js

Hash: 4561926734ef8e1e5a47
Version: webpack 1.13.0
Time: 973ms
           Asset     Size  Chunks             Chunk Names
server.bundle.js  27.6 kB       0  [emitted]  main
   [0] multi main 40 bytes {0} [built]
    + 17 hidden modules
/Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp/server.bundle.js:533
  var storage = _firebaseConfig2.default.storage();
                                         ^

TypeError: _firebaseConfig2.default.storage is not a function
    at Object.defineProperty.value (/Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp/server.bundle.js:533:41)
    at __webpack_require__ (/Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp/server.bundle.js:20:30)
    at Object.defineProperty.value (/Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp/server.bundle.js:179:14)
    at __webpack_require__ (/Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp/server.bundle.js:20:30)
    at Object.<anonymous> (/Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp/server.bundle.js:83:16)
    at Object.<anonymous> (/Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp/server.bundle.js:121:31)
    at __webpack_require__ (/Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp/server.bundle.js:20:30)
    at Object.<anonymous> (/Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp/server.bundle.js:48:19)
    at __webpack_require__ (/Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp/server.bundle.js:20:30)
    at /Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp/server.bundle.js:40:18

npm ERR! Darwin 14.5.0
npm ERR! argv "/Users/palcisto/.nvm/versions/node/v5.11.1/bin/node" "/Users/palcisto/.nvm/versions/node/v5.11.1/bin/npm" "run" "start:prod"
npm ERR! node v5.11.1
npm ERR! npm  v3.8.6
npm ERR! code ELIFECYCLE
npm ERR! mtbparks-member-app@0.1.0 start:prod: `npm run build && node server.bundle.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the mtbparks-member-app@0.1.0 start:prod script 'npm run build && node server.bundle.js'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the mtbparks-member-app package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     npm run build && node server.bundle.js
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs mtbparks-member-app
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls mtbparks-member-app
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp/npm-debug.log

> mtbparks-member-app@0.1.0 start:dev /Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp
> webpack-dev-server --inline --content-base build/ --history-api-fallback && postcss --use autoprefixer -d build src/styles.css

http://localhost:8080/
webpack result is served from /
content is served from /Users/palcisto/Sites/sandbox/MTBparks/MTBparksMemberApp/build
404s will fallback to /index.html
Hash: e38d4972b9458e39b46c
Version: webpack 1.13.0
Time: 16461ms
        Asset     Size  Chunks             Chunk Names
    bundle.js   928 kB       0  [emitted]  main
bundle.js.map  5.17 MB       0  [emitted]  main

Answer 1

Firebase Storage dev here:

Firebase Storage is currently browser JS only. Since Google Cloud Storage already provides a number of high quality client libraries, we didn't want to reimplement another--we recommend using the GCloud-Node library for this type of development. You can use this with your existing storage bucket and the typical Firebase Server development setup instructions.

Answer 2

Agree, this seems to be against the whole purpose of Firebase. On the one hand the offical doco in places says "...for some features of Firebase Node.JS is required..." (or similar) and yet in this case we can't use Node.JS.