Default export of the module has or is using private name 'Props'

See original GitHub issue

when upgrade volar to ^0.34.9 , there is a ts warning Default export of the module has or is using private name 'Props' at the top of template

//error info -> Default export of the module has or is using private name 'Props'. ts(4082)
<template>test</template>
<script lang="ts" setup>
  //step1: declear type
  interface Props {
    foo: string;
  }
 // setp2: defineProps
  defineProps<Props>(); 
</script>

but if definePorps like below, the warning disappear

<template>test</template>
<script lang="ts" setup>
  defineProps<{
    foo: string;
  }>();
</script>

Issue Analytics

State:
Created a year ago
Comments:22 (6 by maintainers)

Top GitHub Comments

20reactions

HugoMullercommented, Jun 24, 2022

Hi,

I found a lighter alternative to moving the interfaces: exporting them also works with Volar 0.38.1.

<script lang="ts" setup>
  export interface Props {
    msg?: string
    labels?: string[]
  }

  const props = withDefaults(defineProps<Props>(), {
    msg: 'hello',
    labels: () => ['one', 'two']
  })
</script>

But I totally agree with @buckeyez. Volar should comply with Vue, and not the other way around.

12reactions

johnsoncodehkcommented, Apr 25, 2022

Hi @hayabusa2009, try remove "declaration": true in tsconfig or move interface Props to script block.

<script lang="ts">
//step1: declear type
interface Props {
  foo: string;
}
</script>

<script lang="ts" setup>
// setp2: defineProps
defineProps<Props>(); 
</script>

Top Results From Across the Web

Typing error "Default export of the module has or is using ...

error TS4082 : Default export of the module has or is using private name 'Reducer'. Any idea on what's going on and how...

Typescript - Default export of the module has or is using ...

I've been trying for a day to resolve without success. I had a project that worked, now it doesn't.

Default export of the module has or is using ... - Vue Forum

I just migrate my TypeScript project to Vue 2.5. I try to export my install function of my plugin import Vue from 'vue';...

TSConfig Option: allowSyntheticDefaultImports - TypeScript

This option brings the behavior of TypeScript in-line with Babel, where extra code is emitted to make using a default export of a...

TypeScript: has or is using private name - CodeSandbox

thejohnfreemanJohn Freeman. Forked Fromobserver + nested props; Environmentcreate-react-app-typescript. Files. Model.ts. index.html. index.ts. package.json.