1. ta1nakamura

    Posted

    ta1nakamura
Changes in title
+APIを含むNuxt.jsをHerokuへデプロイ
Changes in tags
Changes in body
Source | HTML | Preview
@@ -0,0 +1,60 @@
+# 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)
+
+//.envをherokuへ反映
+$ heroku plugins:install heroku-config //install
+$ heroku config:push
+
+```
+
+#設定ファイル修正
+nuxt.config.js
+
+```javascript
+
+//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"
+
+```json
+ "scripts": {
+ "dev": "nuxt",
+ ・・略・・
+ "heroku-postbuild": "npm run build" //追記
+ },
+```
+# git commit 後、Heroku へデプロイ
+```shell
+$ 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/
+