Hi Dear,
So today, I will walk you through on how to Deploy your awesome Vue or Quasar App on netlify with either of the two methods
Table Of Contents
Deploy a Built Directory 😊
Since Netlify (as at the time of writing this blogs), hosts our static files; html, css etc. You could manually run your Cli build command, to generate the static files, which would be stored in a dist/ directory. (depends on output path though).
// For Vue Cli
npm run build
OR
yarn build
// For Quasar Cli
quasar build
Once this is done, a dist
folder is generated for you. So all you need do, is just to visit app.netlify.com/drop
Open your Explorer ( where you project dist directory is found on your machine ) side by side as with you browser, Drag the dist folder and Drop on the space provided by Netlify. Trust me, it's that simple.
NB: If you choose to Deploy this way, then each time you make a change, you will have to Drag and Drop all over again to update.
Deploy From Version Control System 👽
Lets say you don't Like stress that much. A version control system, could be your Github, Bitbucket, GitLab. Once you open the Netlify deploy section, you will see 'New Site from Git':
- Click on the button
- Link your preferred version control system
- Authenticate
- Choose on the Repo you wish you publish
- Enter the Build command (as stated earlier)
- Enter your Output directory
Congratulations
You have automatically merged your Repo to Netlify, so each time you make
a push to master. Netlify builds your app and updates it for you.
Thanks.
Oldest comments (2)
Thanks for sharing this,it just saved me
What is your build script for your vue/quasar app ?
I can't find a way to exit quasar build process, therefore the build in Netlify never stops...