chore: migrate to eslint (#111)

* chore: migrate to eslint

* chore: ignore `vue/one-component-per-file`

* chore: fix ts error

Author: harlan-zw

.eslintignore

@@ -0,0 +1,4 @@
+dist
+node_modules
+examples/vite-ssr
+tests/e2e/vite-ssr

.eslintrc.js

@@ -0,0 +1,11 @@
+module.exports = {
+  root: true,
+  env: {
+    browser: true,
+    node: true,
+  },
+  extends: '@antfu/eslint-config',
+  rules: {
+    'vue/one-component-per-file': 'off'
+  },
+}

.github/workflows/export-sizes.yml

@@ -18,7 +18,7 @@ jobs:
         with:
           node-version: ${{ matrix.node-version }}
           registry-url: https://registry.npmjs.org/
-          cache: "pnpm"
+          cache: pnpm
       - uses: antfu/export-size-action@v1
         with:
           github_token: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/release.yml

@@ -3,7 +3,7 @@ name: Release
 on:
   push:
     tags:
-      - "v*"
+      - 'v*'
 
 jobs:
   release:

.github/workflows/test.yml

@@ -8,7 +8,7 @@ on:
 
 jobs:
   test:
-    if: "!contains(github.event.head_commit.message, 'ci skip')"
+    if: '!contains(github.event.head_commit.message, ''ci skip'')'
 
     strategy:
       matrix:

.prettierrc

@@ -1,11 +1,12 @@
 <script setup lang="ts">
-import { useHead } from "#head"
+import { useHead } from '#head'
 
 useHead({
-  title: "Title",
-  titleTemplate: (title) => `${title} | Title Site`,
+  title: 'Title',
+  titleTemplate: title => `${title} | Title Site`,
 })
 </script>
+
 <template>
   <div>
     <NuxtPage />

examples/nuxt3/app.vue

@@ -2,12 +2,13 @@
 const props = defineProps<{
   title: string
 }>()
-await new Promise((resolve) => setTimeout(resolve, 1000))
+await new Promise(resolve => setTimeout(resolve, 1000))
 
 useHead({
   title: computed(() => props.title),
 })
 </script>
+
 <template>
   <div>final title test</div>
 </template>

examples/nuxt3/components/ModifyTitle.vue

@@ -1,41 +1,41 @@
-import { defineNuxtConfig } from "nuxt/config"
-import { fileURLToPath } from "url"
-import { addPlugin } from "@nuxt/kit"
-import { resolve } from "pathe"
+import { fileURLToPath } from 'url'
+import { defineNuxtConfig } from 'nuxt/config'
+import { addPlugin } from '@nuxt/kit'
+import { resolve } from 'pathe'
 
-const runtimeDir = fileURLToPath(new URL("./runtime", import.meta.url))
-const rootDir = fileURLToPath(new URL("../../", import.meta.url))
+const runtimeDir = fileURLToPath(new URL('./runtime', import.meta.url))
+const rootDir = fileURLToPath(new URL('../../', import.meta.url))
 
 // https://v3.nuxtjs.org/api/configuration/nuxt.config
 export default defineNuxtConfig({
   alias: {
-    "@vueuse/head": `${rootDir}/src`,
+    '@vueuse/head': `${rootDir}/src`,
   },
   app: {
     head: {
-      title: "default title",
+      title: 'default title',
     },
   },
   workspaceDir: rootDir,
   hooks: {
-    "modules:before": async ({ nuxt }) => {
+    'modules:before': async ({ nuxt }) => {
       const newModules = nuxt.options._modules
       // remove the nuxt meta (head) module
       for (const k in newModules) {
-        if (typeof newModules[k] === "function") {
-          if ((await newModules[k].getMeta()).name === "meta") {
+        if (typeof newModules[k] === 'function') {
+          if ((await newModules[k].getMeta()).name === 'meta') {
             // we can't use an undefined key so use a duplicate
-            newModules[k] = "@nuxt/telemetry"
+            newModules[k] = '@nuxt/telemetry'
           }
         }
       }
       nuxt.options._modules = newModules
     },
-    "modules:done"({ nuxt }) {
+    'modules:done': function ({ nuxt }) {
       // Replace #head alias
-      nuxt.options.alias["#head"] = runtimeDir
+      nuxt.options.alias['#head'] = runtimeDir
 
-      addPlugin({ src: resolve(runtimeDir, "plugin") }, { append: true })
+      addPlugin({ src: resolve(runtimeDir, 'plugin') }, { append: true })
 
       nuxt.options.build.transpile.push(runtimeDir)
     },

examples/nuxt3/nuxt.config.ts

@@ -1,29 +1,32 @@
 <script lang="ts" setup>
-import { useHead } from "#head"
+import { useHead } from '#head'
 
 const page = ref({
-  title: "Home",
-  description: "Home page description",
-  image: "https://nuxtjs.org/meta_400.png",
+  title: 'Home',
+  description: 'Home page description',
+  image: 'https://nuxtjs.org/meta_400.png',
 })
 
 useHead({
   title: computed(() => `${page.value.title} | Nuxt`),
   meta: [
     {
-      name: "description",
+      name: 'description',
       content: computed(() => page.value.description),
     },
     {
-      property: "og:image",
+      property: 'og:image',
       content: computed(() => page.value.image),
     },
   ],
 })
 </script>
+
 <template>
   <div>
     <h1>Index</h1>
-    <nuxt-link to="/second">second page</nuxt-link>
+    <nuxt-link to="/second">
+      second page
+    </nuxt-link>
   </div>
 </template>