EN: A simple, high-performance, and comprehensive file system API running in the browser, built on OPFS.
CN: 在浏览器中运行的简单、高性能、完备的文件系统 API,基于 OPFS 构建。
import { file, dir, write } from 'opfs-tools'; // --------- Create / Write --------- await dir('/test-dir').create(); // create a directory await write('/dir/file.txt', ''); // empty file await write('/dir/fetch-file', (await fetch('//example.com')).body); // inputFile from the input element picked by the user await write('/dir/input-file', inputFile.stream()); // For incremental file writes, please refer to the API documentation. const writer = await file('/dir/file').createWriter(); // --------- Read --------- await file('/dir/file.txt').text(); await file('/dir/input-file').arrayBuffer(); await file('/dir/input-file').stream(); // If you want to read file fragments, please refer to the API documentation. const reader = await file('/dir/input-file').createReader(); await dir('/test-dir').children(); // --------- Remove --------- await dir('/test-dir').remove(); await file('/dir/file.txt').remove(); // --------- copyTo / moveTo --------- await file('/dir/file').copyTo(file('/dir/file copy1')); await dir('/dir').moveTo(dir('/.Trash')); // --------- import/export file ----------- const [impHandle] = await window.showOpenFilePicker(); write('/import-file', (await impHandle.getFile()).stream()); const expHandle = await window.showSaveFilePicker({ suggestedName: `opfs-export-file`, }); (await file('/export-file').stream()).pipeTo(await expHandle.createWritable()); // --------- upload ------------- const formData = new FormData(); formData.append('file', await file('/upload-file').getOriginFile()); await fetch('/upload', { method: 'post', headers: { 'Content-Type': 'multipart/form-data' }, body: formData, });-
opfs-finder
使用 AI + OPFS 在浏览器中实现 MacOS Finder。Implement MacOS Finder in the browser using AI + OPFS.
-
opfs-tools-explorer
Manage OPFS assets in your web site, supporting file creation, copying, and moving features, providing a user-friendly interactive experience.

- Basic operations
- file
- remove
- exists
- dir
- create
- remove
- exists
- children
- file
- Reading files
- getSize
- text
- stream
- arrayBuffer
- Random reading
- reader = file.createReader
- reader.read(bufLen, { at }
- reader.close
- Writing files
- write(dest: string, input: string)
- write(dest: string, input: ArrayBuffer | ArrayBufferView)
- write(dest: string, input: ReadableStream)
- Random writing
- writer = file.createWriter
- writer.write
- writer.flush
- writer.truncate
- writer.close