more lint rules

.eslintrc.json

@@ -42,24 +42,82 @@
         "no-debugger": "error",
         "camelcase": "error",
         "prettier/prettier": "error",
-        "indent": [
+        "indent": ["error", 2],
-            "error",
+        "linebreak-style": ["error", "unix"],
-            2
+        "semi": ["error", "never"],
-        ],
-        "linebreak-style": [
-            "error",
-            "unix"
-        ],
-        "semi": [
-            "error",
-            "never"
-        ],
         // This makes sure our vike router does not throw errors
         "vue/multi-word-component-names": ["error", {
             "ignores": ["default", "index.page"]
         }],
         // Optional eslint-comments rule
         "@eslint-community/eslint-comments/no-unused-disable": "error",
-        "@eslint-community/eslint-comments/disable-enable-pair": ["error", { "allowWholeFile": true }]
+        "@eslint-community/eslint-comments/disable-enable-pair": ["error", { "allowWholeFile": true }],
+        // import
+        "import/export": "error",
+        "import/no-deprecated": "error",
+        "import/no-empty-named-blocks": "error",
+        "import/no-extraneous-dependencies": "error",
+        "import/no-mutable-exports": "error",
+        "import/no-unused-modules": "error",
+        "import/no-named-as-default": "error",
+        "import/no-named-as-default-member": "error",
+        "import/no-amd": "error",
+        "import/no-commonjs": "error",
+        "import/no-import-module-exports": "error",
+        "import/no-nodejs-modules": "off",
+        "import/unambiguous": "off", // not compatible with scriptless vue files
+        "import/default": "error",
+        "import/named": "error",
+        "import/namespace": "error",
+        "import/no-absolute-path": "error",
+        "import/no-cycle": "error",
+        "import/no-dynamic-require": "error",
+        "import/no-internal-modules": "off",
+        "import/no-relative-packages": "error",
+        "import/no-relative-parent-imports": "error",
+        "import/no-self-import": "error",
+        "import/no-unresolved": "error",
+        "import/no-useless-path-segments": "error",
+        "import/no-webpack-loader-syntax": "error",
+        "import/consistent-type-specifier-style": "error",
+        "import/exports-last": "off",
+        "import/extensions": "error",
+        "import/first": "error",
+        "import/group-exports": "off",
+        "import/newline-after-import": "error",
+        "import/no-anonymous-default-export": "off", // todo - consider to enable again
+        "import/no-default-export": "off", // incompatible with vite & vike
+        "import/no-duplicates": "error",
+        "import/no-named-default": "error",
+        "import/no-namespace": "error",
+        "import/no-unassigned-import": "error",
+        "import/order": [
+        "error",
+        {
+            "groups": ["builtin", "external", "internal", "parent", "sibling", "index", "object", "type"],
+            "newlines-between": "always",
+            "alphabetize": {
+            "order": "asc" /* sort in ascending order. Options: ["ignore", "asc", "desc"] */,
+            "caseInsensitive": true /* ignore case. Options: [true, false] */
+            },
+            "distinctGroup": true
+        }
+        ],
+        "import/prefer-default-export": "off",
+        // promise
+        "promise/catch-or-return": "error",
+        "promise/no-return-wrap": "error",
+        "promise/param-names": "error",
+        "promise/always-return": "error",
+        "promise/no-native": "off",
+        "promise/no-nesting": "warn",
+        "promise/no-promise-in-callback": "warn",
+        "promise/no-callback-in-promise": "warn",
+        "promise/avoid-new": "warn",
+        "promise/no-new-statics": "error",
+        "promise/no-return-in-finally": "warn",
+        "promise/valid-params": "warn",
+        "promise/prefer-await-to-callbacks": "error",
+        "promise/no-multiple-resolved": "error"
     }
 }

renderer/VikeLink.vue

@@ -5,6 +5,7 @@
 </template>
 <script lang="ts" setup>
 import { usePageContext } from './usePageContext'
+
 const pageContext = usePageContext()
 </script>
 <style scoped>

renderer/_default.page.client.ts

@@ -1,4 +1,5 @@
 import { createApp } from './app'
+
 import type { PageContextClient } from './types'
 
 export { render }

renderer/_default.page.server.ts

@@ -1,9 +1,11 @@
 import { renderToString as renderToString_ } from '@vue/server-renderer'
-import type { App } from 'vue'
 import { escapeInject, dangerouslySkipEscape } from 'vike/server'
+
 import { createApp } from './app'
 import logoUrl from './logo.svg'
+
 import type { PageContextServer } from './types'
+import type { App } from 'vue'
 
 export { render }
 // See https://vike.dev/data-fetching

renderer/app.ts

@@ -1,10 +1,12 @@
+import { createPinia } from 'pinia'
 import { createSSRApp, defineComponent, h } from 'vue'
+
+import i18n from './i18n'
 import PageShell from './PageShell.vue'
 import { setPageContext } from './usePageContext'
-import type { Component, PageContext, PageProps } from './types'
-import i18n from './i18n'
 import CreateVuetify from './vuetify'
-import { createPinia } from 'pinia'
+
+import type { Component, PageContext, PageProps } from './types'
 
 export { createApp }
 

renderer/i18n.ts

@@ -1,5 +1,8 @@
 import { createI18n } from 'vue-i18n'
+
+// eslint-disable-next-line import/no-relative-parent-imports
 import de from '../src/locales/de'
+// eslint-disable-next-line import/no-relative-parent-imports
 import en from '../src/locales/en'
 
 export default createI18n({

renderer/usePageContext.ts

@@ -2,9 +2,11 @@
 // See https://vike.dev/pageContext-anywhere
 
 import { inject } from 'vue'
-import type { App, InjectionKey } from 'vue'
+
 import { PageContext } from './types'
 
+import type { App, InjectionKey } from 'vue'
+
 export { usePageContext }
 export { setPageContext }
 

renderer/vuetify.ts

@@ -1,12 +1,14 @@
+// eslint-disable-next-line import/no-unassigned-import
 import '@mdi/font/css/materialdesignicons.css'
+// eslint-disable-next-line import/no-unassigned-import
 import 'vuetify/lib/styles/main.sass'
-import { createVuetify } from 'vuetify'
-import * as components from 'vuetify/lib/components/index.mjs'
-import * as directives from 'vuetify/lib/directives/index.mjs'
-
-import { createVueI18nAdapter } from 'vuetify/locale/adapters/vue-i18n'
-
 import { useI18n } from 'vue-i18n'
+import { createVuetify } from 'vuetify'
+// eslint-disable-next-line import/no-namespace
+import * as components from 'vuetify/lib/components/index.mjs'
+// eslint-disable-next-line import/no-namespace
+import * as directives from 'vuetify/lib/directives/index.mjs'
+import { createVueI18nAdapter } from 'vuetify/locale/adapters/vue-i18n'
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export default (i18n: any) =>

server/index.ts

@@ -11,10 +11,12 @@
 //  - HatTip (https://github.com/hattipjs/hattip)
 //    - You can use Bati (https://batijs.github.io/) to scaffold a Vike + HatTip app. Note that Bati generates apps that use the V1 design (https://vike.dev/migration/v1-design) and Vike packages (https://vike.dev/vike-packages)
 
-import express from 'express'
 import compression from 'compression'
+import express from 'express'
 import { renderPage } from 'vike/server'
+
 import { root } from './root.js'
+
 const isProduction = process.env.NODE_ENV === 'production'
 
 startServer()

src/pages/index/ClickCounter.spec.ts

@@ -1,5 +1,6 @@
-import { describe, it, expect } from 'vitest'
 import { mount } from '@vue/test-utils'
+import { describe, it, expect } from 'vitest'
+
 import ClickCounter from './ClickCounter.vue'
 
 describe('ClickCounter', () => {

src/pages/index/ClickCounter.vue

@@ -4,5 +4,6 @@
 
 <script lang="ts" setup>
 import { reactive } from 'vue'
+
 const state = reactive({ count: 0 })
 </script>

src/stories/ExampleButton.stories.ts

@@ -1,7 +1,7 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
-
 import ExampleButton from './ExampleButton.vue'
 
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 // More on how to set up stories at: https://storybook.js.org/docs/vue/writing-stories/introduction
 const meta = {
   title: 'Example/Button',

src/stories/ExampleButton.vue

@@ -3,6 +3,7 @@
 </template>
 
 <script lang="ts" setup>
+// eslint-disable-next-line import/no-unassigned-import
 import './button.css'
 import { computed } from 'vue'
 

src/stories/ExampleHeader.stories.ts

@@ -1,7 +1,7 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
-
 import ExampleHeader from './ExampleHeader.vue'
 
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 const meta = {
   /* 👇 The title prop is optional.
    * See https://storybook.js.org/docs/vue/configure/overview#configure-story-loading

src/stories/ExampleHeader.vue

@@ -40,6 +40,7 @@
 </template>
 
 <script lang="ts" setup>
+// eslint-disable-next-line import/no-unassigned-import
 import './header.css'
 import ExampleButton from './ExampleButton.vue'
 

src/stories/ExamplePage.stories.ts

@@ -1,7 +1,9 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
 import { within, userEvent } from '@storybook/testing-library'
+
 import ExamplePage from './ExamplePage.vue'
 
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 const meta = {
   title: 'Example/Page',
   component: ExamplePage,

src/stories/ExamplePage.vue

@@ -59,11 +59,12 @@
 </template>
 
 <script lang="ts" setup>
+// eslint-disable-next-line import/no-unassigned-import
 import './page.css'
-import ExampleHeader from './ExampleHeader.vue'
-
 import { ref } from 'vue'
 
+import ExampleHeader from './ExampleHeader.vue'
+
 const user = ref<{ name: string } | null>(null)
 
 const onLogin = () => {

vitest.config.ts

@@ -1,5 +1,5 @@
-import { defineConfig } from 'vitest/config'
 import vue from '@vitejs/plugin-vue' // Import the plugin here
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
   test: {