Launch app generated by vue-cli on heroku #640
Description
Hello there! ✋
I'am try launch on Heroku basic application which was generated by vue-cli.
And I occur error. Below I put step by step what I doing:
Application which should works: https://is-vue-works-on-heroku.herokuapp.com/
1) I generate application by command:
$ vue-cli init webpack is-vue-works-on-heroku
? Generate project in current directory? Yes
? Project name is-vue-works-on-heroku
? Project description A Vue.js project
? Author Piotr Kowalski <XXX>
? Vue build standalone
? Install vue-router? No
? Use ESLint to lint your code? No
? Setup unit tests with Karma + Mocha? No
? Setup e2e tests with Nightwatch? No
vue-cli · Generated "is-vue-works-on-heroku".
To get started:
npm install
npm run dev
Documentation can be found at https://vuejs-templates.github.io/webpack
2) Next create app on Heroku by command:
$ heroku create is-vue-works-on-heroku
3) Next connect local repository with Heroku:
$ heroku git:remote -a is-vue-works-on-heroku
4) And try deploy my app by command:
$ git push heroku master
Add this error occurs
/tmp/is-vue-works-on-heroku [master] > git push heroku master
Counting objects: 52, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (43/43), done.
Writing objects: 100% (52/52), 23.09 KiB | 0 bytes/s, done.
Total 52 (delta 0), 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=true
remote: NODE_VERBOSE=false
remote: NODE_ENV=production
remote: NODE_MODULES_CACHE=true
remote:
remote: -----> Installing binaries
remote: engines.node (package.json): >= 4.0.0
remote: engines.npm (package.json): >= 3.0.0
remote:
remote: Resolving node version >= 4.0.0...
remote: Downloading and installing node 9.1.0...
remote: Bootstrapping npm >= 3.0.0 (replacing 5.5.1)...
remote: npm 5.5.1 installed
remote:
remote: -----> Restoring cache
remote: Skipping cache restore (not-found)
remote:
remote: -----> Building dependencies
remote: Installing node modules (package.json)
remote: WARNING: You are likely using a version of node-tar or npm that is incompatible with this version of Node.js.
remote: Please use either the version of npm that is bundled with Node.js, or a version of npm (> 5.5.1 or < 5.4.0) or node-tar (> 4.0.1) that is compatible with Node.js 9 and above.
remote: /tmp/build_ab84e527f577e9a1144aa55221ba2c08/.heroku/node/bin/node[236]: ../src/node_zlib.cc:437:static void node::{anonymous}::ZCtx::Init(const v8::FunctionCallbackInfo<v8::Value>&): Assertion `args.Length() == 7 && "init(windowBits, level, memLevel, strategy, writeResult, writeCallback," " dictionary)"' failed.
remote: 1: node::Abort() [npm]
remote: 2: node::Assert(char const* const (*) [4]) [npm]
remote: 3: 0x12530bf [npm]
remote: 4: v8::internal::FunctionCallbackArguments::Call(void (*)(v8::FunctionCallbackInfo<v8::Value> const&)) [npm]
remote: 5: 0xb7547c [npm]
remote: 6: v8::internal::Builtin_HandleApiCall(int, v8::internal::Object**, v8::internal::Isolate*) [npm]
remote: 7: 0x333f2a4842fd
remote: /app/tmp/buildpacks/19862b8792e84bd8421ded4660b92dfd1c41d92e19ac0b38c90301adc8ae3e0bd512fa01998af18fc2f0d31a157e9c82e8fdceba1a05e5d29adb8dc2bfaf08e1/lib/dependencies.sh: line 85: 236 Aborted npm install --unsafe-perm --userconfig $build_dir/.npmrc 2>&1
remote:
remote: -----> Build failed
remote:
remote: We're sorry this build is failing! You can troubleshoot common issues here:
remote: https://devcenter.heroku.com/articles/troubleshooting-node-deploys
remote:
remote: Some possible problems:
remote:
remote: - Dangerous semver range (>) in engines.node
remote: https://devcenter.heroku.com/articles/nodejs-support#specifying-a-node-js-version
remote:
remote: Love,
remote: Heroku
remote:
remote: ! Push rejected, failed to compile Node.js app.
remote:
remote: ! Push failed
remote: Verifying deploy...
remote:
remote: ! Push rejected to is-vue-works-on-heroku.
remote:
To https://git.heroku.com/is-vue-works-on-heroku.git
! [remote rejected] master -> master (pre-receive hook declined)
error: failed to push some refs to 'https://git.heroku.com/is-vue-works-on-heroku.git'
5) So I setup Node.js & npm versions to that:
diff --git a/package.json b/package.json
index f1a7033..6c4649d 100644
--- a/package.json
+++ b/package.json
@@ -85,8 +85,8 @@
"webpack-merge": "^4.1.0"
},
"engines": {
- "node": ">= 4.0.0",
- "npm": ">= 3.0.0"
+ "node": "8.x",
+ "npm": "5.x"
},
"browserslist": [
"> 1%",6) And after next deploy which I made by command:
$ git push heroku master
Deploy was finished successful:
Counting objects: 55, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (46/46), done.
Writing objects: 100% (55/55), 24.01 KiB | 0 bytes/s, done.
Total 55 (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=true
remote: NODE_VERBOSE=false
remote: NODE_ENV=production
remote: NODE_MODULES_CACHE=true
remote:
remote: -----> Installing binaries
remote: engines.node (package.json): 8.x
remote: engines.npm (package.json): 5.x
remote:
remote: Resolving node version 8.x...
remote: Downloading and installing node 8.9.1...
remote: Bootstrapping npm 5.x (replacing 5.5.1)...
remote: npm 5.5.1 installed
remote:
remote: -----> Restoring cache
remote: Skipping cache restore (not-found)
remote:
remote: -----> Building dependencies
remote: Installing node modules (package.json)
remote: added 2 packages in 0.622s
remote:
remote: -----> Caching build
remote: Clearing previous node cache
remote: Saving 2 cacheDirectories (default):
remote: - node_modules
remote: - bower_components (nothing to cache)
remote:
remote: -----> Build succeeded!
remote: -----> Discovering process types
remote: Procfile declares types -> (none)
remote: Default types for buildpack -> web
remote:
remote: -----> Compressing...
remote: Done: 18.1M
remote: -----> Launching...
remote: Released v3
remote: https://is-vue-works-on-heroku.herokuapp.com/ deployed to Heroku
remote:
remote: Verifying deploy... done.
To https://git.heroku.com/is-vue-works-on-heroku.git
* [new branch] master -> master
But in logs I see that application didn't start:
2017-11-12T08:15:01.067551+00:00 heroku[web.1]: State changed from crashed to starting
2017-11-12T08:15:04.872324+00:00 heroku[web.1]: Starting process with command `npm start`
2017-11-12T08:15:06.529406+00:00 app[web.1]:
2017-11-12T08:15:06.529420+00:00 app[web.1]: > is-vue-works-on-heroku@1.0.0 start /app
2017-11-12T08:15:06.529421+00:00 app[web.1]: > npm run dev
2017-11-12T08:15:06.529421+00:00 app[web.1]:
2017-11-12T08:15:06.801525+00:00 app[web.1]:
2017-11-12T08:15:06.801543+00:00 app[web.1]: > is-vue-works-on-heroku@1.0.0 dev /app
2017-11-12T08:15:06.801545+00:00 app[web.1]: > node build/dev-server.js
2017-11-12T08:15:06.801545+00:00 app[web.1]:
2017-11-12T08:15:08.000985+00:00 app[web.1]: > Starting dev server...
2017-11-12T08:15:09.827618+00:00 app[web.1]: ERROR Failed to compile with 2 errors08:15:09
2017-11-12T08:15:09.827697+00:00 app[web.1]:
2017-11-12T08:15:09.828511+00:00 app[web.1]: error in ./src/App.vue
2017-11-12T08:15:09.828568+00:00 app[web.1]:
2017-11-12T08:15:09.828616+00:00 app[web.1]: Module build failed: Error: "extract-text-webpack-plugin" loader is used without the corresponding plugin, refer to https://github.com/webpack/extract-text-webpack-plugin for the usage example
2017-11-12T08:15:09.828617+00:00 app[web.1]: at Object.pitch (/app/node_modules/extract-text-webpack-plugin/dist/loader.js:57:11)
2017-11-12T08:15:09.828683+00:00 app[web.1]:
2017-11-12T08:15:09.828684+00:00 app[web.1]: @ ./src/App.vue 2:2-376
2017-11-12T08:15:09.828684+00:00 app[web.1]: @ ./src/main.js
2017-11-12T08:15:09.828684+00:00 app[web.1]: @ multi ./build/dev-client ./src/main.js
2017-11-12T08:15:09.828729+00:00 app[web.1]:
2017-11-12T08:15:09.828773+00:00 app[web.1]: error in ./src/components/HelloWorld.vue
2017-11-12T08:15:09.828829+00:00 app[web.1]:
2017-11-12T08:15:09.828861+00:00 app[web.1]: Module build failed: Error: "extract-text-webpack-plugin" loader is used without the corresponding plugin, refer to https://github.com/webpack/extract-text-webpack-plugin for the usage example
2017-11-12T08:15:09.828862+00:00 app[web.1]: at Object.pitch (/app/node_modules/extract-text-webpack-plugin/dist/loader.js:57:11)
2017-11-12T08:15:09.828904+00:00 app[web.1]:
2017-11-12T08:15:09.828904+00:00 app[web.1]: @ ./src/components/HelloWorld.vue 2:2-391
2017-11-12T08:15:09.828905+00:00 app[web.1]: @ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/App.vue
2017-11-12T08:15:09.828905+00:00 app[web.1]: @ ./src/App.vue
2017-11-12T08:15:09.828906+00:00 app[web.1]: @ ./src/main.js
2017-11-12T08:15:09.828906+00:00 app[web.1]: @ multi ./build/dev-client ./src/main.js
2017-11-12T08:15:09.828946+00:00 app[web.1]:
2017-11-12T08:15:09.861460+00:00 app[web.1]: > Listening at http://localhost:25671
2017-11-12T08:15:09.861462+00:00 app[web.1]:
2017-11-12T08:15:09.964040+00:00 app[web.1]: (node:29) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: Exited with code 3
2017-11-12T08:15:09.964107+00:00 app[web.1]: (node:29) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
2017-11-12T08:15:10.193937+00:00 heroku[web.1]: State changed from starting to up
What should I do, to launch vue-cli app on Heroku? 😢