How to get the path of a local file in Electron.js

Photo by Lili Popper on Unsplash

Getting the path of a local file in Electron.js may be easier than you think. Here are the steps:

Step 1 of 2: Add an <input> element to index.html

In your index.html, add an <input> element:

// index.html...
<input type="file" id="file-input">
...

Step 2 of 2: Add a change handler for the <input> element in index.js

In your index.js file, add an event handler:

// index.js...
document.getElementById('file-input').addEventListener('change', function() {
console.log(this.files[0].path);
});
...

And voila! That’s it.