chore: migrate to flat ESLint config

.vscode/settings.json

@@ -1,6 +1,41 @@
 {
+  // 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": true
+    "source.fixAll.eslint": true,
+    "source.organizeImports": false
   },
-  "prettier.enable": false
+
+  // Silent the stylistic rules in you IDE, but still auto-fix them
+  "eslint.rules.customizations": [
+    { "rule": "style/*", "severity": "off" },
+    { "rule": "*-indent", "severity": "off" },
+    { "rule": "*-spacing", "severity": "off" },
+    { "rule": "*-spaces", "severity": "off" },
+    { "rule": "*-order", "severity": "off" },
+    { "rule": "*-dangle", "severity": "off" },
+    { "rule": "*-newline", "severity": "off" },
+    { "rule": "*quotes", "severity": "off" },
+    { "rule": "*semi", "severity": "off" }
+  ],
+
+  // Enable eslint for all supported languages
+  "eslint.validate": [
+    "javascript",
+    "javascriptreact",
+    "typescript",
+    "typescriptreact",
+    "vue",
+    "html",
+    "markdown",
+    "json",
+    "jsonc",
+    "yaml"
+  ]
 }

docs/package.json

@@ -9,7 +9,7 @@
   },
   "devDependencies": {
     "@iconify-json/carbon": "^1.1.21",
-    "unocss": "^0.55.7",
-    "vitepress": "1.0.0-rc.10"
+    "unocss": "^0.56.5",
+    "vitepress": "1.0.0-rc.20"
   }
 }

eslint.config.js

@@ -0,0 +1,7 @@
+import antfu from '@antfu/eslint-config'
+
+export default antfu(
+  {
+    ignores: ['**/tsconfig.json'],
+  },
+)

package.json

@@ -1,33 +1,35 @@
 {
   "name": "@unlazy/monorepo",
+  "type": "module",
   "version": "0.10.1",
   "private": true,
-  "packageManager": "pnpm@8.7.4",
+  "packageManager": "pnpm@8.8.0",
   "scripts": {
     "build": "pnpm -r --filter=./packages/** run build",
     "dev:prepare": "pnpm -r --filter=./packages/** run dev:prepare",
     "docs": "pnpm -C docs run dev",
     "docs:build": "pnpm -C docs run build",
     "docs:serve": "pnpm -C docs run serve",
-    "lint": "eslint .",
-    "lint:fix": "eslint . --fix",
+    "lint": "eslint . && pnpm -r --filter=./packages/** run lint",
+    "lint:fix": "eslint . --fix && pnpm -r --filter=./packages/** run lint:fix",
     "test": "pnpm -r test:run",
     "test:types": "pnpm -r test:types",
     "release": "bumpp -r",
     "prepare": "pnpm run dev:prepare"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^0.41.0",
-    "@antfu/eslint-config-react": "^0.41.0",
-    "@types/node": "^20.5.9",
+    "@antfu/eslint-config": "^1.0.0-beta.21",
+    "@types/node": "^20.8.2",
     "bumpp": "^9.2.0",
-    "eslint": "^8.48.0",
-    "happy-dom": "^11.0.2",
-    "typescript": "^5.1.6",
+    "eslint": "^8.50.0",
+    "eslint-plugin-react": "^7.33.2",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "happy-dom": "^12.9.0",
+    "typescript": "^5.2.2",
     "unbuild": "^2.0.0",
-    "vite": "^4.4.9",
-    "vitest": "^0.34.3",
-    "vue-tsc": "^1.8.10"
+    "vite": "^4.4.11",
+    "vitest": "^0.34.6",
+    "vue-tsc": "^1.8.15"
   },
   "pnpm": {
     "overrides": {

packages/core/package.json

@@ -2,7 +2,7 @@
   "name": "@unlazy/core",
   "type": "module",
   "version": "0.10.1",
-  "packageManager": "pnpm@8.7.4",
+  "packageManager": "pnpm@8.8.0",
   "description": "Universal lazy loading library for placeholder images leveraging native browser APIs",
   "author": "Johann Schopplich <[email protected]>",
   "license": "MIT",

packages/core/src/utils/dataUri/png.ts

@@ -1,4 +1,5 @@
-/* eslint-disable n/prefer-global/buffer */
+/* eslint-disable node/prefer-global/buffer */
+/* eslint-disable antfu/consistent-list-newline */
 /**
  * Encodes an RGBA image to a PNG data URI. RGB should not be premultiplied by A.
  *

packages/core/src/utils/index.ts

@@ -1,4 +1,4 @@
-/* eslint-disable n/prefer-global/buffer */
+/* eslint-disable node/prefer-global/buffer */
 export const isSSR = typeof window === 'undefined'
 export const isLazyLoadingSupported = !isSSR && 'loading' in HTMLImageElement.prototype
 export const isCrawler = !isSSR && (!('onscroll' in window) || /(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent))

packages/core/test/blurhash.test.ts

@@ -1,17 +1,17 @@
-import { describe, expect, test } from 'vitest'
+import { describe, expect, it } from 'vitest'
 import { createPngDataUri as createPngDataUriBlurHash } from '../src/blurhash'
 import { createPngDataUri as createPngDataUriThumbHash } from '../src/thumbhash'
 
-describe('Blurhash to PNG Data URI', () => {
-  test('generates a valid PNG data URL from a Blurhash', () => {
+describe('blurhash to PNG Data URI', () => {
+  it('generates a valid PNG data URL from a Blurhash', () => {
     const hash = 'LKO2:N%2Tw=w]~RBVZRi};RPxuwH'
     const dataURL = createPngDataUriBlurHash(hash)
     expect(dataURL).toMatchSnapshot()
   })
 })
 
-describe('ThumbHash to PNG Data URI', () => {
-  test('generates a valid PNG data URL from a ThumbHash', () => {
+describe('thumbhash to PNG Data URI', () => {
+  it('generates a valid PNG data URL from a ThumbHash', () => {
     const hash = '1QcSHQRnh493V4dIh4eXh1h4kJUI'
     const dataURL = createPngDataUriThumbHash(hash)
     expect(dataURL).toMatchSnapshot()

packages/nuxt/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@unlazy/nuxt",
   "version": "0.10.1",
-  "packageManager": "pnpm@8.7.4",
+  "packageManager": "pnpm@8.8.0",
   "description": "Nuxt lazy loading module for placeholder images",
   "author": "Johann Schopplich <[email protected]>",
   "license": "MIT",
@@ -45,16 +45,16 @@
     "test:types": "vue-tsc --noEmit"
   },
   "dependencies": {
-    "@nuxt/kit": "^3.7.1",
+    "@nuxt/kit": "^3.7.4",
     "defu": "^6.1.2",
     "unlazy": "workspace:*"
   },
   "devDependencies": {
-    "@nuxt/module-builder": "^0.5.1",
-    "@nuxt/schema": "^3.7.1",
-    "@types/node": "^20.5.9",
-    "@unocss/nuxt": "^0.55.7",
-    "@unocss/reset": "^0.55.7",
-    "nuxt": "^3.7.1"
+    "@nuxt/module-builder": "^0.5.2",
+    "@nuxt/schema": "^3.7.4",
+    "@types/node": "^20.8.2",
+    "@unocss/nuxt": "^0.56.5",
+    "@unocss/reset": "^0.56.5",
+    "nuxt": "^3.7.4"
   }
 }

packages/nuxt/src/runtime/components/UnLazyImage.vue

@@ -68,7 +68,7 @@ const unlazy = useRuntimeConfig().public.unlazy as ModuleOptions
 const hash = computed(() => props.thumbhash || props.blurhash)
 
 // SSR-decoded BlurHash as PNG data URI placeholder image
-// eslint-disable-next-line n/prefer-global/process
+// eslint-disable-next-line node/prefer-global/process
 const pngPlaceholder = (process.server && (props.ssr ?? unlazy.ssr) && hash.value)
   ? createPlaceholderFromHash({
     hash: hash.value,

packages/react/eslint.config.js

@@ -0,0 +1,21 @@
+import antfu from '@antfu/eslint-config'
+import reactPlugin from 'eslint-plugin-react'
+import hooksPlugin from 'eslint-plugin-react-hooks'
+
+export default antfu(
+  {
+    vue: false,
+    ignores: ['tsconfig.json'],
+  },
+  {
+    files: ['**/*.ts', '**/*.tsx'],
+    plugins: {
+      'react': reactPlugin,
+      'react-hooks': hooksPlugin,
+    },
+    rules: {
+      ...reactPlugin.configs['jsx-runtime'].rules,
+      ...hooksPlugin.configs.recommended.rules,
+    },
+  },
+)

packages/react/package.json

@@ -2,7 +2,7 @@
   "name": "@unlazy/react",
   "type": "module",
   "version": "0.10.1",
-  "packageManager": "pnpm@8.7.4",
+  "packageManager": "pnpm@8.8.0",
   "description": "React lazy loading library for placeholder images",
   "author": "Johann Schopplich <[email protected]>",
   "license": "MIT",
@@ -40,16 +40,18 @@
     "build": "unbuild",
     "dev": "pnpm -C playground run dev",
     "dev:build": "pnpm -C playground run build",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
     "test:types": "tsc --noEmit"
   },
   "dependencies": {
     "unlazy": "workspace:*"
   },
   "devDependencies": {
-    "@types/node": "^20.5.9",
-    "@types/react": "^18.2.21",
-    "@types/react-dom": "^18.2.7",
-    "@vitejs/plugin-react": "^4.0.4",
+    "@types/node": "^20.8.2",
+    "@types/react": "^18.2.25",
+    "@types/react-dom": "^18.2.10",
+    "@vitejs/plugin-react": "^4.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   }

packages/solid/eslint.config.js

@@ -0,0 +1,22 @@
+import solidPlugin from 'eslint-plugin-solid'
+import * as tsParser from '@typescript-eslint/parser'
+import antfu from '@antfu/eslint-config'
+
+export default antfu(
+  {
+    vue: false,
+    ignores: ['tsconfig.json'],
+  },
+  {
+    files: ['**/*.ts', '**/*.tsx'],
+    plugins: {
+      solid: solidPlugin,
+    },
+    languageOptions: {
+      parser: tsParser,
+    },
+    rules: {
+      ...solidPlugin.configs.recommended.rules,
+    },
+  },
+)

packages/solid/package.json

@@ -2,7 +2,7 @@
   "name": "@unlazy/solid",
   "type": "module",
   "version": "0.10.1",
-  "packageManager": "pnpm@8.7.4",
+  "packageManager": "pnpm@8.8.0",
   "description": "Solid lazy loading library for placeholder images",
   "author": "Johann Schopplich <[email protected]>",
   "license": "MIT",
@@ -44,6 +44,8 @@
     "build": "tsup",
     "dev": "pnpm -C playground run dev",
     "dev:build": "pnpm -C playground run build",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
     "test:types": "tsc --noEmit"
   },
   "peerDependencies": {
@@ -53,9 +55,9 @@
     "unlazy": "workspace:*"
   },
   "devDependencies": {
-    "@types/node": "^20.5.9",
+    "@types/node": "^20.8.2",
     "eslint-plugin-solid": "^0.13.0",
-    "solid-js": "^1.7.11",
+    "solid-js": "^1.7.12",
     "tsup": "^7.2.0",
     "tsup-preset-solid": "^2.1.0",
     "vite-plugin-solid": "^2.7.0"

packages/svelte/eslint.config.js

@@ -0,0 +1,29 @@
+import sveltePlugin from 'eslint-plugin-svelte'
+import * as svelteParser from 'svelte-eslint-parser'
+import * as tsParser from '@typescript-eslint/parser'
+import antfu from '@antfu/eslint-config'
+
+export default antfu(
+  {
+    vue: false,
+    ignores: ['.svelte-kit', 'tsconfig.json'],
+  },
+  {
+    files: ['**/*.svelte'],
+    plugins: {
+      svelte: sveltePlugin,
+    },
+    languageOptions: {
+      parser: svelteParser,
+      parserOptions: {
+        extraFileExtensions: ['.svelte'],
+        parser: tsParser,
+      },
+    },
+    rules: {
+      ...sveltePlugin.configs.recommended.rules,
+      'import/no-mutable-exports': 'off',
+      'no-undef-init': 'off',
+    },
+  },
+)