Tips for Heroku Deployment?

[andrewmartin]

I love this setup, so much. Really nice work.

I'm having some major issues (spent a long time tonight) trying to get this deployed on Heroku. I've tried a lot of variations of methods to get around the build cycles––the main issue is the long timeout that happens on initial build.

My latest effort was to move the serverListen out of the webpackTools callback, and the app boots, but I basically get an endless loop of:

2017-06-16T09:42:22.696418+00:00 app[web.1]: [webpack-isomorphic-tools] (waiting for the first Webpack build to finish)
2017-06-16T09:42:24.800410+00:00 app[web.1]: [webpack-isomorphic-tools] (waiting for the first Webpack build to finish)
2017-06-16T09:42:26.908165+00:00 app[web.1]: [webpack-isomorphic-tools] (waiting for the first Webpack build to finish)
2017-06-16T09:42:29.013066+00:00 app[web.1]: [webpack-isomorphic-tools] (waiting for the first Webpack build to finish)
2017-06-16T09:42:31.116643+00:00 app[web.1]: [webpack-isomorphic-tools] (waiting for the first Webpack build to finish)
2017-06-16T09:42:33.220917+00:00 app[web.1]: [webpack-isomorphic-tools] (waiting for the first Webpack build to finish)
2017-06-16T09:42:35.325526+00:00 app[web.1]: [webpack-isomorphic-tools] (waiting for the first Webpack build to finish)
2017-06-16T09:42:37.429448+00:00 app[web.1]: [webpack-isomorphic-tools] (waiting for the first Webpack build to finish)

Any ideas or suggestions on how to get this guy deployed on Heroku? Or other hosts you might recommend? I want to get my code out :)

Thanks so much for all your work on this. It's really quite tremendous.

[CrocoDillon]

Thank you for your kind words! :)

I don't know anything Heroku specific but I suggest trying to deploy a production build. There are some scripts to get a production build

Then you just need to deploy the lib (for SSR) and dist (client bundle etc.) folders

[andrewmartin]

@CrocoDillon

So, I did that actually, I have both lib and dist built and committed. I won't take up much more of your time, but curious if this means anything to you:

2017-06-16T09:58:26.616291+00:00 app[web.1]:   /app/src/modules/Helmet/index.js:1
2017-06-16T09:58:26.616293+00:00 app[web.1]:   (function (exports, require, module, __filename, __dirname) { import React from 'react'
2017-06-16T09:58:26.616294+00:00 app[web.1]:                                                                 ^^^^^^
2017-06-16T09:58:26.616295+00:00 app[web.1]:   SyntaxError: Unexpected token import
2017-06-16T09:58:26.616295+00:00 app[web.1]:       at createScript (vm.js:56:10)
2017-06-16T09:58:26.616296+00:00 app[web.1]:       at Object.runInThisContext (vm.js:97:10)
2017-06-16T09:58:26.616297+00:00 app[web.1]:       at Module._compile (module.js:542:28)
2017-06-16T09:58:26.616297+00:00 app[web.1]:       at Object.Module._extensions..js (module.js:579:10)
2017-06-16T09:58:26.616298+00:00 app[web.1]:       at Module.load (module.js:487:32)
2017-06-16T09:58:26.616299+00:00 app[web.1]:       at tryModuleLoad (module.js:446:12)
2017-06-16T09:58:26.616299+00:00 app[web.1]:       at Function.Module._load (module.js:438:3)
2017-06-16T09:58:26.616300+00:00 app[web.1]:       at Module.require (module.js:497:17)
2017-06-16T09:58:26.616300+00:00 app[web.1]:       at require (internal/module.js:20:19)
2017-06-16T09:58:26.616301+00:00 app[web.1]:       at Object.<anonymous> (/app/lib/modules/App/App.js:13:15)
2017-06-16T09:58:26.616351+00:00 app[web.1]: 

Strangely, it looks like the SSR portion is using babel or something?

[andrewmartin]

@CrocoDillon

Just wanted to follow up (and close) this issue.

Turns out, I was trying to overengineer things and in my attempt to use module-alias to shorthand my imports, it created a ton of overhead I wasn't expecting.

I ended up dropping out that package, and though I'm using a bunch of semi-ugly import ../../../ type statements, at least it's building now :)

Lesson learned: don't try to use module-alias with isomorphic apps, unless you want to create a ton of nightmareish trace stack errors trying to configure and build your application for production. If you have any tips on how to integrate, I'd love to hear them, but I don't mind these import statements for now.

Closing, thanks again for your work on this.

[CrocoDillon]

Oh I feel the pain with the ugly imports...

I haven't used them myself but I suggest trying a Babel plugin for that so you don't have to worry about any impact in production.

babel-plugin-module-alias or babel-plugin-webpack-alias

[andrewmartin]

Ahh, ha. Too late now :) but I’ll consider this next time around…

On Jun 17, 2017, at 1:05 AM, Dillon de Voor notifications@github.com wrote:

Oh I feel the pain with the ugly imports...

I haven't used them myself but I suggest trying a Babel plugin for that so you don't have to worry about any impact in production.

babel-plugin-module-alias https://www.npmjs.com/package/babel-plugin-module-alias or babel-plugin-webpack-alias https://www.npmjs.com/package/babel-plugin-webpack-alias — You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub https://github.com/CrocoDillon/universal-react-redux-boilerplate/issues/27#issuecomment-309200746, or mute the thread https://github.com/notifications/unsubscribe-auth/AAQtsswKQPgxq_JtGXzi_speqGHXvkEmks5sE4jLgaJpZM4N8P6-.