Features Releases WebStorm

Comparing Files and Folders within your IDE

Sometimes you have several different versions of files or folders related to your project locally, or you’ve just downloaded it from a remote source. In this case it’s crucial to work with the most up-to-date copy. If you need to merge changes and synchronise folders,  then it can become even more complicated, as well as difficult to perform manually without any support.

The good news is that you can quickly and conveniently compare and/or synchronize files/folders with guidance and support from your IDE, without any external tools. PhpStorm and other IntelliJ Platform IDEs help you explore differences in many situations: differences between files, directories, revisions of the same file under version control or in the local history, database objects, or local and remote files.

In this post we focus on local files and folders comparison.

This functionality is available in IntelliJ Idea, PyCharm, WebStorm, PhpStorm, RubyMine, and AppCode.

Comparing Files

You can compare a) any two files in your project, b) a selected file with the one opened in the editor, or c) a file in the editor with the clipboard contents. All comparisons are performed in the Differences Viewer.

To compare two files, press and hold Ctrl and click two files in the Project tool window. From the context menu of the selection, choose Compare Two Files (or Ctrl+D). If you select a single file in the Project tool window, the context menu command is Compare File with Editor. The Differences Viewer shows the contents of the selected file on the left pane, and the contents of the active editor tab on the right pane.

To compare a file with the clipboard contents, open the file in the editor, right-click the editor pane and choose Compare with Clipboard from the context menu:

Difference Viewer shows all the differences and highlights the source code. You can move between changes and perform actions by clicking the icons (e.g. insert, etc.).

Comparing Folders

Folders are compared by comparing all the files in the two folders based on their file sizes, contents, or timestamps. The Differences Viewer shows the contents of the selected directories in the left and right panes. The contents of the selected file are shown in the lower pane, with the differences highlighted. In addition to exploring differences, you can also use this tool to synchronize the folders’ contents.

To compare two folders, press and hold Ctrl and click two directories in the Project tool window, then choose Compare Directories from the context menu of the selection (or press Ctrl+D). Alternatively, you can select a folder in the Project tool window, choose Compare with from the context menu of the selection, and then select the second directory in the dialog:

In the Difference Viewer you can check all the differences and perform any actions you need. Files can be moved from one folder to another, and folders can be fully synchronized.

You can also open the Difference Viewer without running PhpStorm. Use this command: <path to PhpStorm executable file> diff <path_1> <path_2> where path_1 and path_2 are paths to the folders you need compared.

Use these IDE features to compare files and folders so you can always work with the latest version of your source code.

Develop with pleasure!
– JetBrains Web IDE Team

image description