Learn how to show in the file explorer of the operative system a folder or a file easily with Electron framework.

Instead of force your user to navigate manually to a file, you may want to open it and focus it in the file browser automatically. Believe me, your user will be grateful.

To open and focus a file or browser in the file explorer of your computer, we are going to get access to the shell module of electron.

The shell module provides functions related to desktop integration, to get access to the shell module use a simple require :

const {shell} = require('electron');

Note: on older versions of electron, you need to access the shell module using remote.

var remote = require('electron').remote;
var shell = remote.shell;

Show in the file manager

As said before, the shell module provides a couple of useful methods, in this case we are going to use the showItemInFolder method to achieve our goal.

// Show a folder in the file manager
shell.showItemInFolder('C:Users/sdkca');
// Or a file
shell.showItemInFolder('C:Users/sdkca/myfile.txt');

The folder (or the file) will be automatically selected if possible in the file manager as shown in the following image :

Desktop folder


Senior Software Engineer at Software Medico. Interested in programming since he was 14 years old, Carlos is a self-taught programmer and founder and author of most of the articles at Our Code World.

Sponsors