diff --git a/wasm/example/.gitignore b/wasm/example/.gitignore
new file mode 100644
index 00000000000..3c3629e647f
--- /dev/null
+++ b/wasm/example/.gitignore
@@ -0,0 +1 @@
+node_modules
diff --git a/wasm/example/index.js b/wasm/example/index.js
new file mode 100644
index 00000000000..80c2d10e585
--- /dev/null
+++ b/wasm/example/index.js
@@ -0,0 +1,47 @@
+let settings = 
+{
+    "jsc": {
+        "target": "es2016",
+      "parser": {
+        "syntax": "ecmascript",
+        "jsx": true,
+        "dynamicImport": false,
+        "numericSeparator": false,
+        "privateMethod": false,
+        "functionBind": false,
+        "exportDefaultFrom": false,
+        "exportNamespaceFrom": false,
+        "decorators": false,
+        "decoratorsBeforeExport": false,
+        "topLevelAwait": false,
+        "importMeta": false
+      }
+    }
+  };
+
+let code = `
+let a = 1;
+let b = {
+    c: {
+        d: 1
+    }
+
+};
+console.log(b?.c?.d);
+
+let MyComponent = () => {
+    return (<div a={10}>
+        <p>Hello World!</p>
+    </div>);
+}
+`;
+
+const swc = import("./pkg/wasm.js");
+swc.then(swc => {
+    console.log("SWC Loaded", swc);
+    let result = swc.transformSync(code, settings);
+    console.log("result from transformSync", result);
+    console.log(result.code);
+    document.getElementById("result").innerHTML = "<xmp>" + result.code + "</xmp>";
+    document.getElementById("source").innerHTML = "<xmp>" + code + "</xmp>";
+});
\ No newline at end of file
diff --git a/wasm/example/package.json b/wasm/example/package.json
new file mode 100644
index 00000000000..8e801c2e4c2
--- /dev/null
+++ b/wasm/example/package.json
@@ -0,0 +1,15 @@
+{
+    "scripts": {
+        "copy-files": "copyfiles ../pkg/* ./pkg",
+        "dev-server": "webpack-dev-server",
+        "serve": "run-s copy-files dev-server"
+    },
+    "devDependencies": {
+        "copyfiles": "^2.3.0",
+        "npm-run-all": "^4.1.5",
+        "webpack": "^4.25.1",
+        "webpack-cli": "^3.1.2",
+        "webpack-dev-server": "^3.1.10"
+    },
+    "dependencies": {}
+}
diff --git a/wasm/example/readme.txt b/wasm/example/readme.txt
new file mode 100644
index 00000000000..5d7506c6798
--- /dev/null
+++ b/wasm/example/readme.txt
@@ -0,0 +1,21 @@
+To run this example, you first need to build swc for the web:
+
+cd swc/wasm
+./scripts/build_web_release.sh
+
+Then run npm install:
+
+cd swc/wasm/example
+npm install
+
+Finally, start the webpack-dev-server:
+
+cd swc/wasm/example
+npm run serve
+
+Browse to http://localhost:8080
+
+
+
+
+
diff --git a/wasm/example/webpack.config.js b/wasm/example/webpack.config.js
new file mode 100644
index 00000000000..fb818229680
--- /dev/null
+++ b/wasm/example/webpack.config.js
@@ -0,0 +1,10 @@
+const path = require('path');
+
+module.exports = {
+  entry: "./index.js",
+  output: {
+    path: path.resolve(__dirname, "dist"),
+    filename: "index.js",
+  },
+  mode: "development"
+};
\ No newline at end of file
diff --git a/wasm/scripts/build_nodejs_release.sh b/wasm/scripts/build_nodejs_release.sh
new file mode 100755
index 00000000000..08137eb673d
--- /dev/null
+++ b/wasm/scripts/build_nodejs_release.sh
@@ -0,0 +1,4 @@
+#!/bin/bash
+
+# run this script from the wasm folder ./scripts/build_nodejs_release.sh
+npx wasm-pack build --scope swc -t nodejs
diff --git a/wasm/scripts/build_web_release.sh b/wasm/scripts/build_web_release.sh
new file mode 100755
index 00000000000..05b6d45c965
--- /dev/null
+++ b/wasm/scripts/build_web_release.sh
@@ -0,0 +1,4 @@
+#!/bin/bash
+
+# run this script from the wasm folder ./scripts/build_web_release.sh
+npx wasm-pack build --scope swc