eslint-plugin-mpx 0.2.0 → 0.2.1

package/lib/configs/base.js

@@ -17,7 +17,14 @@ module.exports = {
   globals: {
     wx: 'readonly',
     my: 'readonly',
+    swan: 'readonly',
+    qq: 'readonly',
+    tt: 'readonly',
+    jd: 'readonly',
+    qa: 'readonly',
+    dd: 'readonly',
     getCurrentPages: 'readonly',
+    getRegExp: 'readonly',
     getApp: 'readonly',
     App: 'readonly',
     Page: 'readonly',

package/lib/configs/composition-api-essential.js

@@ -0,0 +1,18 @@
+/*
+ * IMPORTANT!
+ * This file has been automatically generated,
+ * in order to update it's content execute "npm run update"
+ */
+module.exports = {
+  extends: require.resolve('./base'),
+  rules: {
+    'mpx/html-end-tags': 'error',
+    'mpx/no-dupe-wx-elif': 'error',
+    'mpx/no-duplicate-attributes': 'error',
+    'mpx/valid-wx-if': 'error',
+    'mpx/valid-wx-else': 'error',
+    'mpx/valid-wx-elif': 'error',
+    'mpx/valid-wx-model': 'error',
+    'mpx/script-setup-uses-vars': 'error'
+  }
+}

package/lib/index.js

@@ -23,11 +23,13 @@ module.exports = {
     'valid-wx-else': require('./rules/valid-wx-else'),
     'valid-wx-if': require('./rules/valid-wx-if'),
     'valid-wx-model': require('./rules/valid-wx-model'),
+    'script-setup-uses-vars': require('./rules/script-setup-uses-vars'),
     eqeqeq: require('./rules/eqeqeq')
   },
   configs: {
     base: require('./configs/base'),
-    'mpx-essential': require('./configs/mpx-essential')
+    'mpx-essential': require('./configs/mpx-essential'),
+    'composition-api-essential': require('./configs/composition-api-essential')
   },
   processors: {
     '.mpx': require('./processor')

package/lib/rules/script-setup-uses-vars.js

@@ -0,0 +1,96 @@
+/**
+ * @author pagnkelly
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const utils = require('../utils')
+// const casing = require('../utils/casing')
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+module.exports = {
+  meta: {
+    type: 'problem',
+    docs: {
+      description:
+        'prevent `<script setup>` variables used in `<template>` to be marked as unused', // eslint-disable-line eslint-plugin/require-meta-docs-description
+      categories: undefined,
+      url: 'https://eslint.vuejs.org/rules/script-setup-uses-vars.html'
+    },
+    deprecated: true,
+    schema: []
+  },
+  /**
+   * @param {RuleContext} context - The rule context.
+   * @returns {RuleListener} AST event handlers.
+   */
+  create(context) {
+    if (!utils.isScriptSetup(context)) {
+      return {}
+    }
+    /** @type {Set<string>} */
+    const scriptVariableNames = new Set()
+    const globalScope = context.getSourceCode().scopeManager.globalScope
+    if (globalScope) {
+      for (const variable of globalScope.variables) {
+        scriptVariableNames.add(variable.name)
+      }
+      const moduleScope = globalScope.childScopes.find(
+        (scope) => scope.type === 'module'
+      )
+      for (const variable of (moduleScope && moduleScope.variables) || []) {
+        scriptVariableNames.add(variable.name)
+      }
+    }
+
+    /**
+     * @see https://github.com/vuejs/vue-next/blob/2749c15170ad4913e6530a257db485d4e7ed2283/packages/compiler-core/src/transforms/transformElement.ts#L333
+     * @param {string} name
+     */
+    function markSetupReferenceVariableAsUsed(name) {
+      if (scriptVariableNames.has(name)) {
+        context.markVariableAsUsed(name)
+        return true
+      }
+      return false
+    }
+
+    return utils.defineTemplateBodyVisitor(
+      context,
+      {
+        VExpressionContainer(node) {
+          for (const ref of node.references.filter(
+            (ref) => ref.variable == null
+          )) {
+            context.markVariableAsUsed(ref.id.name)
+          }
+        },
+        VElement(node) {
+          if (utils.isMpElementName(node.rawName)) {
+            return
+          }
+          markSetupReferenceVariableAsUsed(node.rawName)
+        },
+        /** @param {VAttribute} node */
+        'VAttribute[directive=false]'(node) {
+          if (node.value) {
+            let val = node.value.value
+            val = val.replace(/(\{\{)|\s|(\}\})/g, '')
+            context.markVariableAsUsed(val)
+          }
+        }
+      },
+      {},
+      {
+        templateBodyTriggerSelector: 'Program'
+      }
+    )
+  }
+}

package/lib/rules/valid-wx-for.js

@@ -76,7 +76,6 @@ function checkKey(context, vFor, element) {
   }
 
   const vBindKey = utils.getDirective(element, 'key')
-  console.log(vBindKey, 'vBindKey')
   if (utils.isCustomComponent(element) && vBindKey == null) {
     context.report({
       node: element.startTag,

package/lib/utils/index.js

@@ -567,9 +567,7 @@ module.exports = {
    * @param {string} [value] The attribute value to check.
    * @returns {boolean} `true` if the start tag has the attribute.
    */
-  hasAttribute(node, name, value) {
-    return Boolean(this.getAttribute(node, name, value))
-  },
+  hasAttribute,
 
   /**
    * Check whether the given start tag has specific directive.
@@ -669,24 +667,7 @@ module.exports = {
    * @param {string} [value] The attribute value to check.
    * @returns {VAttribute | null} The found attribute.
    */
-  getAttribute(node, name, value) {
-    return (
-      node.startTag.attributes.find(
-        /**
-         * @param {VAttribute | VDirective} node
-         * @returns {node is VAttribute}
-         */
-        (node) => {
-          return (
-            !node.directive &&
-            node.key.name === name &&
-            (value === undefined ||
-              (node.value != null && node.value.value === value))
-          )
-        }
-      ) || null
-    )
-  },
+  getAttribute,
 
   /**
    * Get the directive list which has the given name.
@@ -873,7 +854,11 @@ module.exports = {
   },
 
   isMpxFile,
-
+  /**
+   * Checks whether the current file is uses `<script setup>`
+   * @param {RuleContext} context The ESLint rule context object.
+   */
+  isScriptSetup,
   /**
    * 检测当前文件是否是mpx文件且是创建mpx方法
    * @param {RuleContext} context The ESLint rule context object.
@@ -1562,12 +1547,14 @@ function createRequire(filename) {
  * @param {RuleContext} context The rule context to use parser services.
  * @param {TemplateListener} templateBodyVisitor The visitor to traverse the template body.
  * @param {RuleListener} [scriptVisitor] The visitor to traverse the script.
+ * @param { { templateBodyTriggerSelector: "Program" | "Program:exit" } } [options] The options.
  * @returns {RuleListener} The merged visitor.
  */
 function defineTemplateBodyVisitor(
   context,
   templateBodyVisitor,
-  scriptVisitor
+  scriptVisitor,
+  options
 ) {
   if (context.parserServices.defineTemplateBodyVisitor == null) {
     const filename = context.getFilename()
@@ -1582,7 +1569,8 @@ function defineTemplateBodyVisitor(
   }
   return context.parserServices.defineTemplateBodyVisitor(
     templateBodyVisitor,
-    scriptVisitor
+    scriptVisitor,
+    options
   )
 }
 
@@ -1857,7 +1845,73 @@ function getVExpressionContainer(node) {
 function isMpxFile(path) {
   return path.endsWith('.mpx')
 }
-
+/**
+ * Checks whether the current file is uses `<script setup>`
+ * @param {RuleContext} context The ESLint rule context object.
+ */
+function isScriptSetup(context) {
+  return Boolean(getScriptSetupElement(context))
+}
+/**
+ * Gets the element of `<script setup>`
+ * @param {RuleContext} context The ESLint rule context object.
+ * @returns {VElement | null} the element of `<script setup>`
+ */
+function getScriptSetupElement(context) {
+  const df =
+    context.parserServices.getDocumentFragment &&
+    context.parserServices.getDocumentFragment()
+  if (!df) {
+    return null
+  }
+  const scripts = df.children
+    .filter(isVElement)
+    .filter((e) => e.name === 'script')
+  if (scripts.length === 2) {
+    return scripts.find((e) => hasAttribute(e, 'setup')) || null
+  } else {
+    const script = scripts[0]
+    if (script && hasAttribute(script, 'setup')) {
+      return script
+    }
+  }
+  return null
+}
+/**
+ * Check whether the given start tag has specific directive.
+ * @param {VElement} node The start tag node to check.
+ * @param {string} name The attribute name to check.
+ * @param {string} [value] The attribute value to check.
+ * @returns {boolean} `true` if the start tag has the attribute.
+ */
+function hasAttribute(node, name, value) {
+  return Boolean(getAttribute(node, name, value))
+}
+/**
+ * Get the attribute which has the given name.
+ * @param {VElement} node The start tag node to check.
+ * @param {string} name The attribute name to check.
+ * @param {string} [value] The attribute value to check.
+ * @returns {VAttribute | null} The found attribute.
+ */
+function getAttribute(node, name, value) {
+  return (
+    node.startTag.attributes.find(
+      /**
+       * @param {VAttribute | VDirective} node
+       * @returns {node is VAttribute}
+       */
+      (node) => {
+        return (
+          !node.directive &&
+          node.key.name === name &&
+          (value === undefined ||
+            (node.value != null && node.value.value === value))
+        )
+      }
+    ) || null
+  )
+}
 /** @param {CallExpression} node */
 function isObjectArgument(node) {
   return (

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-mpx",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "Official ESLint plugin for Mpx.js",
   "main": "lib/index.js",
   "scripts": {
@@ -48,7 +48,7 @@
   },
   "dependencies": {
     "eslint-utils": "^2.1.0",
-    "mpx-eslint-parser": "0.0.8",
+    "mpx-eslint-parser": "0.0.9",
     "natural-compare": "^1.4.0",
     "semver": "^7.3.2",
     "vue-eslint-parser": "^7.1.0"