vuejs / babel-plugin-jsx

JSX for Vue 3
https://vue-jsx-explorer.netlify.app
MIT License
1.71k stars 142 forks source link

Vue内置组件提示Property '$children' does not exist on type #627

Open McPorkChop opened 1 year ago

McPorkChop commented 1 year ago

🧐 Problem Description

在使用Vue内置组件时提示Property '$children' does not exist on type,但是通过使用v-slots时写入时正常。 求助原因🙏

💻 Sample code

我的依赖情况

{
    "dependencies": {
        "@mdi/font": "7.0.96",
        "@vuepic/vue-datepicker": "3.5.3",
        "@vueuse/core": "9.6.0",
        "axios": "1.2.0",
        "chart.js": "4.0.1",
        "chartjs-adapter-date-fns": "2.0.1",
        "date-fns": "2.29.3",
        "lodash": "4.17.21",
        "roboto-fontface": "*",
        "vue": "3.2.45",
        "vue-chartjs": "4.1.2",
        "vue-router": "4.1.6",
        "vuetify": "3.0.2",
        "webfontloader": "1.6.28"
    },
    "devDependencies": {
        "@types/lodash": "^4.14.191",
        "@types/node": "18.11.10",
        "@types/webfontloader": "1.6.35",
        "@vitejs/plugin-legacy": "2.3.1",
        "@vitejs/plugin-vue": "3.2.0",
        "@vitejs/plugin-vue-jsx": "2.1.1",
        "husky": "8.0.2",
        "lint-staged": "13.0.4",
        "minimist": "^1.2.7",
        "sass": "1.56.1",
        "shelljs": "0.8.5",
        "terser": "5.16.0",
        "typescript": "4.9.3",
        "vite": "3.2.4",
        "vite-plugin-vuetify": "1.0.0",
        "vue-tsc": "1.0.10"
    }
}

tsconfig

{
  "compilerOptions": {
    "baseUrl": ".",
    "target": "esnext",
    "useDefineForClassFields": true,
    "allowSyntheticDefaultImports": true,
    "composite": true,
    "module": "esnext",
    "moduleResolution": "node",
    "strict": true,
    "jsx": "preserve",
    "sourceMap": false,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "lib": [
      "esnext",
      "dom"
    ],
    "types": [
      "vuetify"
    ],
    "paths": {
      "@/*": [
        "src/*"
      ]
    },
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.d.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "vite.config.ts",
    "colorrc.ts",
    "env.d.ts",
    "@types/**.d.ts",
    "src/layout/base"
  ]
}

vite.config

// Plugins
import vue from "@vitejs/plugin-vue";
import vueJsx from "@vitejs/plugin-vue-jsx";
import vuetify from "vite-plugin-vuetify";
import legacy from "@vitejs/plugin-legacy";

// Utilities
import { defineConfig } from "vite";
import { fileURLToPath, URL } from "node:url";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    vueJsx({ transformOn: true, optimize: true }),
    vuetify({
      autoImport: true,
    }),
    legacy(),
  ],
  build: {
    sourcemap: true,
  },
  define: { "process.env": {} },
  resolve: {
    alias: {
      "@": fileURLToPath(new URL("./src", import.meta.url)),
    },
    extensions: [".js", ".json", ".jsx", ".mjs", ".ts", ".tsx", ".vue"],
  },
  css: {},
});

🚑 Other information

image

funny-family commented 1 year ago

@McPorkChop, there is no such thing as $children in vue.

McPorkChop commented 1 year ago

resolved, tsconfig problem