webpack import firebase not working - npm

Question

I'm having an issue getting firebase 3.0.1 to work. I have a feeling it's in regards to my webpack setup. My files are below. When running my app with webpack dev server I get the error:
Uncaught TypeError: firebase.initializeApp is not a function
The interesting thing is that if I put a debugger; or breakpoint after var firebase = require('firebase'); it seems to be an empty object.
webpack.config.js
const webpack = require("webpack");
module.exports = {
entry: './src/index.js',
output: {
path: 'public',
filename: 'bundle.js'
},
module: {
loaders: [{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader?presets[]=es2015&presets[]=react'
}]
},
plugins: process.env.NODE_ENV === 'production' ? [
new webpack.optimize.DedupePlugin(),
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.optimize.UglifyJsPlugin()
] : []
};
package.json
{
"name": "burn",
"version": "1.0.0",
"description": "burn messaging",
"main": "index.js",
"scripts": {
"start": "if-env NODE_ENV=production && npm run start:prod || npm run start:dev",
"start:dev": "webpack-dev-server --inline --content-base public --history-api-fallback",
"start:prod": "webpack && firebase deploy"
},
"author": "James Gilchrist <james#burn.today>",
"license": "ISC",
"dependencies": {
"compression": "^1.6.2",
"express": "^4.13.4",
"firebase": "^3.0.1",
"if-env": "^1.0.0",
"react": "^15.0.2",
"react-dom": "^15.0.2",
"react-router": "^2.4.0"
},
"devDependencies": {
"babel-core": "^6.9.0",
"babel-loader": "^6.2.4",
"babel-preset-es2015": "^6.9.0",
"babel-preset-react": "^6.5.0",
"webpack": "^1.13.0",
"webpack-dev-server": "^1.14.1"
}
}
index.js
var firebase = require('firebase');
var config = {
apiKey: "AIzaSyA9gUmSBu4SZ4P9H_4lXuN1ouD_GBKq3aw",
authDomain: "burn-56840.firebaseapp.com",
databaseURL: "https://burn-56840.firebaseio.com",
storageBucket: "burn-56840.appspot.com"
};
firebase.initializeApp(config);

Answer 1

I had the same problem, there's a simple fix though:
var firebase = require('firebase/app');
This way you get the "real" firebase module. However you must now require each module you'll need so it loads correctly, like so:
var firebase = require('firebase/app');
// all 3 are optional and you only need to require them at the start
require('firebase/auth');
require('firebase/database');
require('firebase/storage');
It seems to me that something is wrong with the current initialisation code, looking at the source it should work; but then again, somewhat like you, I'm using browserify, and haven't tested outside of it, so it might be related.