Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

The packaged Vue3 component props. ts cannot call the props. ts type properly #247

Open
InfernalAzazel opened this issue Sep 27, 2024 · 1 comment
Labels
bug Something isn't working

Comments

@InfernalAzazel
Copy link

InfernalAzazel commented Sep 27, 2024

Environment

os: Ubuntu 22.04
node: v20.17.0
vue: 3.4.37
unbuild: 2.0.0

Reproduction

git
docs

Describe the bug

  1. The packaged Vue3 component props. ts cannot call the props. ts type properly
  2. I don't know why the components encapsulated in dist compiled from docs can still be used normally
  3. Uncaught SyntaxError: The requested module '/@fs/work/kylin/github/k-naiveui-pro/packages/k-naiveui-pro/dist/components/ProBaseForm/index.mjs' does not provide an export named 'ProBaseFormColumn' (at ProBaseForm.vue:3:28)
  • In reality, I is exporting ProBaseForm (ProBaseForm/props.ts)[https://github.com/InfernalAzazel/k-naiveui-pro/blob/main/packages/k-naiveui-pro/src/components/ProBaseForm/props.ts]
import type { FormProps} from 'naive-ui'
import type { VNode } from 'vue';


export interface ProBaseFormColumn {
  label: string
  prop: string
  component: string | VNode
  props?: Record<string, any>
  span?: number
  show?: boolean

}

export interface ProBaseFormProps extends  /* @vue-ignore */ FormProps {
  columns: ProBaseFormColumn[],
  cols?: number
  xGap?: number
  yGap?: number
  columnsSpan?: number
  footerSpan?: number
  collapsed?: boolean
  collapsedRows?: number
}

This is my packaging configuration

import { defineBuildConfig } from 'unbuild'
export default defineBuildConfig({

  entries: [
    { builder: 'mkdist', input: './src', pattern: ['**/*.vue'], loaders: ['vue'] },
    { builder: 'mkdist', input: './src', pattern: ['**/*.ts'], format: 'cjs', loaders: ['js'] },
    { builder: 'mkdist', input: './src', pattern: ['**/*.ts'], format: 'esm', loaders: ['js'] },
  ],
  declaration: true,
  clean: true,
  // externals: [
  //   'vue',
  //   'naive-ui',
  //   'unplugin-vue-components',
  // ],
})

Additional context

  1. pnpm docs:dev (Exception occurred)
    image

2.Compile dist and upload it to GitHub page(natural)
image

Logs

Uncaught SyntaxError: The requested module '/@fs/work/kylin/github/k-naiveui-pro/packages/k-naiveui-pro/dist/components/ProBaseForm/index.mjs' does not provide an export named 'ProBaseFormColumn' (at ProBaseForm.vue:3:28)
@Teages
Copy link
Contributor

Teages commented Oct 7, 2024

<script setup> are closed, it means your type export would not work as you want.
move them to a non-setup script could fix it.

<script lang="ts">
export interface xxx {}
</script>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants