Adam
Adam

Reputation: 53

Deploying app based on Polymer starter kit

Prior to Polymer 1.0, I was using python simple http server and/or apache. When I came across the starter kit app, I started using the built in browsersync, through gulp serve.

Is that appropriate for hosting on Heroku?

I added:

"scripts": {
  "start": "gulp serve:dist"
},

to my package.json, and it attempts to run. When I try to load the page, I get:

heroku[router]: at=error code=H10 desc="App crashed" method=GET

Heroku's guides are based on traditional node apps, and the Procfile or "script" in package.json, is typically just node app.js.

I feel like I'm missing something trivial. Any help would be greatly appreciated!

Upvotes: 2

Views: 2369

Answers (2)

Adam
Adam

Reputation: 53

I revisited this recently. I found a pretty simple solution. I added a "serve.js" (name not important) Contents:

var express = require('express');
var app = express();
app.use(express.static("" + __dirname + "/dist"));
app.listen(process.env.PORT || 5000);

Then, within my package.json file I added:

"scripts": {
   "start": "node serve.js",
   "postinstall": "bower install && gulp"
},

The node serve.js could also be in the Procfile. Heroku should recognize and use it either way. postinstall is used to get bower components, and run the default gulp build task. https://devcenter.heroku.com/articles/nodejs-support

Upvotes: 2

Robert Rowntree
Robert Rowntree

Reputation: 6289

if you are running gulp.vulcanize like in the 'serve:dist' task in your sample app, and also are looking to host the ./dist folder then heroku is NOT a good idea. H has no buildpack to accept a flat folder like the vulcainzed ./dist and to simply host it with nginx / apache.

buildpack list has nothing 4 polymer, although using a node wrapper appears to be an option with Heroku/polymer. IMO this is not the best because the node layer is extra cruft when trying to simply push that ./dist folder to the web.

There are hacks to make it work on H (links below) or by using the Heroku API to simply push a folder, but IMO you could do alot better.

I would look hard at alts like AWS or to github pages B4 heroku. Note that i quickly tried github pages using the ./dist folder and using

var ghpages = require('gh-pages');
...
gulp.task('deploy', ['default'], function(cb) {
    ghpages.publish(path.join(process.cwd(), 'dist'), cb);
});

on github and it FAILED due to some router issues with #! links. So i decided to just push an unvulcanized version to the web. ( not the best )

Be certain that you can host ./dist locally WITHOUT using the 'gulp.serve' task before deciding to push the ./dist folder somewhere on the web. You may see options for pushing 'gulp.serve' and npm with your project but it makes NO sense to me to include all that extra cruft when vulcanize is trying so hard to just produce that ./dist folder!

Be certain in stdout that the vulcanize task is actually finishing....

[15:59:59] Starting 'vulcanize'...
[16:00:00] 'vulcanize' all files 436.07 kB
[16:00:00] Finished 'vulcanize' after 1.14 s

Depending on how you extend the starter kit, 'vulcanize' can fail pretty silently so that you go on to other matters with hosting the ./dist folder without realizing that 'vulcanize' failed.

Is it possible to upload a simple html and javascript file structure to heroku?

https://www.npmjs.com/package/gulp-gh-pages

How to deploy node app that uses grunt to heroku

http://www.sitepoint.com/deploying-heroku-using-gulp-node-git/

Upvotes: 0

Related Questions