fix: improve build process and readme (#61)

Signed-off-by: Francisco Javier Ribó Labrador <[email protected]>

README.md

@@ -56,6 +56,26 @@ Install the SDK using `npm` or `yarn`:
 
 `yarn add @input-output-hk/atala-prism-wallet-sdk`
 
+### Browser setup
+
+Some additional steps are needed to use the SDK in the browser.
+
+The library expects `didcomm_js_bg` WebAssembly file to be available in the route of 
+the project, so it need to be copied to the project's `public` folder.
+
+One way to do it could be to add the following command to the `postinstall`:
+
+```shell
+cp node_modules/@input-output-hk/atala-prism-wallet-sdk/build/browser/didcomm_js_bg.wasm ./public/
+```
+
+If you use Webpack or Rollup, appropriate plugin could be used to copy the file instead.
+
+The last needed step is to provide browser polyfills for `fs` and `path` modules. 
+We plan to remove this requirement in the future, but for now it is needed due to
+`sql.js` dependency. Providing polyfills is highly dependent on the toolchain used,
+so please refer to the documentation of your build tool for more information.
+
 ### Usage
 Once `@input-output-hk/atala-prism-wallet-sdk` is installed as a dependency, 
 package could be imported using both ES modules and CommonJS syntax.

package.json

@@ -77,13 +77,11 @@
     "@types/uuid": "^9.0.1",
     "@typescript-eslint/eslint-plugin": "^5.56.0",
     "@typescript-eslint/parser": "^5.55.0",
-    "assert": "^2.0.0",
     "babel-eslint": "^10.1.0",
     "babel-loader": "^9.1.2",
     "babel-plugin-transform-typescript-metadata": "^0.3.2",
     "babel-preset-minify": "^0.5.2",
     "babel-preset-react": "^6.24.1",
-    "buffer": "^6.0.3",
     "chai": "^4.3.7",
     "chai-as-promised": "^7.1.1",
     "clean-webpack-plugin": "^4.0.0",
@@ -120,14 +118,12 @@
     "semantic-release-slack-bot": "^3.5.3",
     "sinon": "^15.0.1",
     "sinon-chai": "^3.7.0",
-    "sqlite3": "^5.1.6",
     "stream-browserify": "^3.0.0",
     "style-loader": "^3.3.1",
     "terser-webpack-plugin": "^5.3.7",
     "typescript": "^4.9.5",
     "url": "^0.11.0",
     "url-loader": "^4.1.1",
-    "util": "^0.12.5",
     "webpack": "^5.76.0",
     "webpack-cli": "^5.0.1",
     "webpack-dev-server": "4.11.1",
@@ -140,16 +136,17 @@
     ]
   },
   "dependencies": {
-    "sql.js": "^1.8.0",
-    "@scure/bip39": "^1.1.1",
     "@scure/bip32": "^1.3.0",
+    "@scure/bip39": "^1.1.1",
     "@stablelib/base64": "^1.0.1",
     "@stablelib/sha256": "^1.0.1",
     "@stablelib/uuid": "^1.0.2",
     "@stablelib/wipe": "^1.0.1",
     "@stablelib/x25519": "^1.0.3",
     "antlr4ts": "^0.5.0-alpha.4",
+    "assert": "^2.0.0",
     "axios": "^1.3.4",
+    "buffer": "^6.0.3",
     "bn.js": "^5.2.1",
     "core-js": "^3.29.1",
     "did-jwt": "^6.11.5",
@@ -163,6 +160,9 @@
     "jsonwebtoken": "^9.0.0",
     "localforage": "^1.10.0",
     "multiformats": "^9.9.0",
-    "typeorm": "^0.3.12"
+    "sql.js": "^1.8.0",
+    "sqlite3": "^5.1.6",
+    "typeorm": "^0.3.12",
+    "util": "^0.12.5"
   }
 }

rollup/rollup.browser.mjs

@@ -2,8 +2,13 @@ import nodePolyfills from "rollup-plugin-polyfill-node";
 import inject from "@rollup/plugin-inject";
 import { wasm } from "@rollup/plugin-wasm";
 import Base from "./base.mjs";
+import modify from "rollup-plugin-modify";
 
 export default Base("browser", [
+  modify({
+    find: '"didcomm-node"',
+    replace: '"didcomm"',
+  }),
   inject({
     SQL: "sql.js/dist/sql-wasm.js",
     localforage: "localforage/dist/localforage.js",

rollup/rollup.node.mjs

@@ -3,10 +3,6 @@ import { wasm } from "@rollup/plugin-wasm";
 
 import Base from "./base.mjs";
 export default Base("node", [
-  modify({
-    find: '"didcomm"',
-    replace: '"didcomm-node"',
-  }),
   wasm({
     targetEnv: "node",
     fileName: "didcomm_js_bg.wasm",

src/mercury/didcomm/DIDResolver.ts

@@ -1,4 +1,4 @@
-import { DIDResolver, Service, VerificationMethod, DIDDoc } from "didcomm-node";
+import type { DIDResolver, Service, VerificationMethod, DIDDoc } from "didcomm-node";
 
 import * as Domain from "../../domain";
 import Castor from "../../castor/Castor";

src/mercury/didcomm/SecretsResolver.ts

@@ -1,4 +1,4 @@
-import { Secret, SecretsResolver } from "didcomm-node";
+import type { Secret, SecretsResolver } from "didcomm-node";
 import * as Domain from "../../domain";
 import { Curve, VerificationMethod, VerificationMethods } from "../../domain";
 import Apollo from "../../apollo/Apollo";

src/mercury/didcomm/Wrapper.ts

@@ -1,12 +1,12 @@
-import {
+import type {
   DIDResolver,
   Base64AttachmentData,
   SecretsResolver,
   JsonAttachmentData,
   LinksAttachmentData,
   Attachment,
   AttachmentData,
-} from "didcomm";
+} from "didcomm-node";
 import * as Domain from "../../domain";
 import Apollo from "../../apollo/Apollo";
 import Castor from "../../castor/Castor";
@@ -32,7 +32,7 @@ export async function getDidcommLibInstance(): Promise<typeof DIDCommLibTypes> {
   return DIDCommLib;
 }
 export class DIDCommWrapper implements DIDCommProtocol {
-  public static didcomm: typeof import("didcomm");
+  public static didcomm: typeof import("didcomm-node");
   private readonly didResolver: DIDResolver;
   private readonly secretsResolver: SecretsResolver;