如何使用 VSCode 远程编辑网站文件？

Question

我需要能够为我的客户远程登录 Web 服务器并远程编辑代码。我主要将其用于 CSS 更改，但也开始使用 PHP。

我试图让远程编辑器工作，但它不会拾取我放在 /home 文件夹中的 .remote 文件。这些说明并没有真正提供有关设置的详细信息。

我该怎么办？

Answer 1

使用 FTP 客户端（如 FileZilla），然后将 VSCode 设置为默认编辑器。任何时候你打开一个文件，它都会在 VSCode 中打开它。我强烈建议您将所有代码下载到您自己的计算机上并将其用作开发环境，然后，当您完成更改后，备份您的站点，然后将修改后的文件一起上传。不需要在您自己的机器上编辑文件，但如果您出于任何原因需要恢复到旧版本（例如您在代码中犯了错误，现在什么都不能正常工作），建议您这样做。

或者，您可以使用FTP Sync 之类的扩展名在本地编码，并自动为您同步文件。

Answer 2

有几种方法都与编辑器无关。

首先，sshfs 是跨平台的，您可以通过操作系统包管理器进行安装。一个简单的方法如下：

mkdir -p ~/mnt/server
sshfs user@server.example.com:/path/on/server ~/mnt/server

之后，您可以在 ~/mnt/server 本地获得来自 server.example.com 的完整文件夹结构。确保设置 SSH 密钥以避免每次都输入用户密码。你可以在网上到处找到这方面的教程。

对于仅提供 FTP 访问（共享主机等）的服务器，您可以以相同的方式使用 curlftpfs。

要关闭连接，只需卸载：

umount ~/mnt

对于基于 GUI 的方法，您有多种选择。有 Transmit (macOS)，它将安装连接作为卷，Forklift (macOS)，它是一个 Finder 替代品，可以做同样的事情，ExpanDrive (macOS/Windows) 和我最喜欢的 Mountain Duck (macOS/窗户）。

如果您计划移动大量数据，尤其是大量小文件，根据我的经验，Mountain Duck 的表现最好。

Answer 3

使用 FileZilla，然后将 VScode 设置为默认编辑器（编辑->设置->文件编辑->文件类型关联并插入“php /usr/bin/code”）。好的，现在你需要在 FTP 上选择你的文件并按“查看/编辑”，然后你的文件在 VScode 编辑器中打开。完成:)

Answer 4

只需输入这是 Filezilla Settings->File Editing-> File Association

php /snap/bin/code

Answer 5

打开filezilla->编辑->文件编辑->使用自定义编辑器->浏览（找到可视化代码路径）

查找可视代码路径->右键单击可视代码并打开位置并将该位置粘贴到浏览菜单并找到可视代码快捷方式

在 filzilla 上按确定后，它会正常工作

Answer 6

打开 Filezilla -> 编辑 -> 设置 -> 文件编辑 -> 文件类型关联

现在您将在窗口的右窗格中看到“自定义文件类型关联：”。 在那里你必须编写打开 VSCode for PHP 文件的命令。

步骤 1：在您的计算机上搜索并找到 VSCode Exe 文件设置安装目录。就我而言，它是 (C:\Users\Shubham\AppData\Local\Programs\Microsoft VS Code/Code.exe)

第二步：复制“.​​exe”文件的目录路径链接，回到Filezilla里面的“自定义文件类型关联：”。

第 3 步：现在输入“php”，然后输入空格并将复制的目录路径粘贴在双引号内，然后再次输入空格并输入“-open”。最终的代码应该是这样的

php "C:\Users\Shubham\AppData\Local\Programs\Microsoft VS Code/Code.exe" -open

第 4 步：点击确定按钮并喝杯咖啡。

Answer 7

打开Filezilla -> Edit -> Settings -> File Editing -> Filetype associations 然后输入：

php "C:\Users\<username>\AppData\Local\Programs\Microsoft VS Code\Code.exe" %f

注意：用您的 Windows 用户名替换 <username>

奖励： php 可以替换为任何类型的文件格式。只需将文件扩展名写成小写即可。

Answer 8

请务必以管理员身份启动 Filezilla。这就是为什么它对我不起作用的原因。

Answer 9

我看到的大多数答案都是针对 Windows 的。如果有人想在 Filezilla 中使用 Linux 关联文件类型，路径有点不同。

htm /snap/bin/code --force-user-env --no-sandbox --unity-launch
html /snap/bin/code --force-user-env --no-sandbox --unity-launch
js /snap/bin/code --force-user-env --no-sandbox --unity-launch
php /snap/bin/code --force-user-env --no-sandbox --unity-launch 

您不需要使用额外的标志，但它们正在菜单快捷方式中使用，因此我将它们包括在内。

Answer 10

打开 Filezilla 并转到 编辑 >> 设置

点击文件编辑，并设置单选按钮使用自定义编辑器

在下面的文本字段中你需要输入Visual Studio Code的完整路径，这个通常在/usr/bin/目录下，所以你需要输入下面的 /usr/bin/code

接下来选择单选按钮始终使用默认编辑器并点击OK完成设置。

Answer 11

我将 Filezilla 编辑器设置为文本文件的默认编辑器，并使用此注册表更新将 vscode 设置为我的默认文本文件编辑器（复制并粘贴到 update.reg，打开 regedit 并导入文件）：

Windows Registry Editor Version 5.00

[HKEY_CLASSES_ROOT\SystemFileAssociations\text\shell\edit\command]
@=hex(2):22,00,25,00,55,00,53,00,45,00,52,00,50,00,52,00,4f,00,46,00,49,00,4c,\
  00,45,00,25,00,5c,00,41,00,70,00,70,00,44,00,61,00,74,00,61,00,5c,00,4c,00,\
  6f,00,63,00,61,00,6c,00,5c,00,50,00,72,00,6f,00,67,00,72,00,61,00,6d,00,73,\
  00,5c,00,4d,00,69,00,63,00,72,00,6f,00,73,00,6f,00,66,00,74,00,20,00,56,00,\
  53,00,20,00,43,00,6f,00,64,00,65,00,5c,00,43,00,6f,00,64,00,65,00,2e,00,65,\
  00,78,00,65,00,22,00,20,00,25,00,31,00,00,00

之后注册表更新如下：

当然，您不应该相信您在互联网上找到的十六进制编码的注册表更新。所以复制22,00 ... 00,00，去掉所有反斜杠、换行符和空格，通过one of many hex to ascii online converters进行转换，验证导入：

进行此更改后，您甚至可以通过“编辑”上下文菜单条目使用 vscode 编辑文本文件：