fix compiling errors; ditch webpack for vite

examples/chat/public/index.html → examples/chat/index.html

@@ -46,6 +46,6 @@ <h1>Topology Protocol - Chat</h1>
       });
     </script>
 
-    <script src="./static/bundle/script.js"></script>
+    <script type="module" src="/src/index.ts"></script>
   </body>
 </html>

examples/chat/package.json

@@ -10,6 +10,7 @@
     "@topology-foundation/network": "0.0.23-5",
     "@topology-foundation/node": "0.0.23-5",
     "@topology-foundation/object": "0.0.23-5",
+    "browserify-fs": "^1.0.0",
     "crypto-browserify": "^3.12.0",
     "process": "^0.11.10",
     "stream-browserify": "^3.0.0",
@@ -20,14 +21,16 @@
     "@types/node": "^20.11.16",
     "ts-loader": "^9.3.1",
     "typescript": "^4.7.4",
+    "vite": "^5.4.1",
+    "vite-plugin-node-polyfills": "^0.22.0",
     "webpack": "^5.74.0",
     "webpack-cli": "^5.1.4",
     "webpack-dev-server": "^5.0.4"
   },
   "scripts": {
-    "build": "webpack",
+    "build": "vite build",
     "clean": "rm -rf dist/ node_modules/",
-    "dev": "webpack serve",
+    "dev": "vite serve",
     "start": "ts-node ./src/index.ts"
   }
 }

examples/chat/src/handlers.ts

@@ -1,7 +1,7 @@
 import { toString as uint8ArrayToString } from "uint8arrays/to-string";
 import { addMessage, Chat } from "./objects/chat";
 
-export const handleChatMessages = (chat: ChatI, e: any) => {
+export const handleChatMessages = (chat: Chat, e: any) => {
   if (e.detail.msg.topic === "topology::discovery") return;
   const input = uint8ArrayToString(e.detail.msg.data);
   const message = JSON.parse(input);

examples/chat/src/index.ts

@@ -3,10 +3,11 @@ import * as topology from "@topology-foundation/node";
 import { Chat, addMessage, getMessages } from "./objects/chat";
 import { handleChatMessages } from "./handlers";
 import { GSet } from "@topology-foundation/crdt";
-import { newTopologyObject } from "@topology-foundation/object";
+import { newTopologyObject, TopologyObject } from "@topology-foundation/object";
 
 const node = new TopologyNode();
 // CRO = Conflict-free Replicated Object
+let topologyObject: TopologyObject;
 let chatCRO: Chat;
 let peers: string[] = [];
 let discoveryPeers: string[] = [];
@@ -65,20 +66,20 @@ async function main() {
   await node.start();
   render();
 
-  node.addCustomGroupMessageHandler(chatCRO.cro.id, (e) => {
+  node.addCustomGroupMessageHandler(topologyObject.id, (e) => {
     handleChatMessages(chatCRO, e);
     peers = node.networkNode.getAllPeers();
     discoveryPeers = node.networkNode.getGroupPeers("topology::discovery");
-    if (chatCRO) objectPeers = node.networkNode.getGroupPeers(chatCRO.cro.id);
+    if (chatCRO) objectPeers = node.networkNode.getGroupPeers(topologyObject.id);
     render();
   });
 
   let button_create = <HTMLButtonElement>document.getElementById("createRoom");
   button_create.addEventListener("click", async () => {
-    chatCRO = await newTopologyObject(node.networkNode.peerId, "./objects/chat.ts")
+    topologyObject = await newTopologyObject(node.networkNode.peerId, "./objects/chat.ts");
 
-    topology.createObject(node, chatCRO);
-    (<HTMLButtonElement>document.getElementById("chatId")).innerHTML = chatCRO.cro.id;
+    // topology.createObject(node, chatCRO);
+    (<HTMLButtonElement>document.getElementById("chatId")).innerHTML = topologyObject.id;
     render();
   });
 
@@ -90,7 +91,9 @@ async function main() {
       alert("Please enter a room id");
       return;
     }
-    await topology.subscribeObject(node, objectId, true);
+
+    //objectId
+    await topology.subscribeObject(node, new Uint8Array(), true);
   });
 
   let button_fetch = <HTMLButtonElement>document.getElementById("fetchMessages");
@@ -105,9 +108,9 @@ async function main() {
       let arr: string[] = Array.from(object["chat"]["_set"]);
       object["chat"]["_set"] = new Set<string>(arr);
       object["chat"] = Object.assign(new GSet<string>(new Set<string>()), object["chat"]);
-      chatCRO = Object.assign(new Chat(node.networkNode.peerId), object);
+      chatCRO = Object.assign(new Chat(), object);
 
-      (<HTMLButtonElement>document.getElementById("chatId")).innerHTML = chatCRO.cro.id;
+      (<HTMLButtonElement>document.getElementById("chatId")).innerHTML = topologyObject.id;
       render();
     } catch (e) {
       console.error("Error while connecting to the CRO ", objectId, e);

examples/chat/src/objects/chat.ts

@@ -1,26 +1,41 @@
-// @ts-ignore
-import { GSet, gset_create, gset_add, gset_merge } from "@topology-foundation/crdt/src/index.asc";
+// if it can't compile, append src/index.asc to the import path on runtime
+import { GSet, gset_create, gset_add, gset_merge } from "@topology-foundation/crdt";
 
 export class Chat {
   // store messages as strings in the format (timestamp, message, peerId)
   messages: GSet<string>;
   constructor() {
     this.messages = gset_create<string>();
   }
+
+  addMessage(timestamp: string, message: string, node_id: string): void {
+    this.messages.add(`(${timestamp}, ${message}, ${node_id})`)
+  }
+
+  getMessages(): GSet<string> {
+    return this.messages;
+  }
+
+  merge(other: Chat): void {
+    this.messages.merge(other.messages);
+  }
 }
 
 export function createChat(): Chat {
   return new Chat();
 }
 
+// @ts-ignore
 export function addMessage(chat: Chat, timestamp: string, message: string, node_id: string): void {
   gset_add(chat.messages, `(${timestamp}, ${message}, ${node_id})`)
 }
 
+// @ts-ignore
 export function getMessages(chat: Chat): GSet<string> {
   return chat.messages;
 }
 
+// @ts-ignore
 export function merge(chat: Chat, other: Chat): void {
   gset_merge(chat.messages, other.messages);
 }

examples/chat/tsconfig.json

@@ -1,14 +1,14 @@
 {
-    "compilerOptions": {
-        "target": "es6",
-        "module": "ESNEXT",
-        "rootDir": ".",
-        "strict": true,
-        "moduleResolution": "node",
-        "allowSyntheticDefaultImports": true,
-        "allowJs": true,
-        "esModuleInterop": true,
-        "skipLibCheck": true,
-        "forceConsistentCasingInFileNames": true
-    }
+  "compilerOptions": {
+      "target": "ESNext",
+      "module": "ESNext",
+      "rootDir": ".",
+      "strict": true,
+      "moduleResolution": "node",
+      "allowSyntheticDefaultImports": true,
+      "allowJs": true,
+      "esModuleInterop": true,
+      "skipLibCheck": true,
+      "forceConsistentCasingInFileNames": true
+  }
 }

examples/chat/vite.config.mts

@@ -0,0 +1,16 @@
+import { defineConfig } from 'vite'
+import { nodePolyfills } from 'vite-plugin-node-polyfills'
+
+export default defineConfig({
+  build: {
+    target: 'esnext',
+  },
+  plugins: [
+    nodePolyfills(),
+  ],
+  optimizeDeps: {
+    esbuildOptions: {
+      target: 'esnext'
+    }
+  },
+})

packages/crdt/package.json

@@ -18,6 +18,10 @@
     ".": {
       "types": "./dist/src/index.d.ts",
       "import": "./dist/src/index.js"
+    },
+    "./wasm": {
+      "types": "./dist/src/index.d.ts",
+      "import": "./src/index.asc.ts"
     }
   },
   "scripts": {

packages/crdt/src/builtins/GSet/index.ts

@@ -1,5 +1,4 @@
 /* GSet with support for state and op changes */
-
 export class GSet<T> {
   set: Set<T>;
 

packages/object/src/index.ts

@@ -4,12 +4,6 @@ import { compileWasm } from "./wasm/compiler.js";
 
 export * from "./proto/object_pb.js";
 
-async function compileCRO(path: string): Promise<Uint8Array> {
-  // get the bytecode from the wasm compiler and abi
-  // TODO: abi not extracted yet
-  return compileWasm(path);
-}
-
 /* Creates a new TopologyObject */
 export async function newTopologyObject(peerId: string, path: string, id?: string, abi?: string): Promise<TopologyObject> {
   const bytecode = await compileWasm(path);
@@ -32,13 +26,5 @@ export async function callFn(obj: TopologyObject, fn: string, args: string[]): P
     fn: fn,
     args: args
   });
-
   return obj;
 }
-
-async function run() {
-  // TODO: just for testing wasm compilation with tsx, should be deleted
-  let obj = await newTopologyObject("peerId", "/Users/droak/code/topology/ts-topology/examples/chat/src/objects/chat.ts", "", "");
-  console.log(obj);
-}
-// run();