質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

npm

npmは、Node Packaged Modulesの略。Node.jsのライブラリ・パッケージを管理できるツールです。様々なモジュールを簡単にインストールでき、自分でモジュールを作成し公開する際にも使用できます。

Nuxt.js

Nuxt.jsは、ユニバーサルなSPAが開発可能なVue.jsベースのフレームワーク。UIの描画サポートに特化しており、SSRにおけるサーバーサイドとクライアントサイドのUIレンダリングなどさまざまな機能を持ちます。

Heroku

HerokuはHeroku社が開発と運営を行っているPaaSの名称です。RubyやNode.js、Python、そしてJVMベース(Java、Scala、Clojureなど)の複数のプログラミング言語をサポートしている。

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

Q&A

解決済

1回答

1131閲覧

Herokuでnuxtアプリケーションが立ち上がらない

naoya.n

総合スコア26

Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

npm

npmは、Node Packaged Modulesの略。Node.jsのライブラリ・パッケージを管理できるツールです。様々なモジュールを簡単にインストールでき、自分でモジュールを作成し公開する際にも使用できます。

Nuxt.js

Nuxt.jsは、ユニバーサルなSPAが開発可能なVue.jsベースのフレームワーク。UIの描画サポートに特化しており、SSRにおけるサーバーサイドとクライアントサイドのUIレンダリングなどさまざまな機能を持ちます。

Heroku

HerokuはHeroku社が開発と運営を行っているPaaSの名称です。RubyやNode.js、Python、そしてJVMベース(Java、Scala、Clojureなど)の複数のプログラミング言語をサポートしている。

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

0グッド

0クリップ

投稿2019/04/11 04:54

編集2019/04/11 07:33

Nuxt.jsで作成したwebアプリをHerokuにデプロイし、ビルドはできたっぽいのですがApplication Errorで立ち上がりません。

何が問題かわかる方いらっしゃいますでしょうか。
エラー文の

Use either `nuxt build` or `builder.build()` or start nuxt in development mode.

がHerokuで何をすればいいかよくわかりません。。
ターミナルでは、pushした際にnuxt startでつまづいてるみたいなんですが何がいけないのでしょうか。

heroku run nuxt build

は実行してBuild succeededになってはいます。

2019-04-11T07:16:23.432873+00:00 heroku[web.1]: Starting process with command `npm start` 2019-04-11T07:16:25.441422+00:00 app[web.1]: 2019-04-11T07:16:25.441455+00:00 app[web.1]: > nuxtapp@1.0.0 start /app 2019-04-11T07:16:25.441456+00:00 app[web.1]: > nuxt start 2019-04-11T07:16:25.441458+00:00 app[web.1]: 2019-04-11T07:16:26.154841+00:00 app[web.1]: 2019-04-11T07:16:26.154874+00:00 app[web.1]: 07:16:26 FATAL No build files found in /app/.nuxt/dist/server. 2019-04-11T07:16:26.154876+00:00 app[web.1]: Use either nuxt build or builder.build() or start nuxt in development mode. 2019-04-11T07:16:26.154877+00:00 app[web.1]: 2019-04-11T07:16:26.154878+00:00 app[web.1]: Use either nuxt build or builder.build() or start nuxt in development mode. 2019-04-11T07:16:26.154880+00:00 app[web.1]: at VueRenderer.ready (node_modules/@nuxt/vue-renderer/dist/vue-renderer.js:2494:13) 2019-04-11T07:16:26.154881+00:00 app[web.1]: 2019-04-11T07:16:26.174327+00:00 app[web.1]: 2019-04-11T07:16:26.174330+00:00 app[web.1]: ╭─────────────────────────────────────────────────────────────────────────────────────╮ 2019-04-11T07:16:26.174331+00:00 app[web.1]: │ │ 2019-04-11T07:16:26.174333+00:00 app[web.1]: │ ✖ Nuxt Fatal Error │ 2019-04-11T07:16:26.174334+00:00 app[web.1]: │ │ 2019-04-11T07:16:26.174337+00:00 app[web.1]: │ Error: No build files found in /app/.nuxt/dist/server. │ 2019-04-11T07:16:26.174338+00:00 app[web.1]: │ Use either `nuxt build` or `builder.build()` or start nuxt in development mode. │ 2019-04-11T07:16:26.174340+00:00 app[web.1]: │ │ 2019-04-11T07:16:26.174341+00:00 app[web.1]: ╰─────────────────────────────────────────────────────────────────────────────────────╯ 2019-04-11T07:16:26.174342+00:00 app[web.1]: 2019-04-11T07:16:26.191774+00:00 app[web.1]: npm ERR! code ELIFECYCLE 2019-04-11T07:16:26.192167+00:00 app[web.1]: npm ERR! errno 1 2019-04-11T07:16:26.193466+00:00 app[web.1]: npm ERR! nuxtapp@1.0.0 start: `nuxt start` 2019-04-11T07:16:26.193591+00:00 app[web.1]: npm ERR! Exit status 1 2019-04-11T07:16:26.193788+00:00 app[web.1]: npm ERR! 2019-04-11T07:16:26.193912+00:00 app[web.1]: npm ERR! Failed at the nuxtapp@1.0.0 start script. 2019-04-11T07:16:26.194008+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above. 2019-04-11T07:16:26.201655+00:00 app[web.1]: 2019-04-11T07:16:26.201783+00:00 app[web.1]: npm ERR! A complete log of this run can be found in: 2019-04-11T07:16:26.201838+00:00 app[web.1]: npm ERR! /app/.npm/_logs/2019-04-11T07_16_26_195Z-debug.log 2019-04-11T07:16:26.268245+00:00 heroku[web.1]: State changed from starting to crashed 2019-04-11T07:16:26.247398+00:00 heroku[web.1]: Process exited with status 1

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

ja.nuxtjs.orgHeroku へデプロイするには? には、

設定項目

heroku config:set NPM_CONFIG_PRODUCTION=false
heroku config:set HOST=0.0.0.0
heroku config:set NODE_ENV=production

や package.json への記載内容や Procfile についての記載がありますが、これらは設定済みでしょうか?


(追記)

テストアプリのデプロイログ。

上記の設定だけで、問題なくデプロイできます。

$ npx create-nuxt-app test1234 npx: 379個のパッケージを17.826秒でインストールしました。 (以下略) $ cd test1234 $ git init $ vi package.json $ echo "web: npm run start" > Procfile $ heroku login $ git commit -am "First Commit " [master (root-commit) fcd984a] First Commit 19 files changed, 9072 insertions(+) create mode 100644 .editorconfig create mode 100644 .gitignore create mode 100644 Procfile create mode 100644 README.md create mode 100644 assets/README.md create mode 100644 components/Logo.vue create mode 100644 components/README.md create mode 100644 layouts/README.md create mode 100644 layouts/default.vue create mode 100644 middleware/README.md create mode 100644 nuxt.config.js create mode 100644 package-lock.json create mode 100644 package.json create mode 100644 pages/README.md create mode 100644 pages/index.vue create mode 100644 plugins/README.md create mode 100644 static/README.md create mode 100644 static/favicon.ico create mode 100644 store/README.md $ heroku config:set NPM_CONFIG_PRODUCTION=false Setting NPM_CONFIG_PRODUCTION and restarting ⬢ test1234... done, v6 NPM_CONFIG_PRODUCTION: false $ heroku config:set HOST=0.0.0.0 Setting HOST and restarting ⬢ test1234... done, v6 HOST: 0.0.0.0 $ heroku config:set NODE_ENV=production Setting NODE_ENV and restarting ⬢ test1234... done, v6 NODE_ENV: production $ git push heroku master Enumerating objects: 29, done. Counting objects: 100% (29/29), done. Delta compression using up to 4 threads. Compressing objects: 100% (24/24), done. Writing objects: 100% (29/29), 91.15 KiB | 5.06 MiB/s, done. Total 29 (delta 2), reused 0 (delta 0) remote: Compressing source files... done. remote: Building source: remote: remote: -----> Node.js app detected remote: remote: -----> Creating runtime environment remote: remote: NPM_CONFIG_LOGLEVEL=error remote: NPM_CONFIG_PRODUCTION=false remote: NODE_ENV=production remote: NODE_MODULES_CACHE=true remote: NODE_VERBOSE=false remote: remote: -----> Installing binaries remote: engines.node (package.json): unspecified remote: engines.npm (package.json): unspecified (use default) remote: remote: Resolving node version 10.x... remote: Downloading and installing node 10.15.3... remote: Using default npm version: 6.4.1 remote: remote: -----> Installing dependencies remote: Installing node modules (package.json + package-lock) remote: remote: > nodemon@1.18.11 postinstall /tmp/build_86a3e5c031d2aa0061e16e8e8edc7172/node_modules/nodemon remote: > node bin/postinstall || exit 0 remote: remote: Love nodemon? You can now support the project via the open collective: remote: > https://opencollective.com/nodemon/donate remote: remote: remote: > nuxt@2.6.1 postinstall /tmp/build_86a3e5c031d2aa0061e16e8e8edc7172/node_modules/nuxt remote: > opencollective || exit 0 remote: remote: added 978 packages from 500 contributors and audited 13763 packages in 22.358s remote: found 0 vulnerabilities remote: remote: remote: -----> Build remote: Detected both "build" and "heroku-postbuild" scripts remote: Running heroku-postbuild remote: remote: > test12344@1.0.0 heroku-postbuild /tmp/build_86a3e5c031d2aa0061e16e8e8edc7172 remote: > npm run build remote: remote: remote: > test12344@1.0.0 build /tmp/build_86a3e5c031d2aa0061e16e8e8edc7172 remote: > nuxt build remote: remote: 07:50:11 ℹ Production build remote: 07:50:11 ✔ Builder initialized remote: 07:50:11 ✔ Nuxt files generated remote: webpackbar 07:50:14 ℹ Compiling Client remote: webpackbar 07:50:24 ✔ Client: Compiled successfully in 9.81s remote: webpackbar 07:50:24 ℹ Compiling Server remote: webpackbar 07:50:26 ✔ Server: Compiled successfully in 2.01s remote: remote: Hash: 7dbec3518f1809d8e4f7 remote: Version: webpack 4.29.6 remote: Time: 9816ms remote: Built at: 04/11/2019 7:50:24 AM remote: Asset Size Chunks Chunk Names remote: ../server/client.manifest.json 5.44 KiB [emitted] remote: 266ee4ce338b930797b6.js 146 KiB 1 [emitted] commons.app remote: 4a310cf6b935b4e98a7e.js 2.22 KiB 3 [emitted] runtime remote: 8041c3f6b08035d56c8c.js 3.65 KiB 2 [emitted] pages/index remote: LICENSES 427 bytes [emitted] remote: adff562eecf490566d02.js 36.3 KiB 0 [emitted] app remote: + 2 hidden assets remote: Entrypoint app = 4a310cf6b935b4e98a7e.js 266ee4ce338b930797b6.js adff562eecf490566d02.js remote: remote: Hash: 1bfa837a78878993cbe2 remote: Version: webpack 4.29.6 remote: Time: 2012ms remote: Built at: 04/11/2019 7:50:26 AM remote: Asset Size Chunks Chunk Names remote: d7db1ebd8906013086a0.js 3.71 KiB 1 [emitted] pages/index remote: server.js 23.8 KiB 0 [emitted] app remote: server.manifest.json 243 bytes [emitted] remote: + 2 hidden assets remote: Entrypoint app = server.js server.js.map remote: remote: -----> Caching build remote: - node_modules remote: remote: -----> Pruning devDependencies remote: Skipping because NPM_CONFIG_PRODUCTION is 'false' remote: remote: -----> Build succeeded! remote: -----> Discovering process types remote: Procfile declares types -> web remote: remote: -----> Compressing... remote: Done: 36.1M remote: -----> Launching... remote: Released v6 remote: https://test1234.herokuapp.com/ deployed to Heroku remote: remote: Verifying deploy... done. To https://git.heroku.com/test1234.git * [new branch] master -> master

投稿2019/04/11 07:34

編集2019/04/11 08:02
CHERRY

総合スコア25171

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

naoya.n

2019/04/11 07:35

はい、僕もそのページは一度見て、設定済みです!
CHERRY

2019/04/11 07:58

そうですか。 そのページに説明されている Procfile も作成されていますよね。
CHERRY

2019/04/11 08:04 編集

今、新規 Dyno を作って試してみた感じでは、nuxt のアプリに そのページの設定を追加で問題なくデプロイ&起動するようです。 (回答にログを追加しておきます。)
naoya.n

2019/04/11 08:10

Procfile作成してなかったので、package.jsonと同じルートディレクトリにProcfileを作成して ``` web: npm run start ``` とだけ書いてpushしたんですが同様のエラーでした。この処理であってますかね??
CHERRY

2019/04/11 08:15

はい。 その1行であっています。 ` heroku config ` を実行すると 設定されている値が表示されますが、設定した項目はあるでしょうか? > $ heroku config > === test1234 Config Vars > HOST: 0.0.0.0 > NODE_ENV: production > NPM_CONFIG_PRODUCTION: false
naoya.n

2019/04/11 08:21

はい、同じものが出力されました!
CHERRY

2019/04/11 08:25

うーん。 ローカル環境では、問題なく動いているんですよね?
naoya.n

2019/04/11 08:29

すみません、、ローカルではずっとnpm run devで起動していて、今ローカルでnpm run startしてみたら同じようなエラーが出ました。本当にすみません!! ビルドのそのものをよくわかっていなくてm(_ _)m
naoya.n

2019/04/11 08:40

今ローカルではnpm run buildの後、npm run startをするとローカルではちゃんと動きました。。リモートとでも同様の操作はしたはずなんですが先ほどと同じエラーのままです。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問