chore: introduce eslint-plugin-vue-i18n

components/PanelEditor.vue

@@ -69,7 +69,7 @@ const panelInitEditor = computed(() => isMounted.value || {
           bg-faded px4 py2
         >
           <div i-ph-tree-structure-duotone />
-          <span text-sm>Files</span>
+          <span text-sm>{{ $t('files') }}</span>
         </div>
         <div py2>
           <PanelEditorFileSystemTree

components/PanelPreview.vue

@@ -53,7 +53,7 @@ function navigate() {
         m1.5 rounded bg-faded px2 py0.5 tracking-wide
       >
         <div i-ph-globe-duotone />
-        <span text-sm op50>Preview</span>
+        <span text-sm op50>{{ $t('preview') }}</span>
         <div
           text-sm
           flex="~ items-center justify-center auto"
@@ -74,7 +74,7 @@ function navigate() {
         flex="~ gap-2 auto items-center" px2 py2
       >
         <div i-ph-globe-duotone />
-        <span text-sm>Preview</span>
+        <span text-sm>{{ $t('preview') }}</span>
       </div>
       <button
 
@@ -97,22 +97,26 @@ function navigate() {
           <div px5 py4 grid="~ gap-y-3 gap-x-2 cols-[max-content_1fr] items-center">
             <div i-uim-vuejs text-xl />
             <div flex="~ gap-2 items-center">
-              Vue version:
+              <!-- eslint-disable-next-line @intlify/vue-i18n/no-raw-text -->
+              {{ $t('vueVersion') }}:
               <div
                 v-if="!preview.clientInfo?.versionVue"
                 i-svg-spinners-90-ring-with-bg
               />
+              <!-- eslint-disable-next-line @intlify/vue-i18n/no-raw-text -->
               <code v-else>
                 v{{ preview.clientInfo.versionVue }}
               </code>
             </div>
             <div i-simple-icons-nuxtdotjs text-xl />
             <div flex="~ gap-2 items-center">
-              Nuxt version:
+              <!-- eslint-disable-next-line @intlify/vue-i18n/no-raw-text -->
+              {{ $t('nuxtVersion') }}:
               <div
                 v-if="!preview.clientInfo?.versionNuxt"
                 i-svg-spinners-90-ring-with-bg
               />
+              <!-- eslint-disable-next-line @intlify/vue-i18n/no-raw-text -->
               <code v-else>
                 v{{ preview.clientInfo.versionNuxt }}
               </code>

components/TheNav.vue

@@ -141,7 +141,8 @@ addCommands(
             <div i-ph-package-duotone text-xl />
             <NuxtLink :to="`${runtime.public.repoUrl}/commit/${runtime.public.gitSha}`" target="_blank" title="View on GitHub">
               <time :datetime="buildTime.toISOString()" :title="buildTime.toLocaleString()">
-                Built {{ timeAgo }} (<code>{{ runtime.public.gitSha.slice(0, 5) }}</code>)
+                <!-- eslint-disable-next-line @intlify/vue-i18n/no-raw-text -->
+                {{ $t('built') }} {{ timeAgo }} (<code>{{ runtime.public.gitSha.slice(0, 5) }}</code>)
               </time>
             </NuxtLink>
           </div>

eslint.config.js

@@ -1,4 +1,5 @@
 import antfu from '@antfu/eslint-config'
+import vueI18n from '@intlify/eslint-plugin-vue-i18n'
 import nuxt from './.nuxt/eslint.config.mjs'
 
 export default antfu(
@@ -21,3 +22,24 @@ export default antfu(
   .override('antfu/pnpm/package-json', {
     ignores: ['**/templates/**'],
   })
+  .append(
+    vueI18n.configs.recommended,
+    {
+      settings: {
+        'vue-i18n': {
+          localeDir: 'i18n/locales/*.yaml',
+        },
+      },
+      rules: {
+        '@intlify/vue-i18n/no-missing-keys': 'error',
+        '@intlify/vue-i18n/no-raw-text': 'error',
+        '@intlify/vue-i18n/no-deprecated-modulo-syntax': 'off',
+      },
+    },
+    {
+      files: ['content/**'],
+      rules: {
+        '@intlify/vue-i18n/no-raw-text': 'off',
+      },
+    },
+  )

i18n/locales/en.yaml

@@ -23,3 +23,8 @@ steps:
   waiting-for-nuxt-to-ready: Waiting for Nuxt to ready
 restart-server: Restart the server
 interactive-terminal-mode: Interactive terminal mode
+files: Files
+preview: Preview
+built: Built
+vueVersion: Vue version
+nuxtVersion: Nuxt version

i18n/locales/ja.yaml

@@ -23,3 +23,8 @@ steps:
   waiting-for-nuxt-to-ready: Nuxtが準備完了を待機中
 restart-server: サーバーを再起動
 interactive-terminal-mode: インタラクティブターミナルモード
+files: ファイル
+preview: プレビュー
+built: ビルド
+vueVersion: Vueバージョン
+nuxtVersion: Nuxtバージョン

package.json

@@ -43,6 +43,7 @@
     "@iconify-json/logos": "catalog:icons",
     "@iconify-json/ph": "catalog:icons",
     "@iconify-json/svg-spinners": "catalog:icons",
+    "@intlify/eslint-plugin-vue-i18n": "catalog:dev",
     "@nuxt/content": "catalog:nuxt",
     "@nuxt/devtools": "catalog:nuxt",
     "@nuxt/eslint": "catalog:nuxt",

pnpm-workspace.yaml

@@ -4,6 +4,7 @@ patchedDependencies:
 catalogs:
   dev:
     '@antfu/eslint-config': ^4.11.0
+    '@intlify/eslint-plugin-vue-i18n': ^4.0.1
     '@unocss/eslint-plugin': ^65.5.0
     eslint: ^9.24.0
     eslint-plugin-format: ^1.0.1