Read contents of a directory with the File System Access API.
Read contents of a directory with the File System Access API.
Live demo: browser-fs-readdir.prin.studio (source code)
``bash`
npm install browser-fs-readdir
`ts
import readdir from 'browser-fs-readdir';
// Use with showDirectoryPicker
const directoryHandle = await window.showDirectoryPicker();
const files = await readdir(directoryHandle, { recursive: true });
console.log(files.map((file) => file.webkitRelativePath));
// Use with DataTransferItem
const items = event.dataTransfer.items;
const directoryHandle = await items[0].getAsFileSystemHandle();
const files = await readdir(directoryHandle);
console.log(files.map((file) => file.webkitRelativePath));
``
Chrome 86+ on desktop is supported.
- FileSystemDirectoryHandle
- window.showDirectoryPicker()
- DataTransferItem.getAsFileSystemHandle()
browser-fs-access (Apache-2.0)