@utoo/web 1.2.0-rc.5 → 1.2.0-rc.7

package/README.md

@@ -0,0 +1,52 @@
+# @utoo/web
+
+> 🌖 Web-compatible version of the Utoo toolchain, powered by [Turbopack](https://turbo.build/pack) and WebAssembly.
+
+`@utoo/web` brings the power of the Utoo bundler to the browser, leveraging WebAssembly to provide high-performance bundling in non-native environments. It enables a complete web development environment, including a virtual file system and dependency management, entirely within the browser.
+
+## ✨ Features
+
+- 🌐 **Browser-based Bundling**: Run the Utoo bundler directly in the browser.
+- ⚡ **WASM Powered**: High performance via WebAssembly bindings of the Turbopack-based core.
+- 🛠️ **Web Worker Support**: Offloads heavy bundling tasks to background workers to keep the UI responsive.
+- 🔌 **Webpack Compatibility**: Supports a subset of Webpack configurations in the browser.
+- 📂 **Virtual File System**: Uses Origin Private File System (OPFS) for a Node.js-like file system experience.
+
+## 🧠 Core Concepts
+
+1. **Virtual File System**: The project lives in the browser's OPFS.
+2. **Project Main Worker**: Core logic runs in a dedicated worker to keep the UI responsive.
+3. **Thread Worker**: Heavy bundling tasks are offloaded to a worker powered by a ported `tokio` runtime.
+4. **Service Worker**: Acts as a local server to intercept requests and serve built files for preview.
+
+## 📦 Installation
+
+```bash
+npm install @utoo/web
+```
+
+## 🛠️ Development
+
+### Prerequisites
+
+- Rust toolchain (nightly)
+- `wasm-bindgen-cli`
+- `binaryen` (for `wasm-opt`)
+
+### Build
+
+```bash
+# Install toolchain
+npm run install-toolchain
+
+# Build WASM and TypeScript
+npm run build
+```
+
+## 📚 Documentation
+
+For detailed API usage and examples, please refer to the [API Documentation](./API.md) ([中文版](./API_zh-CN.md)).
+
+## �📄 License
+
+[MIT](./LICENSE)

package/esm/forkedProject.d.ts

@@ -1,4 +1,4 @@
-import { PackFile, ProjectEndpoint } from "./type";
+import { PackFile, ProjectEndpoint, Stats } from "./type";
 export declare class ForkedProject implements ProjectEndpoint {
     private endpoint;
     constructor(port: MessagePort);
@@ -19,6 +19,7 @@ export declare class ForkedProject implements ProjectEndpoint {
     rmdir(path: string, options?: {
         recursive?: boolean;
     }): Promise<void>;
+    stat(path: string): Promise<Stats>;
     gzip(files: PackFile[]): Promise<Uint8Array>;
     sigMd5(content: Uint8Array): Promise<string>;
 }

package/esm/forkedProject.js

@@ -1,4 +1,5 @@
 import * as comlink from "comlink";
+import { Stats } from "./type";
 export class ForkedProject {
     constructor(port) {
         var _a;
@@ -31,6 +32,10 @@ export class ForkedProject {
     async rmdir(path, options) {
         return await this.endpoint.rmdir(path, options);
     }
+    async stat(path) {
+        const raw = (await this.endpoint.stat(path));
+        return new Stats(raw);
+    }
     async gzip(files) {
         return await this.endpoint.gzip(files);
     }

package/esm/internalProject.d.ts

@@ -1,7 +1,6 @@
-import { PackFile, ProjectEndpoint, ProjectOptions } from "./type";
-import initWasm, { Project as ProjectInternal } from "./utoo";
+import { PackFile, ProjectEndpoint, ProjectOptions, Stats } from "./type";
+import initWasm from "./utoo";
 declare class InternalEndpoint implements ProjectEndpoint {
-    projectInternal?: ProjectInternal;
     wasmInit?: ReturnType<typeof initWasm>;
     options?: Omit<ProjectOptions, "workerUrl" | "serviceWorker">;
     loaderWorkerPoolInitialized: boolean;
@@ -11,6 +10,7 @@ declare class InternalEndpoint implements ProjectEndpoint {
     readFile(path: string, encoding?: "utf8"): Promise<any>;
     writeFile(path: string, content: string | Uint8Array, _encoding?: "utf8"): Promise<void>;
     copyFile(src: string, dst: string): Promise<void>;
+    stat(path: string): Promise<Stats>;
     readdir(path: string, options?: {
         recursive?: boolean;
     }): Promise<any>;

package/esm/internalProject.js

@@ -1,5 +1,6 @@
-import { runLoaderWorkerPool } from "./loaderWorkerPool";
+import * as comlink from "comlink";
 import initWasm, { init_log_filter, Project as ProjectInternal, } from "./utoo";
+import { runLoaderWorkerPool } from "./webpackLoaders/loaderWorkerPool";
 class InternalEndpoint {
     constructor() {
         this.loaderWorkerPoolInitialized = false;
@@ -14,53 +15,67 @@ class InternalEndpoint {
         // Initialize log filter after wasm init
         const filter = logFilter || "pack_core=info,pack_api=info,utoo_wasm=info";
         init_log_filter(filter);
-        this.projectInternal = new ProjectInternal(cwd, threadWorkerUrl);
+        const absoluteCwd = cwd.startsWith("/") ? cwd : "/" + cwd;
+        ProjectInternal.init(threadWorkerUrl || "");
+        ProjectInternal.setCwd(absoluteCwd);
         return;
     }
     async install(packageLock, maxConcurrentDownloads) {
         await this.wasmInit;
-        await this.projectInternal.install(packageLock, maxConcurrentDownloads);
+        await ProjectInternal.install(packageLock, maxConcurrentDownloads);
         return;
     }
     async build() {
         var _a, _b;
         const binding = await this.wasmInit;
         if (((_a = this.options) === null || _a === void 0 ? void 0 : _a.loaderWorkerUrl) && !this.loaderWorkerPoolInitialized) {
-            runLoaderWorkerPool(binding, this.options.cwd, this.projectInternal, this.options.loaderWorkerUrl, (_b = this.options) === null || _b === void 0 ? void 0 : _b.loadersImportMap);
+            runLoaderWorkerPool(binding, this.options.cwd, this.options.loaderWorkerUrl, (_b = this.options) === null || _b === void 0 ? void 0 : _b.loadersImportMap);
             this.loaderWorkerPoolInitialized = true;
         }
-        return await this.projectInternal.build();
+        return await ProjectInternal.build();
     }
     async readFile(path, encoding) {
         await this.wasmInit;
         let ret;
         if (encoding === "utf8") {
-            ret = await this.projectInternal.readToString(path);
+            ret = await ProjectInternal.readToString(path);
         }
         else {
-            ret = await this.projectInternal.read(path);
+            ret = await ProjectInternal.read(path);
+            return comlink.transfer(ret, [ret.buffer]);
         }
         return ret;
     }
     async writeFile(path, content, _encoding) {
         await this.wasmInit;
         if (typeof content === "string") {
-            return await this.projectInternal.writeString(path, content);
+            return await ProjectInternal.writeString(path, content);
         }
         else {
-            return await this.projectInternal.write(path, content);
+            return await ProjectInternal.write(path, content);
         }
     }
     async copyFile(src, dst) {
         await this.wasmInit;
-        return await this.projectInternal.copyFile(src, dst);
+        return await ProjectInternal.copyFile(src, dst);
+    }
+    async stat(path) {
+        await this.wasmInit;
+        const metadata = await ProjectInternal.metadata(path);
+        const json = metadata.toJSON();
+        const raw = {
+            type: json.type,
+            size: Number(json.file_size),
+        };
+        // WARN: This is a hack, functions can not be structurally cloned
+        return raw;
     }
     async readdir(path, options) {
         await this.wasmInit;
         const dirEntries = (options === null || options === void 0 ? void 0 : options.recursive)
-            ? await this.projectInternal.readDir(path)
+            ? await ProjectInternal.readDir(path)
             : // TODO: support recursive readDirAll
-                await this.projectInternal.readDir(path);
+                await ProjectInternal.readDir(path);
         const rawDirents = dirEntries.map((e) => {
             const dir = e.toJSON();
             return {
@@ -74,20 +89,20 @@ class InternalEndpoint {
     async mkdir(path, options) {
         await this.wasmInit;
         if (options === null || options === void 0 ? void 0 : options.recursive) {
-            return await this.projectInternal.createDirAll(path);
+            return await ProjectInternal.createDirAll(path);
         }
         else {
-            return await this.projectInternal.createDir(path);
+            return await ProjectInternal.createDir(path);
         }
     }
     async rm(path, options) {
         await this.wasmInit;
-        let metadata = (await this.projectInternal.metadata(path)).toJSON();
+        let metadata = (await ProjectInternal.metadata(path)).toJSON();
         switch (metadata.type) {
             case "file":
-                return await this.projectInternal.removeFile(path);
+                return await ProjectInternal.removeFile(path);
             case "directory":
-                return await this.projectInternal.removeDir(path, !!(options === null || options === void 0 ? void 0 : options.recursive));
+                return await ProjectInternal.removeDir(path, !!(options === null || options === void 0 ? void 0 : options.recursive));
             default:
                 // nothing to remove now
                 break;
@@ -95,15 +110,16 @@ class InternalEndpoint {
     }
     async rmdir(path, options) {
         await this.wasmInit;
-        return await this.projectInternal.removeDir(path, !!(options === null || options === void 0 ? void 0 : options.recursive));
+        return await ProjectInternal.removeDir(path, !!(options === null || options === void 0 ? void 0 : options.recursive));
     }
     async gzip(files) {
         await this.wasmInit;
-        return await this.projectInternal.gzip(files);
+        const ret = await ProjectInternal.gzip(files);
+        return comlink.transfer(ret, [ret.buffer]);
     }
     async sigMd5(content) {
         await this.wasmInit;
-        return await this.projectInternal.sigMd5(content);
+        return await ProjectInternal.sigMd5(content);
     }
 }
 const internalEndpoint = new InternalEndpoint();