Fix studio-web build issues (#17)

* Add plugins for `wasm` and `top-level-await` to Vite config
* Avoid bundling dependencies
* Add external dependencies to project-level `package.json` manifests

studio-web/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@storyteller/studio-web",
   "version": "0.0.1",
-  "dependencies": {},
+  "dependencies": {
+    "@storyteller/framework": "0.0.1",
+    "@storyteller/studio": "0.0.1",
+    "lit": "^2.8.0"
+  },
   "main": "./index.js",
   "module": "./index.mjs",
-  "typings": "./index.d.ts",
-  "exports": {
-    "./canvas-provider": "./canvas-provider.element.js",
-    "./viewer": "./viewer.element.js"
-  }
+  "typings": "./index.d.ts"
 }

studio-web/project.json

@@ -7,6 +7,12 @@
     "build": {
       "executor": "@nx/vite:build",
       "outputs": ["{options.outputPath}"],
+      "dependsOn": [
+        {
+          "projects": ["studio"],
+          "target": "build:web"
+        }
+      ],
       "options": {
         "outputPath": "dist/studio-web"
       }

studio-web/src/index.ts

@@ -1 +1,2 @@
+export * from "./lib/canvas-provider.element";
 export * from "./lib/viewer.element";

studio-web/vite.config.ts

@@ -1,50 +1,58 @@
 /// <reference types='vitest' />
+import { nxViteTsPaths } from "@nx/vite/plugins/nx-tsconfig-paths.plugin";
 import { defineConfig } from "vite";
 import dts from "vite-plugin-dts";
+import wasm from "vite-plugin-wasm";
+import topLevelAwait from "vite-plugin-top-level-await";
 import * as path from "path";
-import { nxViteTsPaths } from "@nx/vite/plugins/nx-tsconfig-paths.plugin";
 
 export default defineConfig({
-  cacheDir: "../node_modules/.vite/studio-web",
+	cacheDir: "../node_modules/.vite/studio-web",
 
-  plugins: [
-    nxViteTsPaths(),
-    dts({
-      entryRoot: "src",
-      tsConfigFilePath: path.join(__dirname, "tsconfig.lib.json"),
-      skipDiagnostics: true,
-    }),
-  ],
+	plugins: [
+		nxViteTsPaths(),
+		wasm(),
+		topLevelAwait(),
+		dts({
+			entryRoot: "src",
+			tsConfigFilePath: path.join(__dirname, "tsconfig.lib.json"),
+			skipDiagnostics: true,
+		}),
+	],
 
-  // Uncomment this if you are using workers.
-  // worker: {
-  //  plugins: [ nxViteTsPaths() ],
-  // },
+	// Uncomment this if you are using workers.
+	// worker: {
+	//  plugins: [ nxViteTsPaths() ],
+	// },
 
-  // Configuration for building your library.
-  // See: https://vitejs.dev/guide/build.html#library-mode
-  build: {
-    lib: {
-      // Could also be a dictionary or array of multiple entry points.
-      entry: "src/index.ts",
-      name: "studio-web",
-      fileName: "index",
-      // Change this to the formats you want to support.
-      // Don't forget to update your package.json as well.
-      formats: ["es", "cjs"],
-    },
-    rollupOptions: {
-      // External packages that should not be bundled into your library.
-      external: [],
-    },
-  },
+	// Configuration for building your library.
+	// See: https://vitejs.dev/guide/build.html#library-mode
+	build: {
+		lib: {
+			// Could also be a dictionary or array of multiple entry points.
+			entry: "src/index.ts",
+			name: "studio-web",
+			fileName: "index",
+			// Change this to the formats you want to support.
+			// Don't forget to update your package.json as well.
+			formats: ["es", "cjs"],
+		},
+		rollupOptions: {
+			// External packages that should not be bundled into your library.
+			external: [
+				"lit",
+				"@storyteller/framework",
+				"@storyteller/studio",
+			],
+		},
+	},
 
-  test: {
-    globals: true,
-    cache: {
-      dir: "../node_modules/.vitest",
-    },
-    environment: "jsdom",
-    include: ["src/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}"],
-  },
+	test: {
+		globals: true,
+		cache: {
+			dir: "../node_modules/.vitest",
+		},
+		environment: "jsdom",
+		include: ["src/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}"],
+	},
 });