fix

Author: pengx17

src/App.tsx

@@ -6,7 +6,7 @@ function App() {
   const visible = useAppVisible();
   if (visible) {
     return (
-      <main        
+      <main
         className="backdrop-filter backdrop-blur-md fixed inset-0 flex items-center justify-center"
         onClick={(e) => {
           if (!innerRef.current?.contains(e.target as any)) {

src/main.tsx

@@ -8,32 +8,33 @@ import App from "./App";
 // @ts-expect-error
 const css = (t, ...args) => String.raw(t, ...args);
 
-function createModel() {
-  return {
-    show() {
-      logseq.showMainUI();
-    },
-  };
-}
-
 function main() {
+  const pluginId = logseq.baseInfo.id;
+  console.info(`#${pluginId}: MAIN`);
   ReactDOM.render(
     <React.StrictMode>
       <App />
     </React.StrictMode>,
     document.getElementById("app")
   );
 
-  const key = logseq.baseInfo.id;
+  function createModel() {
+    return {
+      show() {
+        logseq.showMainUI();
+      },
+    };
+  }
 
+  logseq.provideModel(createModel());
   logseq.setMainUIInlineStyle({
     zIndex: 11,
   });
 
   const openIconName = "template-plugin-open";
 
   logseq.provideStyle(css`
-    div[data-injected-ui=${openIconName}-${key}] {
+    div[data-injected-ui=${openIconName}-${pluginId}] {
       display: inline-flex;
       align-items: center;
       opacity: 0.55;
@@ -42,7 +43,7 @@ function main() {
       position: relative;
     }
 
-    div[data-injected-ui=${openIconName}-${key}]:hover {
+    div[data-injected-ui=${openIconName}-${pluginId}]:hover {
       opacity: 0.9;
     }
   `);
@@ -57,4 +58,4 @@ function main() {
   });
 }
 
-logseq.ready(createModel()).then(main).catch(console.error);
+logseq.ready(main).catch(console.error);

vite.config.ts

@@ -2,7 +2,7 @@ import { defineConfig, Plugin, ResolvedConfig } from "vite";
 import reactRefresh from "@vitejs/plugin-react-refresh";
 import WindiCSS from "vite-plugin-windicss";
 // @ts-expect-error
-import { writeFile } from "fs/promises";
+import { writeFile, mkdir } from "fs/promises";
 import path from "path";
 
 // Hard-coded for now
@@ -44,6 +44,7 @@ const devIndexHtmlPlugin: () => Plugin = () => {
         </body>
       </html>
       `;
+      await mkdir(config.build.outDir, { recursive: true });
       await writeFile(
         path.resolve(config.build.outDir, "index.html"),
         template,