fix: enable no-this-in-fetch only for nuxt < 2.12

Author: clarkdo

docs/rules/no-this-in-fetch-data.md

@@ -8,6 +8,8 @@
 
 This rule is for preventing using `this` in `asyncData/fetch`
 
+> **NOTE**: `No this in fetch` is only for Nuxt.js < 2.12.0, Nuxt.js v2.12 has introduced new `fetch` API which supports `this`.
+
 Examples of **incorrect** code for this rule:
 
 ```js

lib/rules/__tests__/no-this-in-fetch-data.test.js

@@ -119,6 +119,7 @@ ruleTester.run('no-this-in-fetch-data', rule, {
         message: 'Unexpected this in fetch.',
         type: 'ThisExpression'
       }],
+      options: [{ methods: ['fetch'] }],
       parserOptions
     },
     {
@@ -135,6 +136,7 @@ ruleTester.run('no-this-in-fetch-data', rule, {
         message: 'Unexpected this in fetch.',
         type: 'ThisExpression'
       }],
+      options: [{ methods: ['fetch'] }],
       parserOptions
     },
     {
@@ -151,6 +153,7 @@ ruleTester.run('no-this-in-fetch-data', rule, {
         message: 'Unexpected this in fetch.',
         type: 'ThisExpression'
       }],
+      options: [{ methods: ['fetch'] }],
       parserOptions
     },
     {
@@ -167,6 +170,7 @@ ruleTester.run('no-this-in-fetch-data', rule, {
         message: 'Unexpected this in fetch.',
         type: 'ThisExpression'
       }],
+      options: [{ methods: ['fetch'] }],
       parserOptions
     }
   ]

lib/rules/no-this-in-fetch-data.js

@@ -4,7 +4,9 @@
  */
 'use strict'
 
+const satisfies = require('semver/ranges/intersects')
 const utils = require('../utils')
+const resolver = require('../utils/resolver')
 
 // ------------------------------------------------------------------------------
 // Rule Definition
@@ -27,9 +29,15 @@ module.exports = {
     const options = context.options[0] || {}
 
     const HOOKS = new Set(
-      ['asyncData', 'fetch'].concat(options.methods || [])
+      ['asyncData'].concat(options.methods || [])
     )
 
+    const { version } = resolver
+    // new fetch API can use `this` since 2.12.0
+    if (version && satisfies(version, '<2.12.0')) {
+      HOOKS.add('fetch')
+    }
+
     let nodeUsingThis = []
 
     // ----------------------------------------------------------------------

lib/utils/resolver.js

@@ -0,0 +1,19 @@
+module.exports = {
+  __version: undefined,
+  get version () {
+    if (this.__version === undefined) {
+      return this.loadNuxtPkg()
+    }
+    return this.__version
+  },
+  loadNuxtPkg () {
+    try {
+      const { version } = require('nuxt/package.json')
+      this.__version = version
+    } catch (e) {
+      this.__version = false
+    }
+
+    return this.__version
+  }
+}

package.json

@@ -51,6 +51,7 @@
   },
   "dependencies": {
     "eslint-plugin-vue": "^6.2.1",
+    "semver": "^7.1.3",
     "vue-eslint-parser": "^7.0.0"
   }
 }

yarn.lock

@@ -4420,7 +4420,7 @@ semver@6.3.0, semver@^6.0.0, semver@^6.1.0, semver@^6.1.2, semver@^6.3.0:
   resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d"
   integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==
 
-semver@^7.1.1:
+semver@^7.1.1, semver@^7.1.3:
   version "7.1.3"
   resolved "https://registry.yarnpkg.com/semver/-/semver-7.1.3.tgz#e4345ce73071c53f336445cfc19efb1c311df2a6"
   integrity sha512-ekM0zfiA9SCBlsKa2X1hxyxiI4L3B6EbVJkkdgQXnSEEaHlGdvyodMruTiulSRWMMB4NeIuYNMC9rTKTz97GxA==