APIを含むNuxt.jsをHerokuへデプロイ

Heroku 設定

//App作成, _ は使えないので注意
$ heroku create {name}

//共通で必要な環境変数設定
$ heroku config:set NPM_CONFIG_PRODUCTION=false
$ heroku config:set HOST=0.0.0.0
$ heroku config:set NODE_ENV=production

//AxiosのBaseURL
$ heroku config:set API_URL=$(heroku info -s | grep web_url | cut -d= -f2)

//mongodbをmlabで利用する場合
$heroku addons:create mongolab:sandbox

//.envをherokuへ反映
$ heroku plugins:install heroku-config   //install 
$ heroku config:push

設定ファイル修正

nuxt.config.js

//setBaseURL for Axios
var env = process.env.NODE_ENV || 'development';
if (env === 'development' || env === 'test') {
  var API_URL='http://localhost:3000'
}
else{
  var API_URL=process.env.API_URL
}
module.exports = {
・・・略・・
axios: {
    baseURL:API_URL
  },
・・・略・・

package.json に追記　"heroku-postbuild"

  "scripts": {
    "dev": "nuxt",
    ・・略・・
    "heroku-postbuild": "npm run build"　//追記
  },

git commit 後、Heroku へデプロイ

$ git add .
$ git commit -m " comment for heroku deploy"
$ git push heroku master

参考サイト

http://dackdive.hateblo.jp/entry/2016/01/26/121900
https://ja.nuxtjs.org/faq/heroku-deployment/