Pre-requisites:
- Git
- Heroku Account and cli. To install Heroku cli:
- Vue CLI 3 Application
Steps:
- Commands used regularly
· git init
re-initializing existing git repository in ….directory
· git add .
adding everything
· git commit –m “initial commit”
· git status
1. include dist..
in .gitignore directory:
2. Add `start` command script
package. json file: in “scripts”, add:
“start”: “node server.js”,
3. Install express
npm install — save express [two dashes]
4. Set up server.js file
Add the server.js file in the root
File content:
const express = require(‘express’);
const port = process.env.PORT || 8080;
const app = express();
app.use(express.static(__dirname + “/dist/”));
app.get(/.*/, function(req, res){
res.sendfile(__dirname + “/dist/index.html”);
});
app.listen(port);
5. Build dist directory
npm run build (run every time changes are made before deploying)
6. Deploy to Heroku
Follow steps on the page
$ heroku login
$ cd your-project/
$ git init
$ heroku git:remote –a your-herokuapp
$ git add .
$ git commit –am “some commit” (not sure if this really works)
$ git push Heroku master
$ Heroku git:remote –a your-herokuapp
Then click on “Open app” button
Output:
