当我们的vue项目打包成dist文件后,我们无需下载 xhell 等其它软件直接使用 vscode 下载 SFTP插件进行配置

#下载SFTP插件

在 vscode 中按 CTRL + SHIFT + X 切出左侧应用商店并搜索 SFTP,点击下载

#切出vscode命令行工具栏

按 CTRL + SHIFT + P切出顶部正中的命令行, 输入 SFTP:config, 然后回车, 会自动在当前项目根路径创建一个 .vscode文件夹,该文件夹下有一个sftp.json

          
1
2
3
4
5
6
7
8
9
10
          {
    "name": "My Server",   // 名字随便起一个
    "host": "localhost",   // 你的服务器地址
    "protocol": "sftp",    // 协议 sftp, 不用修改
    "port": 22,            // 端口 默认 22, 不用修改
    "username": "username",// 你的服务器用户名
    "password": "password",// 你的服务器用户密码
    "remotePath": "/",     // 要上传的服务器路径位置,默认根路径,可以修改
    "uploadOnSave": false  // 创建时为 true,需要修改为false,不然每次保存都会上传,很容易把不必要的文件上传了
}

        

然后在 vscode 文件目录中找到打包后的 dist 文件(也可能修改过文件目录名),右键菜单中会有 一个 Upload Folder,点击上传,左下角 sftp 状态栏会有文件闪烁,表示在上传, 上传完成后会有 done字样,然后消失