chore: update tool chains configration

.github/CONTRIBUTING.md

@@ -33,6 +33,7 @@
 - Make sure `npm test` passes. (see [development setup](#development-setup))
 
 - If adding new feature:
+
   - Add accompanying test case.
   - Provide convincing reason to add this feature. Ideally you should open a suggestion issue first and have it greenlighted before working on it.
 
@@ -41,6 +42,7 @@
   - Add appropriate test coverage if applicable.
 
 ### Work Step Example
+
 - Fork the repository from [intlify/vue-i18n-extensions](https://github.com/intlify/vue-i18n-extensions) !
 - Create your topic branch from `master`: `git branch my-new-topic origin/master`
 - Add codes and pass tests !
@@ -74,4 +76,3 @@ After cloning the repo, run:
 There are some other scripts available in the `scripts` section of the `package.json` file.
 
 The default test script will do the following: lint with ESLint -> unit tests with coverage. **Please make sure to have this pass successfully before submitting a PR.** Although the same tests will be run against your PR on the CI server, it is better to have it working locally beforehand.
-

.github/ISSUE_TEMPLATE/bug_report.md

@@ -4,23 +4,25 @@ about: Create a report to help us improve
 title: ''
 labels: 'Status: Review Needed'
 assignees: ''
-
 ---
 
 **Reporting a bug?**
- - Try to search for your issue, it may have already been answered or even fixed in the development branch.
- - Check if the issue is reproducible with the latest version of `@intlify/vue-i18n-extensions`. If you are using a pre-release, please indicate the specific version you are using.
- - For bugs that involves build setups, you can create a reproduction repository with steps in the .github/CONTRIBUTING.md
- - If your issue is resolved but still open, don’t hesitate to close it. In case you found a solution by yourself, it could be helpful to explain how you fixed it.
+
+- Try to search for your issue, it may have already been answered or even fixed in the development branch.
+- Check if the issue is reproducible with the latest version of `@intlify/vue-i18n-extensions`. If you are using a pre-release, please indicate the specific version you are using.
+- For bugs that involves build setups, you can create a reproduction repository with steps in the .github/CONTRIBUTING.md
+- If your issue is resolved but still open, don’t hesitate to close it. In case you found a solution by yourself, it could be helpful to explain how you fixed it.
 
 **Module versions (please complete the following information):**
- - `@intlify/vue-i18n-extensions`: 2.x
- - `vue-i18n`: 9.x
- - `vue`: 3.x
+
+- `@intlify/vue-i18n-extensions`: 2.x
+- `vue-i18n`: 9.x
+- `vue`: 3.x
 
 **To Reproduce**
 Steps to reproduce the behavior:
 ex:
+
 1. Go to '...'
 2. Click on '....'
 3. Scroll down to '....'

.github/ISSUE_TEMPLATE/feature_request.md

@@ -4,7 +4,6 @@ about: Suggest an idea for this project
 title: ''
 labels: 'Status: Proposal'
 assignees: ''
-
 ---
 
 **Is your feature request related to a problem? Please describe.**

.github/workflows/release.yml

@@ -16,7 +16,7 @@ jobs:
         run: corepack enable
       - uses: actions/setup-node@v4
         with:
-          registry-url: "https://registry.npmjs.org"
+          registry-url: 'https://registry.npmjs.org'
       - run: git switch next
       - run: |
           if [ -f "pnpm-lock.yaml" ]; then

.github/workflows/typos.yml

@@ -18,4 +18,4 @@ jobs:
         uses: actions/checkout@v4
 
       - name: Spell check
-        uses: crate-ci/[email protected]
+        uses: crate-ci/[email protected]

.gitignore

@@ -1,4 +1,3 @@
-.vscode
 coverage
 node_modules
 .DS_Store

.prettierignore

@@ -1,3 +1,9 @@
 lib
+dist
 coverage
 tsconfig.json
+tsconfig.base.json
+tsconfig.eslint.json
+pnpm-lock.yaml
+CHANGELOG.md
+docs/@intlify/vue-i18n-extensions-api.md

.vscode/settings.json

@@ -0,0 +1,14 @@
+{
+  "files.associations": {
+    "*.json": "jsonc"
+  },
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "editor.formatOnSave": true,
+  "editor.formatOnPaste": true,
+  "editor.formatOnType": true,
+  "editor.codeActionsOnSave": {
+    "source.fixAll": "explicit"
+  },
+  "eslint.experimental.useFlatConfig": true
+}

README.md

@@ -7,8 +7,8 @@
 Extensions for vue-i18n
 
 ## ⚠️ Notice
-This `next` branch is development branch for Vue 3! The version for Vue 2 is now in [`master`](https://github.com/intlify/vue-i18n-extensions/tree/master) branch!
 
+This `next` branch is development branch for Vue 3! The version for Vue 2 is now in [`master`](https://github.com/intlify/vue-i18n-extensions/tree/master) branch!
 
 This library exports the following extensions:
 
@@ -17,14 +17,12 @@ This library exports the following extensions:
 - Server-side rendering for `v-t` custom directive
 - Pre-Translation
 
-
 ## 💿 Installation
 
 ```sh
 $ npm i --save-dev @intlify/vue-i18n-extensions@next
 ```
 
-
 ## 🚀 Extensions
 
 ### Server-side rendering for `v-t` custom directive
@@ -89,7 +87,6 @@ console.log(await renderToString(app))
 // output -> <div>I eat 2 bananas!</div>`
 ```
 
-
 ### Pre-Translation with using `v-t` custom directive
 
 You can pre-translation i18n locale messages of vue-i18n.
@@ -175,7 +172,7 @@ module.exports = {
             }
           }
         ]
-      },
+      }
       // ...
     ]
   },
@@ -194,12 +191,10 @@ You can specify the transform resulting from `transformVTDirective` in the compi
 - `rollup-plugin-vue` (`compilerOptions` at [`Options`](https://github.com/vuejs/rollup-plugin-vue/blob/next/src/index.ts#L50))
 - `vite` (`vueCompilerOptions` at [`CoreOptions`](https://github.com/vitejs/vite/blob/master/src/node/config.ts#L154))
 
-
 ## 🤝 API
 
 About details, See [docs](./docs/@intlify/vue-i18n-extensions-api.md)
 
-
 ## ©️ License
 
 [MIT](http://opensource.org/licenses/MIT)

docs/@intlify/vue-i18n-extensions-api.md

@@ -15,7 +15,10 @@ Transform `v-t` custom directive
 
 **Signature:**
 ```typescript
-export declare function transformVTDirective<Messages extends Record<string, unknown> = {}, DateTimeFormats extends Record<string, unknown> = {}, NumberFormats extends Record<string, unknown> = {}, Legacy extends boolean = true>(options?: TransformVTDirectiveOptions<Messages, DateTimeFormats, NumberFormats, Legacy>): DirectiveTransform;
+export declare function transformVTDirective<Messages extends Record<string, unknown> = {}, // eslint-disable-line @typescript-eslint/ban-types -- TODO: fix this
+DateTimeFormats extends Record<string, unknown> = {}, // eslint-disable-line @typescript-eslint/ban-types -- TODO: fix this
+NumberFormats extends Record<string, unknown> = {}, // eslint-disable-line @typescript-eslint/ban-types -- TODO: fix this
+Legacy extends boolean = true>(options?: TransformVTDirectiveOptions<Messages, DateTimeFormats, NumberFormats, Legacy>): DirectiveTransform;
 ```
 
 #### Parameters
@@ -81,7 +84,10 @@ Transform options for `v-t` custom directive
 
 **Signature:**
 ```typescript
-export interface TransformVTDirectiveOptions<Messages extends Record<string, unknown> = {}, DateTimeFormats extends Record<string, unknown> = {}, NumberFormats extends Record<string, unknown> = {}, Legacy extends boolean = true> 
+export interface TransformVTDirectiveOptions<Messages extends Record<string, unknown> = {}, // eslint-disable-line @typescript-eslint/ban-types -- TODO: fix this
+DateTimeFormats extends Record<string, unknown> = {}, // eslint-disable-line @typescript-eslint/ban-types -- TODO: fix this
+NumberFormats extends Record<string, unknown> = {}, // eslint-disable-line @typescript-eslint/ban-types -- TODO: fix this
+Legacy extends boolean = true> 
 ```
 
 

e2e/example.spec.ts

@@ -1,18 +1,25 @@
 import { getText } from './helper'
 import { ServerContext, startServer } from './setup-server'
 
+import type { Browser, Page } from 'playwright'
+
+// TODO: extract to shim.d.ts
+// eslint-disable-next-line @typescript-eslint/no-namespace
+declare namespace global {
+  let browser: Browser
+  let page: Page
+}
+
 let ctx: ServerContext
 describe(`pre-compilation`, () => {
   beforeAll(async () => {
     ctx = await startServer()
-    await page.goto(ctx.url('/'))
+    await global.page.goto(ctx.url('/'))
   })
 
   test('rendering', async () => {
-    expect(await getText(page, '#directive-string')).toMatch(
-      'こんにちは、世界！'
-    )
-    expect(await getText(page, '#directive-object')).toMatch('hello, world!')
+    expect(await getText(global.page, '#directive-string')).toMatch('こんにちは、世界！')
+    expect(await getText(global.page, '#directive-object')).toMatch('hello, world!')
 
     ctx.serverProcess.kill()
   })

e2e/setup-server.ts

@@ -1,5 +1,5 @@
 import { getRandomPort, waitForPort } from 'get-port-please'
-import { ChildProcess, spawn } from 'child_process'
+import { ChildProcess, spawn } from 'node:child_process'
 
 export type ServerContext = {
   serverProcess: ChildProcess

eslint.config.mjs

@@ -1,29 +1,77 @@
-// @ts-check
-
+import eslint from '@eslint/js'
 import tseslint from 'typescript-eslint'
-import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended'
+import globals from 'globals'
+
+/**
+ * @typedef {import("eslint").Linter.FlatConfig[]} FlatConfigs
+ */
 
-export default tseslint.config(
-  // base configuration
+/** @type { FlatConfigs } */
+export default [
+  // global settings
   {
-    files: ['**/*.ts'],
-    ignores: ['./lib'],
+    ignores: [
+      'coverage',
+      'example/**',
+      'lib/**',
+      'dist/**',
+      'docsgen.config.js',
+      'ship.config.js',
+      'prettier.config.mjs'
+    ]
+  },
+
+  // for javascript and environment
+  {
+    ...eslint.configs.recommended,
     languageOptions: {
+      ecmaVersion: 'latest',
+      sourceType: 'module',
       globals: {
-        page: true,
-        browser: true,
-        context: true
+        ...globals.node,
+        ...globals.browser,
+        ...globals.es6
+      },
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true
+        }
       }
     }
   },
 
-  // setup typescript rules
-  ...tseslint.configs.recommended,
-
-  // setup prettier, includes eslint-config-prettier
-  eslintPluginPrettierRecommended,
+  // for typescript
+  ...tseslint.configs.recommendedTypeChecked,
+  {
+    files: ['**/*.{ts,tsx}'],
+    languageOptions: {
+      parserOptions: {
+        project: true,
+        tsconfigRootDir: import.meta.dirname
+      }
+    },
+    rules: {
+      '@typescript-eslint/no-unused-vars': [
+        'error',
+        {
+          args: 'all',
+          argsIgnorePattern: '^_',
+          caughtErrors: 'all',
+          caughtErrorsIgnorePattern: '^_',
+          destructuredArrayIgnorePattern: '^_',
+          varsIgnorePattern: '^_',
+          ignoreRestSiblings: true
+        }
+      ]
+    }
+  },
+  {
+    files: ['**/*.{js,cjs,mjs}'],
+    ...tseslint.configs.disableTypeChecked
+  }
 
   // custom rules
+  /*
   {
     rules: {
       'object-curly-spacing': 'off',
@@ -35,4 +83,5 @@ export default tseslint.config(
       '@typescript-eslint/no-use-before-define': 'off'
     }
   }
-)
+  */
+]

example/src/env.d.ts

@@ -2,7 +2,7 @@
 
 declare module '*.vue' {
   import { DefineComponent } from 'vue'
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const component: DefineComponent<{}, {}, any>
   export default component
 }