Initial start for WASM

.eslintrc.cjs

@@ -7,6 +7,7 @@ module.exports = {
         'plugin:@typescript-eslint/recommended',
         'eslint-config-prettier',
     ],
+    ignorePatterns: ['src-tauri/**/*'],
     settings: {
         react: {
             version: 'detect',

.gitignore

@@ -22,3 +22,5 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+
+.rsw

package.json

@@ -4,11 +4,11 @@
   "version": "0.0.0",
   "type": "module",
   "scripts": {
+    "build": "rsw build && tsc && vite build",
     "dev": "vite",
-    "build": "tsc && vite build",
+    "lint": "eslint . --ext .ts,.tsx",
     "preview": "vite preview",
-    "tauri": "tauri",
+    "tauri-dev": "concurrently -n app,rsw \"tauri dev\" \"rsw watch\""
-    "lint": "eslint . --ext .ts,.tsx"
   },
   "dependencies": {
     "@codemirror/lang-html": "^6.4.2",
@@ -40,9 +40,12 @@
     "@types/react-dom": "^18.0.6",
     "@vitejs/plugin-react": "^3.0.0",
     "autoprefixer": "^10.4.13",
+    "concurrently": "^7.6.0",
     "postcss": "^8.4.21",
     "tailwindcss": "^3.2.7",
     "typescript": "^4.6.4",
-    "vite": "^4.0.0"
+    "vite": "^4.0.0",
+    "vite-plugin-rsw": "^2.0.11",
+    "vite-plugin-top-level-await": "^1.2.4"
   }
 }

rsw.toml

@@ -0,0 +1,39 @@
+name = "rsw"
+version = "0.1.0"
+
+#! time interval for file changes to trigger wasm-pack build, default `50` milliseconds
+interval = 50
+
+#! link
+#! npm link @see https://docs.npmjs.com/cli/v8/commands/npm-link
+#! yarn link @see https://classic.yarnpkg.com/en/docs/cli/link
+#! pnpm link @see https://pnpm.io/cli/link
+#! The link command will only be executed if `[[crates]] link = true`
+#! cli: `npm` | `yarn` | `pnpm`, default is `npm`
+cli = "npm"
+
+#! ---------------------------
+
+#! rsw new <name>
+[new]
+#! @see https://rustwasm.github.io/docs/wasm-pack/commands/new.html
+#! using: `wasm-pack` | `rsw` | `user`, default is `wasm-pack`
+#! 1. wasm-pack: `rsw new <name> --template <template> --mode <normal|noinstall|force>`
+#! 2. rsw: `rsw new <name>`, built-in templates
+#! 3. user: `rsw new <name>`, if `dir` is not configured, use `wasm-pack new <name>` to initialize the project
+using = "wasm-pack"
+#! this field needs to be configured when `using = "user"`
+#! `using = "wasm-pack"` or `using = "rsw"`, this field will be ignored
+#! copy all files in this directory
+dir = "my-template"
+
+#! ################# NPM Package #################
+
+#! When there is only `name`, other fields will use the default configuration
+
+#! 📦 -------- package: @rsw --------
+ [[crates]]
+ #! npm package name (path: $ROOT/@rsw)
+ name = "@rsw/hello"
+ #! run `npm link`: `true` | `false`, default is `false`
+ link = true

src-tauri/src/runtime.rs

@@ -23,7 +23,7 @@ pub async fn run_plugin(file_path: &str) -> Result<(), AnyError> {
     });
 
     runtime
-        .execute_script("<runtime>", include_str!("runtime.ts"))
+        .execute_script("<runtime>", include_str!("runtime.js"))
         .unwrap();
 
     let main_module = deno_core::resolve_path(file_path)?;

src/App.tsx

@@ -59,7 +59,7 @@ function App() {
             hideLabel
             name="url"
             label="Enter URL"
-            className="mr-1 w-[30rem]"
+            className="mr-1 w-[20rem]"
             onChange={(e) => setUrl(e.currentTarget.value)}
             value={url}
             placeholder="Enter a URL..."

src/main.tsx

@@ -3,9 +3,13 @@ import ReactDOM from 'react-dom/client';
 import App from './App';
 import { HelmetProvider } from 'react-helmet-async';
 import { MotionConfig } from 'framer-motion';
+import init, { greet } from '@rsw/hello';
 
 import './main.css';
 
+await init();
+greet();
+
 ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
   <React.StrictMode>
     <MotionConfig transition={{ duration: 0.15 }}>

vite.config.ts

@@ -1,9 +1,11 @@
-import { defineConfig } from "vite";
+import { defineConfig } from 'vite';
-import react from "@vitejs/plugin-react";
+import react from '@vitejs/plugin-react';
+import { ViteRsw } from 'vite-plugin-rsw';
+import topLevelAwait from 'vite-plugin-top-level-await';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [react()],
+  plugins: [react(), ViteRsw(), topLevelAwait()],
 
   // Vite options tailored for Tauri development and only applied in `tauri dev` or `tauri build`
   // prevent vite from obscuring rust errors
@@ -15,12 +17,12 @@ export default defineConfig({
   },
   // to make use of `TAURI_DEBUG` and other env variables
   // https://tauri.studio/v1/api/config#buildconfig.beforedevcommand
-  envPrefix: ["VITE_", "TAURI_"],
+  envPrefix: ['VITE_', 'TAURI_'],
   build: {
     // Tauri supports es2021
-    target: process.env.TAURI_PLATFORM == "windows" ? "chrome105" : "safari13",
+    target: process.env.TAURI_PLATFORM == 'windows' ? 'chrome105' : 'safari13',
     // don't minify for debug builds
-    minify: !process.env.TAURI_DEBUG ? "esbuild" : false,
+    minify: !process.env.TAURI_DEBUG ? 'esbuild' : false,
     // produce sourcemaps for debug builds
     sourcemap: !!process.env.TAURI_DEBUG,
   },