chapter: configure lint (#30)

Author: ubugeeei

.eslintrc.cjs

@@ -33,5 +33,8 @@ jobs:
         run: nci
 
       - name: lint
+        run: nr lint
+
+      - name: lint text
         run: nr lint:text
 # TODO: configure other jobs

.github/workflows/check.yml

@@ -1,3 +1,3 @@
 {
-  "recommendations": ["Vue.volar", "dbaeumer.vscode-eslint", "esbenp.prettier-vscode"]
+  "recommendations": ["Vue.volar", "dbaeumer.vscode-eslint"]
 }

.prettierrc.json

@@ -0,0 +1,3 @@
+import antfu from '@antfu/eslint-config'
+
+export default antfu({ vue: true, typescript: true })

.vscode/extensions.json

@@ -1,18 +1,18 @@
 {
   "name": "@vueyous/monorepo",
+  "type": "module",
   "version": "0.0.1-alpha.1",
   "private": true,
   "packageManager": "[email protected]",
-  "type": "module",
   "scripts": {
     "dev": "vite",
     "build": "run-p type-check \"build-only {@}\" --",
     "preview": "vite preview",
     "build-only": "vite build",
     "type-check": "vue-tsc --build --force",
-    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
     "lint:text": "textlint .",
-    "fmt": "prettier --write src/",
     "docs:dev": "vitepress dev packages",
     "docs:build": "vitepress build packages",
     "docs:preview": "vitepress preview packages"
@@ -22,24 +22,20 @@
     "vue": "^3.4.21"
   },
   "devDependencies": {
-    "@rushstack/eslint-patch": "^1.3.3",
+    "@antfu/eslint-config": "^2.13.3",
     "@tsconfig/node20": "^20.1.2",
     "@types/fs-extra": "^11.0.4",
     "@types/jsdom": "^21.1.6",
     "@types/node": "^20.11.28",
     "@vitejs/plugin-vue": "^5.0.4",
-    "@vueyous/core": "workspace:*",
-    "@vueyous/shared": "workspace:*",
-    "@vue/eslint-config-prettier": "^8.0.0",
-    "@vue/eslint-config-typescript": "^12.0.0",
     "@vue/test-utils": "^2.4.5",
     "@vue/tsconfig": "^0.5.1",
+    "@vueyous/core": "workspace:*",
+    "@vueyous/shared": "workspace:*",
     "eslint": "^8.49.0",
-    "eslint-plugin-vue": "^9.17.0",
     "fs-extra": "^11.2.0",
     "jsdom": "^24.0.0",
     "npm-run-all2": "^6.1.2",
-    "prettier": "^3.0.3",
     "textlint": "^14.0.4",
     "textlint-rule-ja-space-between-half-and-full-width": "^2.3.1",
     "typescript": "~5.4.0",

eslint.config.js

@@ -1,10 +1,10 @@
-import { defineConfig } from 'vitepress';
+import { defineConfig } from 'vitepress'
 
 const Guide = [
   { text: 'はじめに', link: '/guide/' },
   { text: 'VueUseとは', link: '/guide/what-is-vueuse' },
-  { text: '環境構築', link: '/guide/setup' }
-];
+  { text: '環境構築', link: '/guide/setup' },
+]
 
 // https://vitepress.dev/reference/site-config
 export default defineConfig({
@@ -21,16 +21,16 @@ export default defineConfig({
 
     nav: [
       { text: 'Home', link: '/' },
-      { text: 'Guide', items: Guide }
+      { text: 'Guide', items: Guide },
     ],
 
     sidebar: [
       {
         text: 'Guide',
-        items: Guide
-      }
+        items: Guide,
+      },
     ],
 
-    socialLinks: [{ icon: 'github', link: 'https://github.com/pei-pay/VueYous' }]
-  }
-});
+    socialLinks: [{ icon: 'github', link: 'https://github.com/pei-pay/VueYous' }],
+  },
+})

package.json

@@ -1,5 +1,5 @@
-import DefaultTheme from 'vitepress/theme';
+import DefaultTheme from 'vitepress/theme'
 
-import './styles/main.css';
+import './styles/main.css'
 
-export default DefaultTheme;
+export default DefaultTheme

packages/.vitepress/config.ts

@@ -1,2 +1,2 @@
-export { useManualRefHistory } from './useManualRefHistory';
-export { useRefHistory } from './useRefHistory';
+export { useManualRefHistory } from './useManualRefHistory'
+export { useRefHistory } from './useRefHistory'

packages/.vitepress/theme/index.ts

@@ -1,8 +1,8 @@
 {
   "name": "@vueyous/core",
-  "version": "0.0.1-alpha.1",
   "type": "module",
+  "version": "0.0.1-alpha.1",
   "dependencies": {
     "@vueyous/shared": "workspace:*"
   }
-}
+}

packages/core/index.ts

@@ -1,5 +1,5 @@
-export type CloneFn<F, T = F> = (x: F) => T;
+export type CloneFn<F, T = F> = (x: F) => T
 
 export function cloneFnJSON<T>(source: T): T {
-  return JSON.parse(JSON.stringify(source));
+  return JSON.parse(JSON.stringify(source))
 }

packages/core/package.json

@@ -1,30 +1,40 @@
 <script setup lang="ts">
-import { ref } from 'vue';
+import { ref } from 'vue'
 // TODO: make formatDate
-import { formatDate } from '@vueuse/core';
+import { formatDate } from '@vueuse/core'
 
-import { useManualRefHistory } from '../useManualRefHistory';
+import { useManualRefHistory } from '../useManualRefHistory'
 
 function format(ts: number) {
-  return formatDate(new Date(ts), 'YYYY-MM-DD HH:mm:ss');
+  return formatDate(new Date(ts), 'YYYY-MM-DD HH:mm:ss')
 }
 
-const count = ref(0);
-const inc = () => count.value++;
-const dec = () => count.value--;
-const { canUndo, canRedo, history, commit, undo, redo } = useManualRefHistory(count);
+const count = ref(0)
+const inc = () => count.value++
+const dec = () => count.value--
+const { canUndo, canRedo, history, commit, undo, redo } = useManualRefHistory(count)
 </script>
 
 <template>
   <div>Count: {{ count }}</div>
-  <button @click="inc()">Increment</button>
-  <button @click="dec()">Decrement</button>
+  <button @click="inc()">
+    Increment
+  </button>
+  <button @click="dec()">
+    Decrement
+  </button>
   <span class="ml-2">/</span>
-  <button @click="commit()">Commit</button>
-  <button :disabled="!canUndo" @click="undo()">Undo</button>
-  <button :disabled="!canRedo" @click="redo()">Redo</button>
-  <br />
-  <br />
+  <button @click="commit()">
+    Commit
+  </button>
+  <button :disabled="!canUndo" @click="undo()">
+    Undo
+  </button>
+  <button :disabled="!canRedo" @click="redo()">
+    Redo
+  </button>
+  <br>
+  <br>
   <note>History (limited to 10 records for demo)</note>
   <div class="code-block mt-4">
     <div v-for="i in history" :key="i.timestamp">

packages/core/useCloned/index.ts

@@ -1,15 +1,15 @@
 // NOTE: 実際は 'vue-demi' からimportされてる
-import { computed, markRaw, ref, type Ref } from 'vue';
+import { type Ref, computed, markRaw, ref } from 'vue'
 
-import { timestamp } from '@vueyous/shared';
+import { timestamp } from '@vueyous/shared'
 
 export interface UseRefHistoryRecord<T> {
-  snapshot: T;
-  timestamp: number;
+  snapshot: T
+  timestamp: number
 }
 
 export interface UseManualHistoryOptions<Raw> {
-  setSource?: (source: Ref<Raw>, v: Raw) => void;
+  setSource?: (source: Ref<Raw>, v: Raw) => void
 }
 
 export interface UseManualRefHistoryReturn<Raw> {
@@ -18,106 +18,107 @@ export interface UseManualRefHistoryReturn<Raw> {
   // source: Ref<Raw>;
 
   /** An array of history records for undo, newest comes to first */
-  history: Ref<UseRefHistoryRecord<Raw>[]>;
+  history: Ref<UseRefHistoryRecord<Raw>[]>
 
   /** Last history point, source can be different if paused */
-  last: Ref<UseRefHistoryRecord<Raw>>;
+  last: Ref<UseRefHistoryRecord<Raw>>
 
   /** Same as {@link UseManualRefHistoryReturn.history | history} */
-  undoStack: Ref<UseRefHistoryRecord<Raw>[]>;
+  undoStack: Ref<UseRefHistoryRecord<Raw>[]>
 
   /** Records array for redo */
-  redoStack: Ref<UseRefHistoryRecord<Raw>[]>;
+  redoStack: Ref<UseRefHistoryRecord<Raw>[]>
 
   /** A ref representing if undo is possible (non empty undoStack) */
-  canUndo: Ref<boolean>;
+  canUndo: Ref<boolean>
 
   /** A ref representing if redo is possible (non empty redoStack) */
-  canRedo: Ref<boolean>;
+  canRedo: Ref<boolean>
 
   /** Undo changes */
-  undo: () => void;
+  undo: () => void
 
   /** Redo changes */
-  redo: () => void;
+  redo: () => void
 
   /** Clear all the history */
-  clear: () => void;
+  clear: () => void
 
   /** Create a new history record */
-  commit: () => void;
+  commit: () => void
 
   /** Reset ref's value with latest history */
-  reset: () => void;
+  reset: () => void
 }
 
 function fnSetSource<F>(source: Ref<F>, value: F) {
-  return (source.value = value);
+  return (source.value = value)
 }
 
 export function useManualRefHistory<Raw>(
   source: Ref<Raw>,
-  options: UseManualHistoryOptions<Raw> = {}
+  options: UseManualHistoryOptions<Raw> = {},
 ): UseManualRefHistoryReturn<Raw> {
-  const { setSource = fnSetSource } = options;
+  const { setSource = fnSetSource } = options
 
   function _createHistoryRecord(): UseRefHistoryRecord<Raw> {
     return markRaw({
       snapshot: source.value,
-      timestamp: timestamp()
-    });
+      timestamp: timestamp(),
+    })
   }
 
   const last: Ref<UseRefHistoryRecord<Raw>> = ref(_createHistoryRecord()) as Ref<
     UseRefHistoryRecord<Raw>
-  >;
+  >
 
-  const undoStack: Ref<UseRefHistoryRecord<Raw>[]> = ref([]);
-  const redoStack: Ref<UseRefHistoryRecord<Raw>[]> = ref([]);
+  const undoStack: Ref<UseRefHistoryRecord<Raw>[]> = ref([])
+  const redoStack: Ref<UseRefHistoryRecord<Raw>[]> = ref([])
 
   const _setSource = (record: UseRefHistoryRecord<Raw>) => {
-    setSource(source, record.snapshot);
-    last.value = record;
-  };
+    setSource(source, record.snapshot)
+    last.value = record
+  }
 
   const commit = () => {
-    undoStack.value.unshift(last.value);
-    last.value = _createHistoryRecord();
+    undoStack.value.unshift(last.value)
+    last.value = _createHistoryRecord()
     // commit した際に redoStack に要素がある場合はそれを全削除
-    if (redoStack.value.length) redoStack.value.splice(0, redoStack.value.length);
-  };
+    if (redoStack.value.length)
+      redoStack.value.splice(0, redoStack.value.length)
+  }
 
   const clear = () => {
-    undoStack.value.splice(0, undoStack.value.length);
-    redoStack.value.splice(0, redoStack.value.length);
-  };
+    undoStack.value.splice(0, undoStack.value.length)
+    redoStack.value.splice(0, redoStack.value.length)
+  }
 
   const undo = () => {
-    const state = undoStack.value.shift();
+    const state = undoStack.value.shift()
 
     if (state) {
-      redoStack.value.unshift(last.value);
-      _setSource(state);
+      redoStack.value.unshift(last.value)
+      _setSource(state)
     }
-  };
+  }
 
   const redo = () => {
-    const state = redoStack.value.shift();
+    const state = redoStack.value.shift()
 
     if (state) {
-      undoStack.value.unshift(last.value);
-      _setSource(state);
+      undoStack.value.unshift(last.value)
+      _setSource(state)
     }
-  };
+  }
 
   const reset = () => {
-    _setSource(last.value);
-  };
+    _setSource(last.value)
+  }
 
-  const history = computed(() => [last.value, ...undoStack.value]);
+  const history = computed(() => [last.value, ...undoStack.value])
 
-  const canUndo = computed(() => undoStack.value.length > 0);
-  const canRedo = computed(() => redoStack.value.length > 0);
+  const canUndo = computed(() => undoStack.value.length > 0)
+  const canRedo = computed(() => redoStack.value.length > 0)
 
   return {
     // source,
@@ -132,6 +133,6 @@ export function useManualRefHistory<Raw>(
     commit,
     reset,
     undo,
-    redo
-  };
+    redo,
+  }
 }