no-unsupported-features.js 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173
  1. /**
  2. * @author Yosuke Ota
  3. * See LICENSE file in root directory for full license.
  4. */
  5. 'use strict'
  6. const semver = require('semver')
  7. const utils = require('../utils')
  8. /**
  9. * @typedef {object} SyntaxRule
  10. * @property {string} supported
  11. * @property { (context: RuleContext) => TemplateListener } [createTemplateBodyVisitor]
  12. * @property { (context: RuleContext) => RuleListener } [createScriptVisitor]
  13. */
  14. const FEATURES = {
  15. // Vue.js 2.5.0+
  16. 'slot-scope-attribute': require('./syntaxes/slot-scope-attribute'),
  17. // Vue.js 2.6.0+
  18. 'dynamic-directive-arguments': require('./syntaxes/dynamic-directive-arguments'),
  19. 'v-slot': require('./syntaxes/v-slot'),
  20. // Vue.js 3.0.0+
  21. 'v-model-argument': require('./syntaxes/v-model-argument'),
  22. 'v-model-custom-modifiers': require('./syntaxes/v-model-custom-modifiers'),
  23. 'v-is': require('./syntaxes/v-is'),
  24. 'script-setup': require('./syntaxes/script-setup'),
  25. 'style-css-vars-injection': require('./syntaxes/style-css-vars-injection'),
  26. // Vue.js 3.1.0+
  27. 'is-attribute-with-vue-prefix': require('./syntaxes/is-attribute-with-vue-prefix'),
  28. // Vue.js 3.2.0+
  29. 'v-memo': require('./syntaxes/v-memo'),
  30. 'v-bind-prop-modifier-shorthand': require('./syntaxes/v-bind-prop-modifier-shorthand'),
  31. 'v-bind-attr-modifier': require('./syntaxes/v-bind-attr-modifier')
  32. }
  33. const SYNTAX_NAMES = /** @type {(keyof FEATURES)[]} */ (Object.keys(FEATURES))
  34. const cache = new Map()
  35. /**
  36. * Get the `semver.Range` object of a given range text.
  37. * @param {string} x The text expression for a semver range.
  38. * @returns {semver.Range} The range object of a given range text.
  39. * It's null if the `x` is not a valid range text.
  40. */
  41. function getSemverRange(x) {
  42. const s = String(x)
  43. let ret = cache.get(s) || null
  44. if (!ret) {
  45. try {
  46. ret = new semver.Range(s)
  47. } catch (_error) {
  48. // Ignore parsing error.
  49. }
  50. cache.set(s, ret)
  51. }
  52. return ret
  53. }
  54. module.exports = {
  55. meta: {
  56. type: 'suggestion',
  57. docs: {
  58. description:
  59. 'disallow unsupported Vue.js syntax on the specified version',
  60. categories: undefined,
  61. url: 'https://eslint.vuejs.org/rules/no-unsupported-features.html'
  62. },
  63. fixable: 'code',
  64. schema: [
  65. {
  66. type: 'object',
  67. properties: {
  68. version: {
  69. type: 'string'
  70. },
  71. ignores: {
  72. type: 'array',
  73. items: {
  74. enum: SYNTAX_NAMES
  75. },
  76. uniqueItems: true
  77. }
  78. },
  79. additionalProperties: false
  80. }
  81. ],
  82. messages: {
  83. // Vue.js 2.5.0+
  84. forbiddenSlotScopeAttribute:
  85. '`slot-scope` are not supported except Vue.js ">=2.5.0 <3.0.0".',
  86. // Vue.js 2.6.0+
  87. forbiddenDynamicDirectiveArguments:
  88. 'Dynamic arguments are not supported until Vue.js "2.6.0".',
  89. forbiddenVSlot: '`v-slot` are not supported until Vue.js "2.6.0".',
  90. // Vue.js 3.0.0+
  91. forbiddenVModelArgument:
  92. 'Argument on `v-model` is not supported until Vue.js "3.0.0".',
  93. forbiddenVModelCustomModifiers:
  94. 'Custom modifiers on `v-model` are not supported until Vue.js "3.0.0".',
  95. forbiddenVIs: '`v-is` are not supported until Vue.js "3.0.0".',
  96. forbiddenScriptSetup:
  97. '`<script setup>` are not supported until Vue.js "3.0.0".',
  98. forbiddenStyleCssVarsInjection:
  99. 'SFC CSS variable injection is not supported until Vue.js "3.0.3".',
  100. // Vue.js 3.1.0+
  101. forbiddenIsAttributeWithVuePrefix:
  102. '`is="vue:"` are not supported until Vue.js "3.1.0".',
  103. // Vue.js 3.2.0+
  104. forbiddenVMemo: '`v-memo` are not supported until Vue.js "3.2.0".',
  105. forbiddenVBindPropModifierShorthand:
  106. '`.prop` shorthand are not supported until Vue.js "3.2.0".',
  107. forbiddenVBindAttrModifier:
  108. '`.attr` modifiers on `v-bind` are not supported until Vue.js "3.2.0".'
  109. }
  110. },
  111. /** @param {RuleContext} context */
  112. create(context) {
  113. const { version, ignores } = Object.assign(
  114. {
  115. version: null,
  116. ignores: []
  117. },
  118. context.options[0] || {}
  119. )
  120. if (!version) {
  121. // version is not set.
  122. return {}
  123. }
  124. const versionRange = getSemverRange(version)
  125. /**
  126. * Check whether a given case object is full-supported on the configured node version.
  127. * @param {SyntaxRule} aCase The case object to check.
  128. * @returns {boolean} `true` if it's supporting.
  129. */
  130. function isNotSupportingVersion(aCase) {
  131. return !semver.subset(versionRange, getSemverRange(aCase.supported))
  132. }
  133. /** @type {TemplateListener} */
  134. let templateBodyVisitor = {}
  135. /** @type {RuleListener} */
  136. let scriptVisitor = {}
  137. for (const syntaxName of SYNTAX_NAMES) {
  138. /** @type {SyntaxRule} */
  139. const syntax = FEATURES[syntaxName]
  140. if (ignores.includes(syntaxName) || !isNotSupportingVersion(syntax)) {
  141. continue
  142. }
  143. if (syntax.createTemplateBodyVisitor) {
  144. const visitor = syntax.createTemplateBodyVisitor(context)
  145. templateBodyVisitor = utils.compositingVisitors(
  146. templateBodyVisitor,
  147. visitor
  148. )
  149. }
  150. if (syntax.createScriptVisitor) {
  151. const visitor = syntax.createScriptVisitor(context)
  152. scriptVisitor = utils.compositingVisitors(scriptVisitor, visitor)
  153. }
  154. }
  155. return utils.defineTemplateBodyVisitor(
  156. context,
  157. templateBodyVisitor,
  158. scriptVisitor
  159. )
  160. }
  161. }