我在try 建立一个新项目时遇到了麻烦.我用的是Vue3， typewriter ， cypress .而且这个问题可能存在于打字配置中的某个地方.

下面是MWE.如果能帮上一点忙，我会很感激的.

我有这个Vue3组件在src/component/MinimalWorkingExample.vue:

<script setup lang="ts">
interface Props {
  headerText: string;
}

const props = defineProps<Props>();
</script>

<template>
  <div>
    <slot></slot>
  </div>
</template>

<style lang="scss" scoped></style>

我要在src/component/MinimalWorkingExample.cy.ts分钟内对那个部件进行 cypress 测试:

import MinimalWorkingExample from "./MinimalWorkingExample.vue";

describe("<MinimalWorkingExample />", () => {
  it("renders", () => {
    cy.mount(MinimalWorkingExample, {
      props: { headerText: "Testing" },
      slots: { default: "Testing text ..." },
    });
  });
});

我的IDE是红色下划线，cy.mount(MinimalWorkingExample, ...中的MinimalWorkingExample表示No overload matches this call.当我拨打vue-tsc --noEmit时，它抱怨同样的事情，并提供了更多细节:

src/component/MinimalWorkingExample.cy.ts:5:14 - error TS2769: No overload matches this call.
  The last overload gave the following error.
    Argument of type '__VLS_WithTemplateSlots<DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, ... 5 more ..., {}>, { ...; }>' is not assignable to parameter of type 'ComponentOptionsWithObjectProps<Readonly<ComponentPropsOptions>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOp
tionsMixin, string[], string>'.
      Type '__VLS_WithTemplateSlots<DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, ... 5 more ..., {}>, { ...; }>' is not assignable to type 'ComponentOptionsBase<{ [x: number]: unknown; [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined; readonly length?: numb
er | Prop<unknown, unknown> | null | undefined; readonly concat?: Prop<unknown, unknown> | { (...items: ConcatArray<...>[]): string[]; (...items: (string | ConcatArray<...>)[]): s...'.
        Types of property 'setup' are incompatible.
          Type '((this: void, props: LooseRequired<Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>> & {}>, ctx: { ...; }) => void | ... 2 more ... | Promise<...>) | undefined' is not assignable to type '((this: void, props: LooseRequired<{ [x: number]: unknown; [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined; reado
nly length?: number | Prop<unknown, unknown> | null | undefined; readonly concat?: Prop<unknown, unknown> | { ...; } | null | undefined; ... 27 more ...; readonly toLocaleString: (()...'.
            Type '(this: void, props: LooseRequired<Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>> & {}>, ctx: { ...; }) => void | ... 2 more ... | Promise<...>' is not assignable to type '(this: void, props: LooseRequired<{ [x: number]: unknown; [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined; readonly length?: 
number | Prop<unknown, unknown> | null | undefined; readonly concat?: Prop<unknown, unknown> | { ...; } | null | undefined; ... 27 more ...; readonly toLocaleString: (() ...'.
              Types of parameters 'props' and 'props' are incompatible.
                Property 'headerText' is missing in type 'LooseRequired<{ [x: number]: unknown; [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined; readonly length?: number | Prop<unknown, unknown> | null | undefined; readonly concat?: Prop<unknown, unknown> | { ...; } | null | undefined; ... 27 more ...; readonly toLocaleString: (()
 => string) & string;...' but required in type 'LooseRequired<Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>> & {}>'.

5     cy.mount(MinimalWorkingExample, {
               ~~~~~~~~~~~~~~~~~~~~~

  src/component/MinimalWorkingExample.vue:3:3
    3   headerText: string;
        ~~~~~~~~~~
    'headerText' is declared here.
  node_modules/cypress/vue/dist/index.d.ts:1377:18
    1377 declare function mount<PropsOptions extends Readonly<ComponentPropsOptions>, RawBindings, D extends {}, C extends ComputedOptions = {}, M extends Record<string, Function> = {}, E extends EmitsOptions = Record<string, any>, Mixin extends ComponentOptionsMixin = ComponentOptionsMixin, Extends extends ComponentOptionsMixin = ComponentOptionsMixin
, EE extends string = string>(componentOptions: ComponentOptionsWithObjectProps<PropsOptions, RawBindings, D, C, M, E, Mixin, Extends, EE>, options?: MountingOptions<ExtractPropTypes<PropsOptions> & PublicProps, D>): Cypress.Chainable<{
                          ~~~~~
    The last overload is declared here.


Found 1 error in src/component/MinimalWorkingExample.cy.ts:5

现在是奇怪的事情:

当我用<slot></slot>注释掉该行时，我的IDE停止解压MinimalWorkingExample,vue-tsc --noEmit成功完成，没有输出.

它也很成功，当我保留了<slot></slot>英镑，而摆脱了headerText: string;英镑的房产.

在cy.mount(MinimalWorkingExample as any, ...中使用as any也可以解决这个问题.但我想要一份漂亮的Typescript .

More details:

以下是我的tsconfig.json条:

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "lib": [
      "esnext",
      "dom",
      "dom.iterable"
    ],
    "allowJs": false,
    "jsx": "preserve",
    "skipLibCheck": true,
    "esModuleInterop": false,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "noEmit": true,
    "types": [
      "node",
      "vite/client",
      "cypress",
      "./src/shims-vue.d.ts"
    ]
  },
  "include": [
    "src",
    "test/cypress"
  ]
}