13
Help us understand the problem. What are the problem?

More than 5 years have passed since last update.

posted at

ionic frameworkで作ったアプリをherokuで公開する

簡単に出来ないものかと調べたら、かなり簡単に出来た。
社内デモなどに使える便利な配布方法かもしれない。

大変参考になったのは以下。
http://forum.ionicframework.com/t/has-anyone-deployed-an-ionic-app-to-heroku/8284/5

nodeのexpress frameworkを使用する。

/package.jsonexpressを加える。

{
  "name": "ionicSampleApp",
  "version": "1.0.0",
  "description": "App: An Ionic project",
  "dependencies": {
    "gulp": "^3.5.6",
    "gulp-sass": "^0.7.1",
    "gulp-concat": "^2.2.0",
    "gulp-minify-css": "^0.3.0",
    "gulp-rename": "^1.2.0",
    "express": "4.8.4"
  },
  "devDependencies": {
    "bower": "^1.3.3",
    "gulp-util": "^2.2.14",
    "shelljs": "^0.3.0"
  }
}

npmでexpressをインストール

npm install

ルートにweb.jsとか適当な名前でサーバー立ち上げるためのコードをおく。

var express = require('express');
var app = express();

app.use(express.static(__dirname + "/www"));
app.listen(process.env.PORT || 5000);

上記を使用してwebサーバー起動するよう記載したProcfileをアプリケーションルートにおく。

web: node web.js

これでforman startでサーバーが立ち上がるようになる。

あとはherokuにpushすればいい。

heroku create
git add .
git commit -m "Initial commit."
git push heroku master
heroku open

以上。

Register as a new user and use Qiita more conveniently

  1. You can follow users and tags
  2. you can stock useful information
  3. You can make editorial suggestions for articles
What you can do with signing up
13
Help us understand the problem. What are the problem?