style: eslint

posva · Mar 6, 2024 · c3d6cd9 · c3d6cd9
1 parent bbaf127
commit c3d6cd9
Show file tree

Hide file tree

Showing 42 changed files with 1,929 additions and 392 deletions.
diff --git a/.gitignore b/.gitignore
@@ -12,4 +12,4 @@ yarn.lock
 tsconfig.tsbuildinfo
 tsconfig.vitest-temp.json
 docs/.vitepress/cache
-vite.config.ts.timestamp-1707297118358-49b1d9666d20a.mjs
+vite.config.ts.timestamp-*.mjs
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -1,5 +1,72 @@
 {
-	"cSpell.words": [
-		"Colada"
-	]
+  "cSpell.words": [
+    "Colada"
+  ],
+  // Enable the ESlint flat config support
+  "eslint.experimental.useFlatConfig": true,
+  // Disable the default formatter, use eslint instead
+  "prettier.enable": false,
+  "editor.formatOnSave": false,
+  // Auto fix
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": "explicit",
+    "source.organizeImports": "never"
+  },
+  // Silent the stylistic rules in you IDE, but still auto fix them
+  "eslint.rules.customizations": [
+    {
+      "rule": "style/*",
+      "severity": "warn"
+    },
+    {
+      "rule": "format/*",
+      "severity": "warn"
+    },
+    {
+      "rule": "*-indent",
+      "severity": "warn"
+    },
+    {
+      "rule": "*-spacing",
+      "severity": "warn"
+    },
+    {
+      "rule": "*-spaces",
+      "severity": "warn"
+    },
+    {
+      "rule": "*-order",
+      "severity": "warn"
+    },
+    {
+      "rule": "*-dangle",
+      "severity": "warn"
+    },
+    {
+      "rule": "*-newline",
+      "severity": "warn"
+    },
+    {
+      "rule": "*quotes",
+      "severity": "warn"
+    },
+    {
+      "rule": "*semi",
+      "severity": "warn"
+    }
+  ],
+  // Enable eslint for all supported languages
+  "eslint.validate": [
+    "javascript",
+    "javascriptreact",
+    "typescript",
+    "typescriptreact",
+    "vue",
+    "html",
+    "markdown",
+    "json",
+    "jsonc",
+    "yaml",
+    "toml"
+  ]
 }
diff --git a/README.md b/README.md
@@ -63,9 +63,9 @@ app.use(QueryPlugin, {
 
 ```vue
 <script lang="ts" setup>
-import { getContactById, updateContact as _updateContact } from '~/api/contacts'
 import { useRoute } from 'vue-router'
-import { useQuery, useMutation } from '@pinia/colada'
+import { useMutation, useQuery } from '@pinia/colada'
+import { updateContact as _updateContact, getContactById } from '~/api/contacts'
 
 const route = useRoute()
 

diff --git a/docs/.vitepress/config/index.ts b/docs/.vitepress/config/index.ts
@@ -5,15 +5,15 @@ export const META_URL = 'https://pinia-colada.esm.dev'
 export const META_TITLE = 'Pinia Colada 🍹'
 export const META_DESCRIPTION = 'The smart Data Fetching layer for Pinia'
 
-const rControl = /[\u0000-\u001f]/g
+const rControl = /[\u0000-\u001F]/g
 const rSpecial = /[\s~`!@#$%^&*()\-_+=[\]{}|\\;:"'“”‘’<>,.?/]+/g
 const rCombining = /[\u0300-\u036F]/g
 
 /**
  * Default slugification function
  */
-export const slugify = (str: string): string =>
-  str
+export function slugify(str: string): string {
+  return str
     .normalize('NFKD')
     // Remove accents
     .replace(rCombining, '')
@@ -23,6 +23,7 @@ export const slugify = (str: string): string =>
     .replace(rSpecial, '-')
     // ensure it doesn't start with a number
     .replace(/^(\d)/, '_$1')
+}
 
 export default defineConfig({
   title: 'Pinia Colada',
@@ -61,10 +62,10 @@ export default defineConfig({
     [
       'script',
       {
-        src: 'https://cdn.usefathom.com/script.js',
+        'src': 'https://cdn.usefathom.com/script.js',
         'data-site': 'WUXSABAN',
         'data-spa': 'auto',
-        defer: '',
+        'defer': '',
       },
     ],
   ],

diff --git a/docs/.vitepress/theme/components/AsideSponsors.vue b/docs/.vitepress/theme/components/AsideSponsors.vue
@@ -4,7 +4,7 @@
     href="https://masteringpinia.com?utm=pinia-sidebar"
     target="_blank"
   >
-    <img width="22" height="22" src="/mp-pinia-logo.svg" />
+    <img width="22" height="22" src="/mp-pinia-logo.svg">
     <span>
       <p class="extra-info">Complete guide to</p>
       <p class="heading">Mastering Pinia</p>

diff --git a/docs/.vitepress/theme/components/HomeSponsors.vue b/docs/.vitepress/theme/components/HomeSponsors.vue
@@ -1,3 +1,16 @@
+<script setup lang="ts">
+import { useData } from 'vitepress'
+import HomeSponsorsGroup from './HomeSponsorsGroup.vue'
+import sponsors from './sponsors.json'
+
+const { site } = useData()
+const translations = {
+  'en': 'Become a sponsor',
+  'en-US': 'Become a Sponsor!',
+  'zh-CN': '成为赞助者！',
+}
+</script>
+
 <template>
   <div class="sponsors_outer">
     <div>
@@ -24,19 +37,6 @@
   </div>
 </template>
 
-<script setup lang="ts">
-import HomeSponsorsGroup from './HomeSponsorsGroup.vue'
-import sponsors from './sponsors.json'
-import { useData } from 'vitepress'
-
-const { site } = useData()
-const translations = {
-  en: 'Become a sponsor',
-  'en-US': 'Become a Sponsor!',
-  'zh-CN': '成为赞助者！',
-}
-</script>
-
 <style scoped>
 .sponsors_outer {
   text-align: center;

diff --git a/docs/.vitepress/theme/components/HomeSponsorsGroup.vue b/docs/.vitepress/theme/components/HomeSponsorsGroup.vue
@@ -1,3 +1,28 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useData } from 'vitepress'
+import sponsors from './sponsors.json'
+
+const props = withDefaults(
+  defineProps<{
+    name: 'Gold' | 'Platinum' | 'Silver' | 'Bronze'
+    size?: number | string
+  }>(),
+  {
+    size: 140,
+  },
+)
+
+const { isDark } = useData()
+
+const list = computed(() =>
+  sponsors[props.name.toLowerCase()].map(sponsor => ({
+    ...sponsor,
+    imgSrc: isDark.value ? sponsor.imgSrcDark : sponsor.imgSrcLight,
+  })),
+)
+</script>
+
 <template>
   <h3>{{ name }} Sponsors</h3>
 
@@ -17,42 +42,17 @@
       <img
         :src="sponsor.imgSrc"
         :class="
-          isDark &&
-          sponsor.imgSrcLight === sponsor.imgSrcDark &&
-          'invert-colors'
+          isDark
+            && sponsor.imgSrcLight === sponsor.imgSrcDark
+            && 'invert-colors'
         "
         :alt="sponsor.alt"
-        :style="{ height: size + 'px' }"
-      />
+        :style="{ height: `${size}px` }"
+      >
     </a>
   </p>
 </template>
 
-<script setup lang="ts">
-import sponsors from './sponsors.json'
-import { computed } from 'vue'
-import { useData } from 'vitepress'
-
-const props = withDefaults(
-  defineProps<{
-    name: 'Gold' | 'Platinum' | 'Silver' | 'Bronze'
-    size?: number | string
-  }>(),
-  {
-    size: 140,
-  }
-)
-
-const { isDark } = useData()
-
-const list = computed(() =>
-  sponsors[props.name.toLowerCase()].map((sponsor) => ({
-    ...sponsor,
-    imgSrc: isDark.value ? sponsor.imgSrcDark : sponsor.imgSrcLight,
-  }))
-)
-</script>
-
 <style scoped>
 .sponsor_wrapper {
   padding: 5px;

diff --git a/docs/.vitepress/theme/index.ts b/docs/.vitepress/theme/index.ts
@@ -1,5 +1,5 @@
 import { h } from 'vue'
-import { type Theme } from 'vitepress'
+import type { Theme } from 'vitepress'
 import DefaultTheme from 'vitepress/theme'
 import AsideSponsors from './components/AsideSponsors.vue'
 import HomeSponsors from './components/HomeSponsors.vue'

diff --git a/eslint.config.js b/eslint.config.js
@@ -1,9 +1,20 @@
+// @ts-check
 import antfu from '@antfu/eslint-config'
 
 export default antfu({
+  ignores: [
+    //
+    '**/*.ts.timestamp*',
+  ],
   rules: {
     'symbol-description': 'off',
     'node/prefer-global/process': 'off',
     'no-control-regex': 'off',
+    'curly': ['error', 'multi-line'],
+    'antfu/if-newline': 'off',
+    'style/brace-style': ['error', '1tbs'],
+    'antfu/top-level-function': 'off',
+    'test/prefer-lowercase-title': 'off',
+    'style/yield-star-spacing': ['error', 'before'],
   },
 })