Appearance
远程开发
免密登录
使用 ssh 免密登录可以减少每次登录服务器输入密码的麻烦,后面讲到的FTP同步
与远程开发
,都需要以免密登录为前提。
创建服务器帐号
以root
帐号登录服务器并添加普通帐号
sudo useradd -m xj
修改密码
sudo passwd xj
删除帐号
sudo userdel -r xj
配置 SSH 帐号
首先需要配置 ssh 连接,这样可以免密码登录到服务器,如果你配置失败可以省略这一步,只不过登录时每次就要输入密码了。
生成密钥,如果本地已经有了就不要生成了(重复生成会让原来的 GIT 提交等失效),会提示
Overwrite (y/n)?
选择 nssh-keygen -t rsa
将密钥添加到远程服务器
ssh-copy-id xj@192.168.31.90
现在登录就不需要密码了
ssh xj@192.168.31.90
编辑
vim ~/.ssh/config
文件添加以下内容Host houdunren Hostname 192.168.31.90 Port 22 User xj
现在直接使用
ssh houdunren
就可以登录服务器了
如果还不能登录将宿主机(mac 或 windows)
~/.ssh/known_hosts
文件中该 LINUX 服务器的记录行删除
FTP 同步
虽然 VSCODE 可以远程开发,但是对于远程服务器配置比较低的情况会造成严重的卡顿,更可造成服务器死机。使用 SFTP 插件可以较好的解决这个问题。
同时该插件提供了文件监控,即有新增或修改文件时会自动同步,该特性比较适合于前端编译时生成的文件自动上传。
安装插件
首先安装 SFTP 插件
配置说明
下面对配置文件中的配置项进行说明
配置 | 说明 |
---|---|
name | 用于标识配置的名称 |
host | 主机地址 |
protocol | 使用协议,支持 sftp 与 ftp |
port | 端口号 |
username | 远程服务器用户名 |
remotePath | 远程服务器同步目录 |
password | 远程帐号密码,password 与 privateKeyPath 二选一 |
privateKeyPath | 用户 SSH 私钥的路径,请查看后盾人关于免密登录的文档 |
uploadOnSave | 自动上传文件 |
watcher 配置用于监控外部文件修改,设置为 false 时监控所有文件,下面来进行说明。
选项 | 说明 |
---|---|
"files": "public/**" | 监控 public 目录下的所有文件 |
"files": "dist/*.{js,css}" | 监控 dist 目录下的所有 js 与 css 文件 |
autoUpload | 本地文件变化后,自动上传到远程服务器 |
autoDelete | 本地删除后,自动删除远程文件 |
FTP
因为配置简单所以使用 FTP 上传是推荐的方式。
使用 ctrl+shift+p
调用命令输入窗口,选择 SFTP:Config
选项进行配置,下面是一个配置文件示例
下面是 ftp 的配置项,其中 connectTimeout
配置项可以尝试调小,这样可以提升传输速度。
{
"name": "dev.hdcms.com",
"host": "dev.hdcms.com",
"protocol": "ftp",
"port": 21,
"username": "帐号",
"password": "密码",
"remotePath": "/",
"uploadOnSave": true,
"connectTimeout": 500,
"watcher": {
"files": "**/*",
"autoUpload": true,
"autoDelete": true
},
"ignore": [".vscode", ".git", "node_modules", ".env", "storage", "data"]
}
SFTP
SFTP 是使用服务器系统帐号进行文件上传。
使用 ctrl+shift+p
调用命令输入窗口,选择 SFTP:Config
选项进行配置,下面是一个配置文件示例
{
"name": "dev.hdcms.com",
"host": "dev.hdcms.com",
"protocol": "sftp",
"port": 22,
"username": "xj",
"remotePath": "/www/wwwroot/dev.hdcms.com",
"privateKeyPath": "/Users/hd/.ssh/id_rsa",
"uploadOnSave": true,
"watcher": {
"files": "**/*",
"autoUpload": true,
"autoDelete": true
},
"ignore": [".vscode", ".git", "node_modules", ".env", "storage"]
}
注意:这里填写的帐号是系统帐号,而不是虚拟主机(如宝塔面板)的 FTP 帐号。
下面将主要参数进行说明
参数 | 说明 |
---|---|
name | 配置名 |
host | 远程主机地址 |
username | 远程服务器登录帐号 |
remotePath | 远程服务器目录 |
privateKeyPath | 本地 SSH 密钥文件 |
uploadOnSave | 保存自动上传 |
files | 监听的文件 ** 指包括子目录 |
autoUpload | 保存后自动上传 |
autoDelete | 本地删除后服务器也删除 |
ignore | 不上传的文件夹,包括保存与右键上传时都不上传 |
添加帐号
登录远程服务器并添加系统帐号和设置帐号密码
#添加帐号
sudo useradd xj
#设置密码
sudo passwd xj
更改网站目录权限使新帐号可以进行写入操作。
sudo chmod 0777 /www/wwwroot/dev.hdcms.com
远程开发
以往只能使用 vim 登录服务器进行开发,vscode 现在也支持在远程服务器进行开发。
配置远程开发可以在家里、公司、出差时在使用不同电脑时不需要重复配置服务器环境。多端使用同一个环境进行开发。
- 远程开发会占用服务器性能,所以要求服务器具有比较好的配置
- 如果有前端编译任务,直接在远程服务器开发,可能会让服务器死机
本地插件安装
Remote - SSH 是 vscode 中用于完成远程开发的插件。
使用
ctrl+shift+p
弹出菜单中执行Remote-SSH:Connect to Host...
选择你帐号的 ssh 配置文件
之后选择其中的一个主机连接,稍等片刻就可以打开远程文件了
现在文件打开操作、命令行操作都是在远程上完成的了,如果当前文件夹内容太多,可以只打开项目文件夹软件运行速度会快些。
服务器插件
走到这步已经可以使用 vscode 在远程服务器上开发了,但是远程服务器并没有安装相关的 VSCODE 插件。
打开插件面板选择要在远程服务器上安装的插件
zsh
如果远程使用 zsh 将会造成使用 vscode 创建的文件权限为700,需要以下几步处理
服务器 shell 改为 bash
chsh -s /bin/bash
设置 vscode 配置
"terminal.integrated.shell.linux": "/bin/zsh"
解除文件限制
对于工作区中文件数特别多的项目,会提示“可视化工作室代码无法监视此大型工作区中的文件更改”,需要修改 LINUX 操作系统配置。
打开配置文件
sudo vim /etc/sysctl.conf
将下面代码添加到文件的末尾
fs.inotify.max_user_watches=524288
下面在 VSCODE 软件中进行设置,在配置项中搜索 files.watcherExclude
关键词,并添加以下内容
"**/.git/objects/**": true,
"**/.git/subtree-cache/**": true,
"**/node_modules/*/**": true