Deploying to Heroku with Webpack - reactjs

Question

Hy guys. So, until now I have been doing it like this. Using webpack to make a bundle file, pushing code to github and deploying to Heroku. For this to work I had to push the bundle file to github.
Now, I would like to run webpack on Heroku. The thing is I have dependencies and devDependencies inside my package.json and if I want to run webpack on Heroku I need to install both. To do this I have to move a lot of devDependencies to dependencie so Heroku can install it and run webpack.
What is the best way to do this?
1) If I move all devDepend to dependencies and let Heroku make build file can I somehow clean and remove all unnecessary devDependencies afterwards?
2) Is there a way to do it without changing my package.json or setting set NPM_CONFIG_PRODUCTION=false and disabling production environment?
3) How would npm script look like to do this?
4) All in all what would be a best performance optimized way to push to Heroku ?
This is my package.json file
"scripts": {
"clean-client": "rm -rf ./src/dist",
"clean-server": "rm -rf ./src/build",
"build-server": "babel src/server -d src/build -s --copy-files",
"build-client": "webpack -p --config webpack.config.prod.babel.js",
"start": "set \"NODE_ENV=production\" && npm run build-server && npm run build-client && node ./src/build/index.js",
"start-dev": "set \"NODE_ENV=development\" && nodemon ./start-dev.js",
"webpack": "webpack -w --config webpack.config.babel.js",
"flow": "./node_modules/.bin/flow check",
"test": "set \"NODE_ENV=test\" && babel-tape-runner -r \"test/setup.js\" \"test/**/*.test.jsx\" | node_modules/.bin/tap-spec",
"coverage": "babel-node node_modules/babel-istanbul/lib/cli.js cover node_modules/babel-tape-runner/bin/babel-tape-runner -- \"test/setup.js\" -- \"test/**/*.test.jsx\""
},
"dependencies": {
"babel-plugin-react-css-modules": "2.7.0",
"babel-runtime": "^6.23.0",
"ejs": "^2.5.6",
"express": "^4.15.2",
"prop-types": "^15.5.8",
"react": "15.5.4",
"react-dom": "15.5.4",
"react-router": "3.0.4"
},
"devDependencies": {
"babel-cli": "^6.24.1",
"babel-core": "^6.24.1",
"babel-eslint": "^7.2.3",
"babel-istanbul": "^0.12.2",
"babel-loader": "^7.0.0",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-plugin-webpack-alias": "^2.1.2",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"babel-register": "^6.24.1",
"babel-tape-runner": "^2.0.1",
"bootstrap": "v4.0.0-alpha.6",
"browser-sync": "^2.18.8",
"browser-sync-webpack-plugin": "^1.1.4",
"css-loader": "0.28.0",
"enzyme": "^2.8.2",
"eslint": "^3.18.0",
"eslint-config-standard": "^10.2.1",
"eslint-plugin-flowtype": "^2.32.1",
"eslint-plugin-react": "^6.10.3",
"extract-text-webpack-plugin": "^2.1.0",
"flow-bin": "^0.45.0",
"ignore-styles": "^5.0.1",
"jquery": "^3.2.1",
"jsdom": "^10.1.0",
"jsdom-global": "^3.0.2",
"node-sass": "^4.5.2",
"nodemon": "^1.11.0",
"postcss": "^6.0.1",
"postcss-cssnext": "2.10.0",
"postcss-loader": "^2.0.5",
"postcss-scss": "^1.0.0",
"react-test-renderer": "^15.5.4",
"sass-loader": "^6.0.3",
"sass-resources-loader": "^1.2.1",
"script-loader": "^0.7.0",
"sinon": "^2.2.0",
"sinon-test": "^1.0.2",
"snazzy": "^7.0.0",
"standard": "^10.0.2",
"style-loader": "^0.17.0",
"tap-spec": "^4.1.1",
"tape": "^4.6.3",
"tether": "^1.4.0",
"webpack": "^2.4.1"

Answer 1

Per this guide you must set NPM_CONFIG_PRODUCTION to "false" and NODE_ENV to "development" in order for the devDependencies to be installed using npm install. If you are not using Heroku's Review Apps as the guide is, I believe you can set these environment variables via your apps dashboard.
Disclosure: I wrote the guide.

Answer 2

The question is a bit old but hope my notice could help someone. This is an alternative to the previous suggested solution (didn't try).
To build your project directly on heroku, just add the build script to your package.json file.
"scripts": {
"build": "webpack --config webpack.config.js",
},
I have a lot of devDevependecies including webpack-cli which i don't install globally. Before adding the script i have to build the project and push, after adding I noticed heroku just run it automatically and the output of the process was the same as on local machine. The key here is probably the build keyword !!!