1、安装Nginx

apt-get purge nginx nginx-common

2、配置Nginx

在如下目录创建myproject文件

root@iZwz9ac2zgy2pe7lgh7i6qZ:/etc/nginx/sites-enabled#
root@iZwz9ac2zgy2pe7lgh7i6qZ:/etc/nginx/sites-enabled# ls
default  myproject
root@iZwz9ac2zgy2pe7lgh7i6qZ:/etc/nginx/sites-enabled#
root@iZwz9ac2zgy2pe7lgh7i6qZ:/etc/nginx/sites-enabled#
root@iZwz9ac2zgy2pe7lgh7i6qZ:/etc/nginx/sites-enabled#

3、将如下内容写入myproject文件

server {
    listen 8080;

    server_name localhost;

    #root /root/project/vue_project/demo_01/hello_world/dist;

    location / {
        #try_files $uri $uri/ @router;
        root /root/project/vue_project/demo_01/hello_world/dist;
        index index.html index.htm;
    }

    #location @router {
    #    rewrite ^.*$ /index.html last;
    #}
}

4、使用npm run build编译vue工程，会生成一个dist文件夹，将该文件夹传输到ubuntu服务器上

5、mypoject中的root后跟的路径即是dist文件夹在ubuntu上的路径

6、我这里使用的是阿里云服务器，需要在安全策略中开启8080端口

7、重启Nginx服务器

nginx -s reload

8、通过ip:8080访问服务器

如果出现403 forbiden，可以参照如下连接的解决办法

Nginx出现403 forbidden_枫小秋 的博客-CSDN博客