项目打包

在项目根目录下运行

npm run build

这个命令会在项目根目录下生成一个 dist 目录,
这个就是打包好的项目, 添加到压缩包, 通过localsend传输到debian虚拟机上

安装并启动nginx

在linux上安装nginx非常简单, 只需要一行命令

sudo apt install nginx

启动:

sudo systemctl start nginx

浏览器访问 http://localhost, 会显示nginx的欢迎信息

安装项目到nginx

配置nginx

编辑默认配置

sudo vim /etc/nginx/sites-available/default

修改内容到如下所示

可以看见 root /var/ww/html , 这指定了nginx的工作根目录
location/ {...} 中指定了需要被展示的html文件
而在dist目录中, 主html文件就是index.hmtl
运行

sudo cp -r dist/* /var/www/html/

移动dist目录到nginx的默认工作目录下

检查配置是否正确

nginx提供了一行命令用来检查config是否合法

sudo nginx -t

正常的输出应该如下图所示

浏览器访问

打开浏览器访问 http://localhost, 便可以看见vue3的页面

非常漂亮