fix: linting problems

Author: codebender828

package.json

@@ -22,6 +22,7 @@
     "dev": "nuxi dev playground",
     "dev:build": "nuxi build playground",
     "dev:prepare": "nuxt-module-build --stub && nuxi prepare playground",
+    "lint": "eslint --ext .js,.vue,.ts .",
     "test": "vitest"
   },
   "dependencies": {

playground/app.vue

@@ -1,6 +1,8 @@
 <template>
-  <div :class="styles.root">Nuxt module playground!</div>
-  <button :class="styles.button">Hello World</button>
+  <div>
+    <div :class="styles.root">Nuxt module playground!</div>
+    <button :class="styles.button">Hello World</button>
+  </div>
 </template>
 
 <script setup>
@@ -34,10 +36,6 @@ const styles = reactive({
     cursor: "pointer",
     transitionProperty:
       "color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter",
-    transitionProperty:
-      "color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter",
-    transitionProperty:
-      "color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter",
     transitionTimingFunction: "cubic-bezier(.4,0,.2,1)",
     transitionDuration: ".15s",
     "&:hover": {

playground/nuxt.config.ts

@@ -1,6 +1,6 @@
-import { defineNuxtConfig } from "nuxt/config";
-import emotionModule from "..";
+import { defineNuxtConfig } from 'nuxt/config'
+import emotionModule from '..'
 
 export default defineNuxtConfig({
-  modules: [emotionModule],
-});
+  modules: [emotionModule]
+})

src/module.ts

@@ -1,10 +1,10 @@
-import { fileURLToPath } from "url";
+import { fileURLToPath } from 'url'
 import {
   defineNuxtModule,
   addPlugin,
   createResolver,
-  addServerPlugin,
-} from "@nuxt/kit";
+  addServerPlugin
+} from '@nuxt/kit'
 
 declare global {
   interface Window {
@@ -15,31 +15,31 @@ declare global {
 
 export default defineNuxtModule({
   meta: {
-    name: "@nuxtjs/emotion",
-    configKey: "emotion",
-    compatibilty: ">=3.0.0",
+    name: '@nuxtjs/emotion',
+    configKey: 'emotion',
+    compatibilty: '>=3.0.0'
   },
-  setup(options, nuxt) {
+  setup (options, nuxt) {
     // ensure `nitro.plugins` is initialized
-    nuxt.options.nitro.plugins = nuxt.options.nitro.plugins || [];
+    nuxt.options.nitro.plugins = nuxt.options.nitro.plugins || []
 
-    nuxt.hook("nitro:config", (config) => {
+    nuxt.hook('nitro:config', (config) => {
       // Prevent inlining emotion (+ the crucial css cache!) in dev mode
       if (nuxt.options.dev) {
         if (config.externals) {
-          config.externals.external ||= [];
-          config.externals.external.push("@emotion/server");
+          config.externals.external ||= []
+          config.externals.external.push('@emotion/server')
         }
       }
-    });
+    })
 
     /**
      * Register emotion plugin
      */
-    const { resolve } = createResolver(import.meta.url);
-    const runtimeDir = fileURLToPath(new URL("./runtime", import.meta.url));
-    nuxt.options.build.transpile.push(runtimeDir);
-    addServerPlugin(resolve(runtimeDir, "emotion.server"));
-    addPlugin(resolve(runtimeDir, "emotion.client"));
-  },
-});
+    const { resolve } = createResolver(import.meta.url)
+    const runtimeDir = fileURLToPath(new URL('./runtime', import.meta.url))
+    nuxt.options.build.transpile.push(runtimeDir)
+    addServerPlugin(resolve(runtimeDir, 'emotion.server'))
+    addPlugin(resolve(runtimeDir, 'emotion.client'))
+  }
+})

src/runtime/emotion.client.ts

@@ -1,7 +1,7 @@
-import { defineNuxtPlugin } from "#app";
 import { hydrate } from "@emotion/css";
+import { defineNuxtPlugin } from "#app";
 
-export default defineNuxtPlugin((nuxtApp) => {
+export default defineNuxtPlugin((_) => {
   if (window.$emotionSSRIds) {
     const ids = window.$emotionSSRIds;
     hydrate(ids);

src/runtime/emotion.server.ts

@@ -1,5 +1,5 @@
-import { extractCritical } from "@emotion/server";
-import { NitroApp } from "nitropack";
+import { extractCritical } from '@emotion/server'
+import { NitroApp } from 'nitropack'
 
 /**
  * Why are we declaring types for  `defineNitroPlugin`?
@@ -20,18 +20,18 @@ export interface NitroAppPlugin {
   (nitro: NitroApp): void;
 }
 
-export function defineNitroPlugin(def: NitroAppPlugin): NitroAppPlugin {
-  return def;
+export function defineNitroPlugin (def: NitroAppPlugin): NitroAppPlugin {
+  return def
 }
 
 export default defineNitroPlugin((nitroApp) => {
-  nitroApp.hooks.hook("render:html", (html) => {
-    const { ids, css } = extractCritical(html.body);
-    html.head.push(`<style data-emotion="${ids.join(" ")}">${css}</style>`);
+  nitroApp.hooks.hook('render:html', (html) => {
+    const { ids, css } = extractCritical(html.body)
+    html.head.push(`<style data-emotion="${ids.join(' ')}">${css}</style>`)
     html.head.push(
       `<script data-emotion="${ids.join(
-        " "
+        ' '
       )}">window.$emotionIds=${JSON.stringify(ids)}</script>`
-    );
-  });
-});
+    )
+  })
+})

test/basic.test.ts

@@ -1,15 +1,15 @@
-import { describe, it, expect } from "vitest";
-import { fileURLToPath } from "node:url";
-import { setup, $fetch } from "@nuxt/test-utils";
-describe("nust emotion ssr", async () => {
+import { fileURLToPath } from 'node:url'
+import { describe, it, expect } from 'vitest'
+import { setup, $fetch } from '@nuxt/test-utils'
+describe('nust emotion ssr', async () => {
   await setup({
-    rootDir: fileURLToPath(new URL("../playground", import.meta.url)),
-  });
-  it("renders the index page", async () => {
-    const html = await $fetch("/");
-    expect(html).toContain("<style data-emotion");
-    expect(html).toContain("<script data-emotion");
-    expect(html).toContain("window.$emotionIds");
-    expect(html).toMatchSnapshot();
-  });
-});
+    rootDir: fileURLToPath(new URL('../playground', import.meta.url))
+  })
+  it('renders the index page', async () => {
+    const html = await $fetch('/')
+    expect(html).toContain('<style data-emotion')
+    expect(html).toContain('<script data-emotion')
+    expect(html).toContain('window.$emotionIds')
+    expect(html).toMatchSnapshot()
+  })
+})

test/fixture/nuxt.config.ts

@@ -1,6 +1,6 @@
-import { defineNuxtConfig } from "nuxt/config";
-import emotionModule from "../..";
+import { defineNuxtConfig } from 'nuxt/config'
+import emotionModule from '../..'
 
 export default defineNuxtConfig({
-  modules: [emotionModule],
-});
+  modules: [emotionModule]
+})