一。部署

     要在Nginx上部署前端Vue项目，你需要将构建好的Vue项目文件放置在Nginx服务器的某个目         录下，并配置Nginx的配置文件来正确地提供这些静态文件。

     以下是部署Vue项目的基本步骤：

1. 在你的Vue项目根目录中运行构建命令：

   npm run build

   或者如果你使用的是Yarn：

   yarn build

2. 将构建后的内容（通常在dist目录）上传到你的服务器。

3. 配置Nginx。编辑Nginx的配置文件，通常位于/etc/nginx/nginx.conf或者/etc/nginx/sites-available/目录下的某个文件。

   假设你的Vue项目被构建并且所有的文件都在/var/www/my-vue-app/dist目录下，你可以使用以下配置：

   server {
       listen 80;
       server_name your-domain.com;
    
       location / {
           root /var/www/my-vue-app/dist;
           try_files $uri $uri/ /index.html;
       }
   }

4. 重启Nginx以应用更改：

   sudo systemctl restart nginx

        确保你的Vue项目的publicPath在vue.config.js中设置为/，这样打包的时候资源引用才会            正确。如果你的Vue项目需要运行在非根路径下，你需要调整publicPath并相应地调整Nginx          配置中的路径。

二。配置

要使用nginx部署Vue工程，您需要进行以下配置：

1. 安装Nginx：首先确保您已经在服务器上安装了Nginx。如果没有，请根据您的操作系统进行安装。

2. 配置Nginx：打开Nginx的配置文件，通常位于`/etc/nginx/nginx.conf`。添加以下配置：

server {
    listen 80;
    server_name your_domain.com; // 替换成您的域名或IP地址

    location / {
        root /path/to/your/vue/project/dist; // 替换成您Vue工程dist文件夹的路径
        index index.html;
        try_files $uri $uri/ /index.html;
    }
}

3. 保存配置文件并重启Nginx服务。

sudo service nginx restart

4. 验证：在浏览器中访问您的域名或IP地址，应该能够看到您的Vue工程的界面。

请注意，上述示例假设您的Vue工程已经构建并生成了静态文件，将它们放在了`/path/to/your/vue/project/dist`路径下。如果您的路径不同，请相应地进行调整。

此外，还可以根据需要进行其他Nginx配置，例如启用HTTPS、反向代理等。有关更多Nginx配置信息，请参考Nginx官方文档。