init

dmitry-vsl · Jul 28, 2024 · c500584 · c500584
1 parent a886d97
commit c500584
Show file tree

Hide file tree

Showing 13 changed files with 5,022 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1 @@
+node_modules/
diff --git a/README.md b/README.md
@@ -0,0 +1,65 @@
+# SWTS: Service-Worker TypeScript Transpiler
+
+SWTS allows you to develop front-end applications in TypeScript without the need to install Node.js or bundlers. All you need is a plain web server. The transpilation is seamlessly performed within a service worker in the user's browser. #nobuild
+
+## Is it suitable for production?
+
+No, SWTS is intended only for development. It adds a 2.5 MB service worker and offloads the transpiling process to the user's web browser, which is not ideal for non-toy websites.
+
+## Does it perform type-checking?
+
+No, it only transpiles JavaScript. Use your IDE for type-checking.
+
+## How to use
+
+Simply download the file containing the service worker and place it in the root directory of your website. You can do this with the following command:
+
+```
+curl ... > my_cool_site/service-worker.js
+```
+
+Then, add the service worker to your HTML file:
+
+```html
+<script>
+  navigator.serviceWorker.register('/service-worker.js');
+</script>
+```
+
+Now, you can use TypeScript files just like regular JavaScript files. For example, create an HTML file with the following content:
+
+```html
+<head>
+  <title>SWTS "Hello, world!" Example</title>
+
+  <script>
+    navigator.serviceWorker.register('/service-worker.js');
+  </script>
+
+  <script src='./hello.ts'></script>
+</head>
+```
+
+And add a `./hello.ts` file:
+
+```typescript
+function hello(message: string): void {
+  document.write(`<span style='font-size: 5em'>${message}</span>`);
+}
+
+hello('Hello, world!');
+```
+
+If it doesn't work on the first try, refresh the page - the service worker may not have been installed yet.
+
+You can try it yourself [here]()
+
+## Does it support ES modules?
+
+Absolutely! See an example [here]()
+
+## TODO
+This project is a quick prototype. The following features are missing:
+- Lookup for `tsconfig.json` and load configuration
+- Generate source maps
+- Cache transpiled javascript
diff --git a/build.sh b/build.sh
@@ -0,0 +1,7 @@
+set -e
+
+cp node_modules/@swc/wasm-typescript/wasm.js wasm.js
+sed -i.bak '/const.*TextEncoder.*require/d' wasm.js
+sed -i.bak 's/node:buffer/buffer/' wasm.js
+rm wasm.js.bak
+npx browserify src/index.js -o service-worker.js
diff --git a/examples/a.ts b/examples/a.ts
@@ -0,0 +1,5 @@
+import {b_message} from './b.ts'
+
+const a_message: number = `'./a.ts' module loaded'`
+
+export const messages: [string] = [a_message, b_message]
diff --git a/examples/b.ts b/examples/b.ts
@@ -0,0 +1 @@
+export const b_message: number = `'./b.ts' module loaded`
diff --git a/examples/hello.html b/examples/hello.html
@@ -0,0 +1,9 @@
+<head>
+  <title>SWTS "Hello, world!" example </title>
+
+  <script>
+    navigator.serviceWorker.register('/service-worker.js')
+  </script>
+
+  <script src='./hello.ts'></script>
+</head>
diff --git a/examples/hello.ts b/examples/hello.ts
@@ -0,0 +1,5 @@
+function hello(message: string): void {
+  document.write(`<span style='font-size: 5em'>${message}</span>`)
+}
+
+hello('Hello, world!')
diff --git a/examples/modules.html b/examples/modules.html
@@ -0,0 +1,15 @@
+<head>
+  <title>SWTS modules examples </title>
+  <script>
+    navigator.serviceWorker.register('/service-worker.js')
+  </script>
+  <script type='module'>
+    import {messages} from './a.ts'
+
+    window.addEventListener('load', () => {
+      for(let msg of messages) {
+        document.write(`<span style='font-size: 3em'>${msg}</span><br>`)
+      }
+    })
+  </script>
+</head>
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export const b_message: number = `'./b.ts' module loaded`