opentiny / tiny-vue

TinyVue is an enterprise-class UI component library of OpenTiny community, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.
https://opentiny.design/tiny-vue
MIT License
1.62k stars 259 forks source link

✨ [Feature]: It is recommended to add volar.d.ts and component resolvers #432

Closed silentmx closed 2 months ago

silentmx commented 1 year ago

What problem does this feature solve

  1. 在组件使用过程中缺少组件props类型提示,可以通过添加volar.d.ts配合vue3 volar插件使用

image

  1. 组件按需加载可以添加unplugin-vue-components插件的ComponentResolver使用,而不必再添加@opentiny/vue-vite-import
    // https://github.com/antfu/unplugin-vue-components
    Components({
    // allow auto load markdown components under `./src/components/`
    extensions: ['vue', 'md'],
    // allow auto import and register components used in markdown
    include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
    dts: 'src/components.d.ts',
    resolvers: [
    // OpenTiny component resolve
    {
      type: "component",
      resolve: (name: string) => {
        if (name.match(/^Tiny[A-Z]|tiny-[a-z]/)) {
          return {
            name: name.replace(/[Tt]iny/, ""),
            as: name,
            from: "@opentiny/vue"
          }
        }
      }
    }
    ]
    }),

What does the proposed API look like

暴露volar.d.ts和ComponentResolver

zzcr commented 11 months ago

您好,感谢你的意见,我们内部评估下~~

Issues-translate-bot commented 11 months ago

Bot detected the issue body's language is not English, translate it automatically.


Hello, thank you for your opinion, we will evaluate it internally~~

shenjunjian commented 2 months ago

1、组件的属性事件声明缺少, 我们最近也在找方案,在确定之后会补全声明 2、我们暴露的插件其实就是对 unplugin-vue-components 的封装,是和你的方法一样的。 封装后能减少用户自行配转unplugin-vue-components。

Issues-translate-bot commented 2 months ago

Bot detected the issue body's language is not English, translate it automatically.


  1. The attribute event declaration of the component is missing. We are also looking for a solution recently and will complete the declaration after it is determined.
  2. The plug-in we expose is actually the encapsulation of unplugin-vue-components, which is the same as your method. After encapsulation, it can reduce the need for users to configure unplugin-vue-components by themselves.