I am creating a Vue app with my roommate and we want to deploy it on our raspberry Pi. Is there a possibility to npm build our final app on our PC and just start the server on the Pi without having to build the app on the Raspberry? And if so, how can we start the app on the Raspberry?

Thank you in advance!

CodePudding user response：

Totally possible. Build your vue app on your PC (known as development environment) and host it on you raspberry pi (production environment). There multiple ways to do this, but from a high level perspective you just need to:

1. Set up you pi like normal by installing the preferred OS
2. SSH into the pi from your PC
3. Install a webserver. For Vue a quick fix could either be Nginx or Apache
4. If you have Node installed on the server you can run your npm commands like normal and build the Vue site on the server with npm run build. Otherwise you can just copy your build/dist folder to the server, but then you might need to do some extra configuration.
5. Get a domain name (there are some free ones for things like this) and point it to your raspberry pi's IP.

Note: When you're SSHed in you can install different things like Git and Node.

A good list of tutorials to follow is:

1. How to set up SSH on a raspberri pi
2. How to set up Nginx or Apache on a raspberri pi
3. How to deploy a Vue app to a webserver (check both Nginx and Apache). There are some good videos on youtube to check out
4. Pointing a domain name to my raspberry pi website (https://www.noip.com/ is a good free choice)

NB: One last very important thing to remember is that if you're going to expose your webserver to the internet via your home network (using your own internet at home), you might expose your router to the world, which could enable malicious actors to get into your PC and any other device connected to your network. You might need to think about installing a firewall to prevent this. So maybe check out some research on that too.

Here are some useful links:
https://www.instructables.com/Host-your-website-on-Raspberry-pi/
https://medium.com/@thesabareesh/host-your-own-website-on-a-raspberry-pi-3-e3c8fdb90f90

CodePudding user response：

The result of a vanilla Vue build is a dist directory containing static files.

You can serve them over the network using a static file server: Nginx or Apache for example. The latter I believe is preinstalled in the Raspberry Pi OS and a lot of other distros.

You can also follow this guide as a starting point for Apache.
Also the Vue docs have a page dedicated to deployment.