add iife style script for casual use

Author: kateinoigakukun

packages/npm-packages/ruby-wasm-wasi/package-lock.json

@@ -27,15 +27,16 @@
     "format": "prettier --write ."
   },
   "devDependencies": {
+    "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "^13.1.3",
     "@rollup/plugin-typescript": "^8.3.0",
     "@types/jest": "^27.4.0",
+    "@wasmer/wasi": "^0.12.0",
+    "@wasmer/wasmfs": "^0.12.0",
     "prettier": "^2.5.1",
     "rollup": "^2.62.0",
     "ts-jest": "^27.1.2",
-    "typescript": "^4.5.4",
-    "@wasmer/wasi": "^0.12.0",
-    "@wasmer/wasmfs": "^0.12.0"
+    "typescript": "^4.5.4"
   },
   "dependencies": {
     "tslib": "^2.3.1"

packages/npm-packages/ruby-wasm-wasi/package.json

@@ -1,5 +1,8 @@
 import typescript from "@rollup/plugin-typescript";
 import { nodeResolve } from "@rollup/plugin-node-resolve";
+import json from "@rollup/plugin-json";
+
+const typescriptOptions = { tsconfig: "./tsconfig.json", declaration: false, exclude: ["src/browser.script.ts"] }
 
 function variant(basename) {
   return {
@@ -22,8 +25,9 @@ function variant(basename) {
       },
     ],
     plugins: [
-      typescript({ tsconfig: "./tsconfig.json", declaration: false }),
+      typescript(typescriptOptions),
       nodeResolve(),
+      json(),
     ],
   };
 }
@@ -32,6 +36,20 @@ function variant(basename) {
 export default [
   variant("index"),
   variant("browser"),
+  {
+    input: "src/browser.script.ts",
+    output: [
+      {
+        file: "dist/browser.script.js",
+        format: "iife"
+      }
+    ],
+    plugins: [
+      typescript(typescriptOptions),
+      nodeResolve(),
+      json(),
+    ],
+  },
   {
     input: `src/node.ts`,
     output: [
@@ -47,7 +65,7 @@ export default [
       },
     ],
     plugins: [
-      typescript({ tsconfig: "./tsconfig.json", declaration: false }),
+      typescript(typescriptOptions),
       nodeResolve(),
     ],
     external: ["wasi"],

packages/npm-packages/ruby-wasm-wasi/rollup.config.js

@@ -0,0 +1,29 @@
+import { DefaultRubyVM } from "./browser";
+import * as pkg from "../package.json";
+
+const main = async () => {
+    const response = await fetch(
+        `https://cdn.jsdelivr.net/npm/ruby-head-wasm-wasi@${pkg.version}/dist/ruby.wasm`
+    );
+    const buffer = await response.arrayBuffer();
+    const module = await WebAssembly.compile(buffer);
+    const { vm } = await DefaultRubyVM(module);
+
+    vm.printVersion();
+
+    runRubyScriptsInHtml(vm);
+};
+
+const runRubyScriptsInHtml = (vm) => {
+    const tags = document.getElementsByTagName("script");
+    for (var i = 0, len = tags.length; i < len; i++) {
+        const tag = tags[i];
+        if (tag.type === "text/ruby") {
+            if (tag.innerHTML) {
+                vm.eval(tag.innerHTML);
+            }
+        }
+    }
+};
+
+main();

packages/npm-packages/ruby-wasm-wasi/src/browser.script.ts

@@ -6,7 +6,8 @@
     "outDir": "./dist",
     "target": "es2017",
     "esModuleInterop": true,
-    "moduleResolution": "node"
+    "moduleResolution": "node",
+    "resolveJsonModule": true
   },
   "include": ["src/**/*.ts", "./src/bindgen/*"],
   "exclude": ["node_modules", "dist"]