Recently, I used Vue and Koa2 to reconstruct my blog. I stepped on a lot of pitfalls and looked up a lot of information, and finally successfully went online. After that, I planned to write a series of articles around this process, and talk about how to write a set of websites using Vue+Koa2.
Now, let’s talk about the last step, how to deploy Vue and Koa2 online after writing them.
1. Combine Vue and Koa2
Many people don’t know how to do it after getting the bag, after all, it’s all about the backend. If you are using Vue-cli3.0, then packaging will be very simple. You only need to execute one command, and you don’t have to worry about the rest:
npm run build
Then a dist folder will be generated, put it in the public file in the Koa2 directory, and then point the static resource to this folder in the Koa2 configuration file. The pointing command will be automatically generated when we create the Koa2 framework, so all we need to do is change the file address:
(require('koa-static')(__dirname + '/public/dist'))
After the modification is completed, open the home page of koa2 to see if it loads successfully. The first step is completed happily.
Configuration
Now log in to the server, after installing Nginx, create a new conf file under `/etc/nginx/sites-enabled/`, and then write to the configuration:
//Koa's port is generally 3000 by defaultupstream {
server 127.0.0.1:3000;
}
server {
listen 80;
server_name .******.com;
location / {
proxy_pass ;
proxy_redirect off;
}
}
After writing, restart Nginx:
sudo /etc//nginx restart
Then upload the Koa2 file to the server, and after starting it, enter your URL or server ip in the browser. If you can access it, you will be done.
Of course, this Nginx configuration is still very simple. If you want to run stably for a long time, you have to add SSL and Gzip. There is a lot of online information, and I will talk about it if you have the chance in the future.
3. Use Pm2 for process management
After successful access, Koa will be placed in the background. Pm2 is used for management. Let’s install it first:
npm install -g pm2
After installation, create a file "" in the Koa directory, and then enter the following code:
{
"apps":{
"name":"blog",
"script": "bin/www",
"watch": true,
"ignore_watch":[
"node_modules",
"logs"
],
"instances":2,
"error_file":"logs/",
"out_file":"logs/",
"log_date_format": "YYYY-MM-DD HH:mm:ss"
}
}
Let’s focus on the two parameters, watch and instances.
Watch will automatically restart and load when it detects changes to the file, ignore_watch will exclude files that do not need to be monitored.
Instances is the number of instances that are enabled. It is recommended to configure according to the number of CPU cores, and to enable as many cores as there are.
Finally started:
pm2 start
At this point, the website is deployed!
Summarize
The above is a detailed explanation of the tutorial on Vue+Koa2 packaged and deployed online by the editor. I hope it will be helpful to everyone. If you have any questions, please leave me a message and the editor will reply to everyone in time. Thank you very much for your support for my website!
If you think this article is helpful to you, please reprint it. Please indicate the source, thank you!