部署Angular 2应用程序到Heroku

在过去，我总是将我的Angular 1和Rails应用程序捆绑在一起，通常使用heroku，这对我来说非常有用。 现在我已经结束了Angular 2，我想分离出我的Angular和Rails代码。 我已经通过Angular-Cli创build了一个非常基础的Angular 2应用程序，但我还没有弄清楚如何将它部署到Heroku。 我没有使用expressjs或类似的东西。 任何人都知道了吗？

Answer 1

好吧，我想出了一个解决scheme。 我不得不添加一个非常基本的PHP后端，但它是相当无害的。 以下是我的过程。

首先设置一个heroku应用程序和Angular 2应用程序。

1. 创build你的heroku应用程序
2. 将heroku buildpack设置为heroku / php
   • heroku buildpacks:set heroku/php --app heroku-app-name
3. 通过Angular-Cli创build一个项目

4. 用下面的代码片段添加一个index.php文件到/scr

   <?php include_once("index.html"); ?>

5. 使用下面的代码将一个Procfile添加到/scr

   web: vendor/bin/heroku-php-apache2

6. 添加/deploy到.gitignore

现在我用了一个npm包来把tarballs推到heroku上

1. 这里有一个简单的包来上传tar包， https://www.npmjs.com/package/heroku-deploy-tarball
   • npm i heroku-deploy-tarball --save
2. 我也使用tar.gz来创buildtarball
   • npm i tar.gz --save
3. 然后我用下面的代码在我的项目的根目录下创build了deploy.js文件。 我首先运行buildCommand指定，然后将index.php和configuration文件移动到dist文件夹。 然后，我打包整个dist文件夹，然后上传到heroku。

---

 var deploy = require('heroku-deploy-tarball'); var targz = require('tar.gz'); var exec = require('child_process').exec; var requestedTarget = process.argv[2]; if (!requestedTarget) { console.log('You must specify a deploy target'); return; } var targets = { production: { app: 'heroku-app-name', tarball: 'deploy/build.tar.gz', buildCommand: 'ng build --prod' } } var moveCompressFiles = function (callback) { exec('cp ./src/index.php ./dist/index.php', function(err) { if(err) console.log(err); console.log('index.php was copied.'); }); exec('cp ./src/Procfile ./dist/Procfile', function(err) { if(err) console.log(err); console.log('Procfile was copied.'); }); new targz().compress('./dist', './deploy/build.tar.gz', function(err){ if(err) console.log(err); else callback(); console.log('The compression has ended!'); }); }; console.log('Starting ' + targets[requestedTarget].buildCommand); exec(targets[requestedTarget].buildCommand, {maxBuffer: 1024 * 500}, function(error) { if (!error) { console.log(targets[requestedTarget].buildCommand + ' successful!'); moveCompressFiles(function () { deploy(targets[requestedTarget]); }); } else { console.log(targets[requestedTarget].buildCommand + ' failed.', error); } }); 

4. 现在只需运行node deploy production ，它应该部署到heroku。

---

编辑

刚从heroku得到的消息是，他们正在研究一个实验性的buildpack，可以让这样的静态网站。 这是链接到构build包。