How to use web/phpstorm to automatically synchronize local code to a remote server in real time

Scenario

If the development and testing environments are different, or the machine used frequently is Windows, the project The requirement must be liunx. At this time, I chose to install liunx on the virtual machine, deploy the ssh service, install winscp on the host machine with putty, and use webstorm development. For the current mainstream webpack hot compilation of the web front end, it is really tiring to transfer files to the virtual machine all the time. thing, so choose the automatic synchronization tool.

Settings

Configuration basic information

Select Tools – Deployment – ​​Configuration in the webstom editor, add a remote host, this name is just for notes, write whatever you want, select the protocol FTP (also supports SFTP, local, etc.)

At this time, the main thing is to fill in the FTP information of the remote host, in addition to the basic FTP information In addition to filling in, you also need to fill in the following information:

Root path  //这个选项是要打开的路径，这样做主要是为了防止误操作影响项目，填写后上级目录不会展示，当然你可以不写

Web server root URL   //这里就是调试的网址

In addition, you need to configure the file mapping between local and server, as shown in the figure below:

Finally , we can then adjust the mapping between local and remote hosts. If you want to add multiple remote hosts, remember to click Use this server as default on the item you want to use.
After the remote host is configured, we can take a look at the directory structure. Click Tools – Deployment – ​​Broswse Remote Host, and then you will see the remote files.

Set up synchronization

But to achieve synchronization at this time, manual transmission is still required. It is still a little short of automation. Open Tools – Deployment – ​​Options. We changed the Upload changed files item to On explicit save action, which means that each save will be synchronized to the remote server.