Mac 在阿里云ECS服务器部署前端项目流程分享

待我称王封你为后i 2021-12-22 09:23 756阅读 0赞

ps: 这不是一个详细完整的教程，只是本人对学习如何将本地部署到远程服务器的记录并做个分享
因为各人的项目不同、系统不同、环境不同，用下面的这套流程不一定能跑的通，不喜勿喷，如有不同见解可在评论区处讨论交流~

下面附本人环境系统：本地系统 macOS，远程服务器系统 centos 7，要部署的是 react + koa 的项目

1. SSH 远程连接服务器

  • 首先进入终端，输入 sudo su - 回车；
  • 然后输入 ssh -p 端口号(一般为22) 用户名@ip地址

例如 ssh -p 22 root@172.19.38.92

如果没有另外创建用户，linux系统的初始用户为 root

  • 会有 Are you sure you want to continue connecting？ 的选择 选择 yes
  • 然后输入密码，就ok了~

此处如果忘记了 root 的密码，可以在 ECS 控制台修改密码

在这里插入图片描述

此处不要和下面的远程连接密码混淆，那个是网页远程连接的6位密码

当然这是最原始的方法，每次都要敲下长长的命令，还有ip地址需要记忆，这种体验可不太好，有两种方法可以优化体验：一是使用 SSH 客户端，比如 Mac 上就有 Shuttle、FinalShell、Termiuns 等几款；二是通过配置 ~/.ssh/config，缩写 ssh 命令

配置 ~/.ssh/config

  1. vim ~/.ssh/config

编辑配置文件，下面是配置文件的格式

  1. Host server1                        # alias 关键字
  2. HostName 172.19.38.92               # 主机地址
  3. User root                           # 用户名
  4. IdentityFile ~/.ssh/id_rsa.pub      # 认证文件 ssh 公钥
  5. Port 22                             # 制定端口

这样配置后，可以大大缩短 ssh 的命令，而且不用去记忆ip地址

  1. ssh server1

就等价于

  1. ssh -p 22 root@106.14.182.248

在此基础上，还可以配置多站点缩写，server2、server3…

2. 将项目传到远程服务器

2.1 使用 scp 上传下载文件

从本地上传文件到服务器

  1. scp -r 本地文件路径 服务器账号名@服务器ip:想要保存的路径

从服务器下载文件到本地

  1. scp -r 服务器账号名@服务器id:文件路径 本地保存路径

不过在我的实践下这种方法还是不太好，因为第三方库许多文件都要一一上传上去，因为文件数量很多，速度很慢(虽然我怀疑这有筛选exclude的功能)

2.2 使用 git 部署项目

首先在服务器上输入 git，看看系统有没有安装 git

我的阿里云ECS服务器初始带着 git，然后问题就简单了，平常开发本地项目时就上传到 github 远程仓库中，然后部署时再从远程仓库中将项目拉到远程服务器上

关于git的基本操作，建议学习廖雪峰的git教程

这里还有一个要在服务器生成 SSH 公钥，在 github 添加公钥才能从远程仓库拉项目下来，具体教程看下面的连接

服务器上的 Git - 生成 SSH 公钥

此种方法可以通过设置 .gitignore 文件忽略上传下载部分文件，大大提高效率，而且在后面更新重新部署的时候利用 git 的特性，只更新有变化的文件。

3. Centos7 安装 Node.js 和 npm

因为是 JS 的项目，需要安装 Node.js 和 npm，首先使用 node -v 和 npm -v 检查一下是否已安装

如未安装，则使用 yum 命令进行安装

安装 Node.js

  1. sudo yum install node.js

安装 npm

  1. sudo yum install npm

然后通过检查版本号的方式，检查一下是否安装完毕

4. 检查端口占用情况

此次要部署的项目是 react + koa 的前后端项目，前端服务会由 webpack-dev-server 占用 8080 端口运行，后端服务会占用 3000 端口运行，所以在项目运行前有必要检查两个端口的占用情况。

使用 lsof 检查端口占用情况，使用如下：

  1. lsof -i:8080
  3. lsof -i:3000

在本次检查时，发现 8080 端口被 java 给占用了，所以改一下前端的配置文件就好了

在这里插入图片描述

然后分别运行前端服务、后端服务就Ok了

坑1 Mac、git对大小写不敏感引起的问题

由于 Mac、git对文件名大小写不敏感，所以出现了不少例如我在代码写的引用是 Menu 文件夹，然而真正的文件夹是 menu，这就会在对大小写敏感的linux系统启动服务时发生问题

此外，git 对文件名大小写不敏感的问题，还有另外的问题，此处详情可以移步：https://blog.csdn.net/zwkkkk1/article/details/94154727

发表评论

表情：
评论列表 （有 0 条评论，756人围观）

还没有评论，来说两句吧...

相关阅读