fix: fix linting issues

Author: fago

playground/components/global/TestCard.vue

@@ -9,12 +9,12 @@
 defineProps({
   title: {
     type: String,
-    default: 'Default Title'
+    default: 'Default Title',
   },
   description: {
     type: String,
-    default: 'Default description'
-  }
+    default: 'Default description',
+  },
 })
 </script>
 
@@ -26,4 +26,4 @@ defineProps({
   background: #f9f9f9;
   margin: 1rem 0;
 }
-</style>
+</style>

playground/components/global/TestMarkup.vue

@@ -1,13 +1,14 @@
 <template>
-  <div v-html="content" class="test-markup"></div>
+  <!-- eslint-disable-next-line -->
+  <div v-html="content" class="markup"></div>
 </template>
 
 <script setup>
 defineProps({
   content: {
     type: String,
-    default: ''
-  }
+    default: '',
+  },
 })
 </script>
 
@@ -17,4 +18,4 @@ defineProps({
   border: 1px solid #ddd;
   border-radius: 4px;
 }
-</style>
+</style>

playground/nuxt.config.ts

@@ -1,4 +1,4 @@
 export default defineNuxtConfig({
   modules: ['../src/module'],
-  devtools: { enabled: true }
+  devtools: { enabled: true },
 })

playground/pages/[...slug].vue

@@ -5,4 +5,3 @@
     </div>
   </div>
 </template>
-

playground/pages/index.vue

@@ -2,11 +2,15 @@
   <div>
     <h1>Nuxt Component Preview Playground</h1>
     <p>This is the playground for testing the nuxt-component-preview module.</p>
-    
+
     <div style="margin: 2rem 0;">
       <h2>Test the Component Preview</h2>
       <p>Click the link below to test the component preview functionality:</p>
-      <a href="/preview-test.html" target="_blank" style="display: inline-block; padding: 1rem 2rem; background: #42b883; color: white; text-decoration: none; border-radius: 4px;">
+      <a
+        href="/preview-test.html"
+        target="_blank"
+        style="display: inline-block; padding: 1rem 2rem; background: #42b883; color: white; text-decoration: none; border-radius: 4px;"
+      >
         Open Component Preview Test
       </a>
     </div>
@@ -30,4 +34,4 @@ div {
   margin: 0 auto;
   font-family: Arial, sans-serif;
 }
-</style>
+</style>

src/module.ts

@@ -1,8 +1,9 @@
+import fs from 'node:fs'
+import { resolve } from 'node:path'
 import { defineNuxtModule, addPlugin, createResolver, addComponent, addServerHandler } from '@nuxt/kit'
-import { resolve } from 'path';
-import { promises as fs } from 'fs';
 
 // Module options TypeScript interface definition
+// eslint-disable-next-line @typescript-eslint/no-empty-object-type
 export interface ModuleOptions {
   // Component preview is controlled via runtime config, not module options
 }
@@ -21,20 +22,20 @@ export default defineNuxtModule<ModuleOptions>({
     // Add the component preview area component
     addComponent({
       name: 'ComponentPreviewArea',
-      filePath: resolver.resolve('./runtime/components/ComponentPreviewArea.vue')
+      filePath: resolver.resolve('./runtime/components/ComponentPreviewArea.vue'),
     })
 
     // Add the client-side plugin for component preview functionality
     addPlugin({
       src: resolver.resolve('./runtime/plugin.client.ts'),
-      mode: 'client'
+      mode: 'client',
     })
 
     // Add router options for iframe compatibility
     nuxt.hook('pages:routerOptions', (options) => {
       options.files.push({
         path: resolver.resolve('./runtime/router.options.ts'),
-        optional: true
+        optional: true,
       })
     })
 
@@ -57,7 +58,7 @@ export default defineNuxtModule<ModuleOptions>({
         if (!nuxt.options.dev) {
           try {
             const manifestPath = resolve(nuxt.options.buildDir, 'dist/server/client.manifest.json')
-            const manifestContent = await fs.readFile(manifestPath, 'utf-8')
+            const manifestContent = await fs.promises.readFile(manifestPath, 'utf-8')
             const manifest = JSON.parse(manifestContent)
             const entryKey = Object.keys(manifest).find(key => key.includes('entry'))
             if (!entryKey || !manifest[entryKey]) {
@@ -66,7 +67,8 @@ export default defineNuxtModule<ModuleOptions>({
             }
             resolvedEntryPath = `/_nuxt/${manifest[entryKey].file}`
             nitro.options.virtual['#nuxt-entry-path'] = () => `export default '${resolvedEntryPath}'`
-          } catch (error) {
+          }
+          catch (error) {
             console.error('CRITICAL: Failed to resolve Nuxt entry path:', error)
             throw error
           }
@@ -76,7 +78,7 @@ export default defineNuxtModule<ModuleOptions>({
 
     addServerHandler({
       route: '/nuxt-component-preview/entry.js',
-      handler: resolver.resolve('./runtime/server/routes/nuxt-component-preview/entry.js.get.ts')
+      handler: resolver.resolve('./runtime/server/routes/nuxt-component-preview/entry.js.get.ts'),
     })
   },
 })

src/runtime/components/ComponentPreviewArea.vue

@@ -6,25 +6,28 @@ const previews = useState('componentPreviews', () => [])
 // Helper function to render components using Vue's h() function
 function renderComponent(preview) {
   const { element, ...props } = preview.content
-  
+
   // Resolve the component - it should be globally available
   const component = resolveComponent(element)
-  
+
   if (!component) {
     console.warn(`Component "${element}" not found for preview`)
     return h('div', { class: 'preview-error' }, `Component "${element}" not found`)
   }
-  
+
   return h(component, props)
 }
 </script>
 
 <template>
   <div style="display: none;">
-    <template v-for="(preview, index) in previews" :key="index">
+    <template
+      v-for="(preview, index) in previews"
+      :key="index"
+    >
       <Teleport :to="preview.target">
         <component :is="renderComponent(preview)" />
       </Teleport>
     </template>
   </div>
-</template>
+</template>

src/runtime/plugin.client.ts

@@ -11,9 +11,9 @@ export default defineNuxtPlugin((nuxtApp) => {
    * Creates a preview of a component and renders it to a target element
    *
    * @param {string} componentName - The name of the registered Vue component
-   * @param {Object} props - Props to pass to the component
+   * @param {object} props - Props to pass to the component
    * @param {string|Element} target - CSS selector or DOM element where the component will be rendered
-   * @returns {Object} An object with unmount method
+   * @returns {object} An object with unmount method
    */
   function previewComponent(componentName, props, target) {
     const targetEl = typeof target === 'string'
@@ -28,16 +28,16 @@ export default defineNuxtPlugin((nuxtApp) => {
       target: targetEl,
       content: {
         element: componentName,
-        ...props
-      }
+        ...props,
+      },
     }
 
     previews.value.push(previewData)
 
     return {
       unmount() {
         previews.value = previews.value.filter(c => c.target !== targetEl)
-      }
+      },
     }
   }
 
@@ -47,8 +47,8 @@ export default defineNuxtPlugin((nuxtApp) => {
   // Dispatch ready event when Nuxt is ready
   onNuxtReady(() => {
     const event = new CustomEvent('nuxt-component-preview:ready', {
-      detail: { nuxtApp }
+      detail: { nuxtApp },
     })
     window.dispatchEvent(event)
   })
-})
+})

src/runtime/router.options.ts

@@ -6,12 +6,12 @@ export default <RouterConfig>{
   history: (base) => {
     if (import.meta.client && typeof window !== 'undefined') {
       const previewMode = window.__NUXT__?.config?.public?.componentPreview
-      
+
       if (previewMode) {
         console.log('[Component Preview] Using memory history')
         return createMemoryHistory(base)
       }
     }
     // Use Nuxt's default history otherwise (no return statement lets Nuxt handle it)
-  }
-}
+  },
+}

src/runtime/server/routes/nuxt-component-preview/entry.js.get.ts

@@ -1,12 +1,12 @@
-import { defineEventHandler, sendRedirect, createError } from 'h3';
-import entryPath from '#nuxt-entry-path';
+import { defineEventHandler, sendRedirect, createError } from 'h3'
+import entryPath from '#nuxt-entry-path'
 
 export default defineEventHandler(async (event) => {
   if (!entryPath) {
     throw createError({
       statusCode: 500,
-      statusMessage: 'CRITICAL: Nuxt entry path not configured.'
-    });
+      statusMessage: 'CRITICAL: Nuxt entry path not configured.',
+    })
   }
-  await sendRedirect(event, entryPath, 302);
-});
+  await sendRedirect(event, entryPath, 302)
+})