前端部署

前端部署

在linux环境下部署前端代码

一、【基础环境配置】
1、安装node ，并配置环境变量(编辑运行唤醒)
2、安装git
3、安装Nginx，并规划好前端存放的位置

二、【编译打包】
1、使用git 获取或更新指定分支的代码
2、进入项目目录（有package.json的目录下）
3、执行编译命令 npm run build (初次执行需要执行npm install 安装依赖，后续有新的依赖加入，也需要执行)
4、将编译后的内容 dist 移动 提前规划好的部署目录

Linux环境下安装node

1. 使用ftp连接服务器

2. 新建一个文件夹

3. 在node下下载一个linux的nodejs包，(本环境选64位的)

4. 将node包拿到内网，通过ftp将node包传送到刚刚新建的文件夹下(点住node包直接拉取过来)

5. 打开Xshell工具(finalshell)连接主机

6. 执行ll命令，cd到自己想要的文件夹（刚刚建的文件夹）

7. 输入解压命令并回车 (node-v16.14.0-linux-x64是版本号)

   tar -xvf node-v16.14.0-linux-x64.tar.xz
   

8. 解压成功后，移动文件夹,并检查是否移动成功（到相应的目录下查看）

   mv node-v16.14.0-linux-x64 /usr/local/node //node-v16.14.0-linux-x64为解压后的文件夹名
   

9. 【root权限的情况下配置环境变量】

   sudo vim /etc/profile  //执行这一步后一定要按i键，才可以接下来的操作
   
   export PATH=$PATH:/user/local/node/bin  //编辑完后按esc键退出编辑，输入：wq! 保存，  路径为node转移后的路径
   

   source /etc/profile
   

【非root权限的情况下配置环境变量】

1. 创建新文件夹，用来存放nodejs
   mkdir -p ~/tools
2. 把刚才解压出来的文件夹，移动到tools文件夹下并重命名为nodejs
   mv node-v14.15.4-linux-x64 tools/nodejs

• 配置环境变量

1. 编辑 .bashrc 文件
   vi .bashrc
2. 按 o 进入编辑模式，在末尾添加
   export PATH="${PATH}:${HOME}/tools/nodejs/bin"
3. 按ESC，输入 :wq! ，回车
   :wq!
source .bashrc

10. 查看安装是否成功 node -v npm -v

脚本部署前端代码

1. 有git就进入项目目录，
   1. cd
   2. git pull
2. 无git，如我这个项目，先本地测试的，可以在服务器建一个文件夹，将代码用ftp传输到服务器
3. 代码准备完成，开始进行打包
4. npm i 先建立链接 npm run build (常用，本项目中是npm run build:stage)
5. 删除之前的dist文件 rm -rf /目录/dist
6. 将新生成的dist文件移过去 mv ./dist /目录

文章参考