返回

百度轻量服务器上轻松部署Vue项目：分步指南

前端

百度LS轻量服务器+CentOS 7.9+PuTTY+Nginx：Vue项目部署指南

引言

部署Vue项目需要一种可靠且经过优化的高性能服务器环境。百度轻量服务器凭借其经济实惠的价格和强大的功能集，成为部署Vue项目的理想选择。本文将引导您完成在百度轻量服务器上使用CentOS 7.9、PuTTY和Nginx部署Vue项目的详细步骤。

步骤 1：服务器配置

  1. 注册百度云账号并购买百度轻量服务器实例。
  2. 选择CentOS 7.9作为操作系统。
  3. 配置服务器安全组，允许必要的端口（例如，22、80、443）入站流量。
  4. 获取服务器公网IP地址和 root 用户密码。

步骤 2：远程登录

  1. 下载并安装PuTTY SSH客户端。
  2. 在PuTTY会话中输入服务器公网IP地址和端口 22。
  3. 输入 root 用户名和密码进行身份验证。

步骤 3：文件传输

  1. 下载并安装PuTTY PSFTP客户端。
  2. 在PSFTP会话中输入服务器公网IP地址和端口 22。
  3. 输入 root 用户名和密码进行身份验证。
  4. 使用以下命令将Vue项目文件上传到服务器的 /var/www/html 目录： 
    psftp> put /path/to/local/vue-project.zip /var/www/html

步骤 4：Nginx反向代理配置

  1. 在服务器上安装Nginx： 
    sudo yum install nginx
  2. 创建一个Nginx虚拟主机配置文件，例如 /etc/nginx/conf.d/vue-project.conf： 
    server {
    listen 80;
    server_name example.com;

    location / {
        root /var/www/html/vue-project;
        index index.html;
        try_files $uri $uri/ /index.html;
    }
}
  3. 替换 example.com 为您的实际域名。
  4. 重新加载Nginx配置： 
    sudo systemctl reload nginx

步骤 5：Vue项目部署

  1. 解压上传的Vue项目文件： 
    sudo unzip /var/www/html/vue-project.zip -d /var/www/html
  2. 导航到项目目录： 
    cd /var/www/html/vue-project
  3. 安装项目依赖： 
    npm install
  4. 构建项目： 
    npm run build
  5. 验证项目是否成功部署： 
    curl http://example.com

结论

按照本指南中的步骤，您已成功地在百度轻量服务器上部署了您的Vue项目。该指南涵盖了服务器配置、远程登录、文件传输、Nginx反向代理配置和Vue项目部署的各个方面。通过利用百度轻量服务器的强大功能和Nginx的高性能反向代理，您的Vue应用程序将受益于快速加载时间、可靠性和可扩展性。