feat(no-import-compiler-macros): clarify that macros are not allowed outside <script setup> (#2938)

Co-authored-by: Flo Edelmann <git@flo-edelmann.de>

Author: Sysix

.changeset/lemon-socks-follow.md

@@ -0,0 +1,5 @@
+---
+'eslint-plugin-vue': minor
+---
+
+Updated `vue/no-import-compiler-macros` to clarify that macros are not allowed outside `<script setup>`

lib/rules/no-import-compiler-macros.js

@@ -4,6 +4,8 @@
  */
 'use strict'
 
+const utils = require('../utils')
+
 const COMPILER_MACROS = new Set([
   'defineProps',
   'defineEmits',
@@ -35,7 +37,9 @@ module.exports = {
     schema: [],
     messages: {
       noImportCompilerMacros:
-        "'{{name}}' is a compiler macro and doesn't need to be imported."
+        "'{{name}}' is a compiler macro and doesn't need to be imported.",
+      onlyValidInScriptSetup:
+        "'{{name}}' is a compiler macro and can only be used inside <script setup>."
     }
   },
   /**
@@ -60,7 +64,9 @@ module.exports = {
 
           context.report({
             node: specifier,
-            messageId: 'noImportCompilerMacros',
+            messageId: utils.isScriptSetup(context)
+              ? 'noImportCompilerMacros'
+              : 'onlyValidInScriptSetup',
             data: {
               name: specifier.imported.name
             },

tests/lib/rules/no-import-compiler-macros.js

@@ -214,6 +214,54 @@ tester.run('no-import-compiler-macros', rule, {
           endColumn: 60
         }
       ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      // not in <script setup>
+      import { defineProps } from 'vue'
+      </script>
+      `,
+      output: `
+      <script>
+      // not in <script setup>
+      
+      </script>
+      `,
+      errors: [
+        {
+          messageId: 'onlyValidInScriptSetup',
+          data: {
+            name: 'defineProps'
+          },
+          line: 4,
+          column: 16,
+          endLine: 4,
+          endColumn: 27
+        }
+      ]
+    },
+    {
+      filename: 'test.ts',
+      code: `
+      import { defineProps } from 'vue'
+      `,
+      output: `
+      
+      `,
+      errors: [
+        {
+          messageId: 'onlyValidInScriptSetup',
+          data: {
+            name: 'defineProps'
+          },
+          line: 2,
+          column: 16,
+          endLine: 2,
+          endColumn: 27
+        }
+      ]
     }
   ]
 })