Fix false positives of key used in <i18n> component in no-unused-keys rule.

.vscode/settings.json

@@ -5,5 +5,6 @@
     ],
     "eslint.alwaysShowStatus": true,
     "eslint.packageManager": "yarn",
-    "eslint.run": "onSave"
+    "eslint.run": "onSave",
+    "npm.packageManager": "yarn"
 }

lib/utils/collect-keys.js

@@ -18,6 +18,7 @@ const debug = require('debug')('eslint-plugin-vue-i18n:collect-keys')
  * @typedef {import('vue-eslint-parser').AST.Node} Node
  * @typedef {import('vue-eslint-parser').AST.ESLintCallExpression} CallExpression
  * @typedef {import('vue-eslint-parser').AST.VDirective} VDirective
+ * @typedef {import('vue-eslint-parser').AST.VAttribute} VAttribute
  */
 
 /**
@@ -51,6 +52,17 @@ function getKeyFromVDirective (node) {
   }
 }
 
+/**
+ * @param {VAttribute} node
+ */
+function getKeyFromI18nComponent (node) {
+  if (node.value && node.value.type === 'VLiteral') {
+    return node.value.value
+  } else {
+    return null
+  }
+}
+
 function getParser (parser) {
   if (parser) {
     try {
@@ -132,11 +144,28 @@ function collectKeysFromAST (node, visitorKeys) {
    */
   function enterNode (node) {
     if (node.type === 'VAttribute') {
-      if (node.directive && (node.key.name.name === 't' || node.key.name === 't' /* parser v5 */)) {
-        debug("call VAttribute[directive=true][key.name.name='t'] handling ...")
-        const key = getKeyFromVDirective(node)
-        if (key) {
-          results.add(key)
+      if (node.directive) {
+        if (node.key.name.name === 't' || node.key.name === 't' /* parser v5 */) {
+          debug("call VAttribute[directive=true][key.name.name='t'] handling ...")
+          const key = getKeyFromVDirective(node)
+          if (key) {
+            results.add(key)
+          }
+        }
+      } else {
+        if (
+          node.key.name === 'path' &&
+          (
+            node.parent.parent.name === 'i18n' ||
+            node.parent.parent.name === 'i18n-t'
+          )
+        ) {
+          debug("call VElement:matches([name=i18n], [name=i18n-t]) > VStartTag > VAttribute[key.name='path'] handling ...")
+
+          const key = getKeyFromI18nComponent(node)
+          if (key) {
+            results.add(key)
+          }
         }
       }
     } else if (node.type === 'CallExpression') {

tests/fixtures/no-unused-keys/valid/vue-cli-format/locales/en.json

@@ -5,5 +5,6 @@
     "link": "@:messages.hello"
   },
   "hello_dio": "hello underscore DIO!",
-  "hello {name}": "hello {name}!"
+  "hello {name}": "hello {name}!",
+  "term": "I accept xxx {0}."
 }

tests/fixtures/no-unused-keys/valid/vue-cli-format/locales/ja.json

@@ -5,5 +5,6 @@
     "link": "@:messages.hello"
   },
   "hello_dio": "こんにちは、アンダースコア DIO！",
-  "hello {name}": "こんにちは、{name}！"
+  "hello {name}": "こんにちは、{name}！",
+  "term": "私は xxx の{0}に同意します。"
 }

tests/fixtures/no-unused-keys/valid/vue-cli-format/src/App.vue

@@ -1,6 +1,9 @@
 <template>
   <div id="app">
     <p v-t="'hello_dio'">{{ $t('messages.link') }}</p>
+    <i18n path="term" tag="label" for="tos">
+      <a :href="url" target="_blank">{{ $t('tos') }}</a>
+    </i18n>
   </div>
 </template>
 

tests/lib/rules/no-unused-keys.js

@@ -56,6 +56,36 @@ new RuleTester({
       }
     }
     </script>`
+  }, {
+    // <i18n> component
+    filename: 'test.vue',
+    code: `
+    <template>
+      <i18n path="message_key" tag="p" />
+    </template>
+    <i18n>
+    {
+      "en": {
+        "message_key": "hi"
+      }
+    }
+    </i18n>
+    `
+  }, {
+    // <i18n-t> component
+    filename: 'test.vue',
+    code: `
+    <template>
+      <i18n-t path="message_key" tag="p" />
+    </template>
+    <i18n>
+    {
+      "en": {
+        "message_key": "hi"
+      }
+    }
+    </i18n>
+    `
   }],
   invalid: [{
     // sfc supports