
Serving Vue.js Apps on GitHub Pages - muhammadusman
https://blog.usmanity.com/serving-vue-js-apps-on-github-pages/
======
Trifectuh
There's also this: [http://client-side-vue.herokuapp.com](http://client-side-
vue.herokuapp.com) as an alternative

[https://github.com/justinwash/Client-Side-
Vue](https://github.com/justinwash/Client-Side-Vue)

------
Orphis
So you just build your app and pushes the "binary" output on Github Pages? It
would be better to push the output dir to another branch folder and force push
it when you update.

~~~
codetrotter
Yeah, creating an orphan “gh-pages” branch is what I always do. Repositories
that include build output in the main branch make me rather quite upset.

Your additional point about force pushing is a good one also. While I’ve been
using separate branch I’ve still been commiting each new build as a new
commit. But overwriting the initial commit makes a lot more sense actually.

------
founderling
You don't necessarily need the whole server-side dance:

[https://jsfiddle.net/chrisvfritz/50wL7mdz/](https://jsfiddle.net/chrisvfritz/50wL7mdz/)

I find developing without a server side build process much more lightweight
and enjoyable.

~~~
muhammadusman
Thanks for the suggestion.

My example app is pretty contrived but I was mostly running into this issue
when I had a multi-component app. An example is another repo I was working on:
[https://github.com/usmanity/prompt/tree/master/src](https://github.com/usmanity/prompt/tree/master/src)

I guess, I should've prefaced my blog post with that :p

------
stared
It is not a good approach. Much better to use

\- Vue with no build (see e.g. [https://github.com/stared/interactive-machine-
learning-list](https://github.com/stared/interactive-machine-learning-list))

\- build -> push to a separate, orphan branch:

[https://medium.com/@codetheorist/vue-up-your-github-pages-
th...](https://medium.com/@codetheorist/vue-up-your-github-pages-the-right-
way-955486220418)

Pushing binaries to the same branch is a very, very bad git practice.

------
davidjnelson
Vue seems very similar to react[1]. Anyone know why vue is seeing a big swing
in adoption when we already have react? Maybe because it's built into
laravel[2]? Some other reason?

1\. [https://medium.com/javascript-in-plain-english/i-created-
the...](https://medium.com/javascript-in-plain-english/i-created-the-exact-
same-app-in-react-and-vue-here-are-the-differences-e9a1ae8077fd)

2\.
[https://laravel.com/docs/5.8/frontend](https://laravel.com/docs/5.8/frontend)

~~~
rumblestrut
Because the work is done mainly by a small team instead of backed by a company
that we are all starting to really distrust?

Also, excellent docs.

We have used Vue at my company for almost three years now. Love it.

------
tjr
Any suggestions for running a Vue.js application as a local set of files,
without running a web server? My use case is slightly more obscure than this,
but imagine something like a local, off-network kiosk interface.

~~~
revvx
You mean running production frontend-only apps?

You can just open "index.html" in your browser and it will run fine, as longs
as the paths inside your files are relative.

You might have to reconfigure your bundler. If you're using Parcel, just pass
`--public-url .` as a command line option when building. For Webpack use the
publicPath configuration, etc.

But remember that pages accessed via file:/// have limited permissions: you
can't use localStorage, access some sites using CORS, can't capture
audio/video, etc. But if you're not using these things then it's fine.

------
thibautg
I’m using the deployment method to the gh-pages branch documented on Vue CLI’s
website [0]. Works pretty well.

[0] [https://cli.vuejs.org/guide/deployment.html#github-
pages](https://cli.vuejs.org/guide/deployment.html#github-pages)

------
ddtaylor
I have been using Vue.js for a while and I'm really impressed by it. During
development using `npm run serve` and having it automatically rebuild whenever
a file is added or changes is great and then baking it out for static storage
using `npm run build` is a great follow up.

~~~
numbers
yes, have you been using vue-cli? that's what makes prototyping new ideas so
easy it's a no brainer!

~~~
ddtaylor
Yeah I am using `vue-cli`

------
dr01d
You could just use gitlab:
[https://gitlab.com/pages?page=1](https://gitlab.com/pages?page=1)

Much better imo

~~~
mfatica
can you quantify how it is better? I can't find any details on what
differentiates them

~~~
MatekCopatek
The main difference in my experience is the fact GitLab CI is very flexible.
In this case, it would be trivial to use a node docker container and
automatically build static assets on the server instead of doing it locally
and polluting the repo.

------
vmware513
How do you manage subroutes and direct deeplink to a subpage?

