search

youzan / vant

A lightweight, customizable Vue UI library for mobile web apps.
https://vant.pro/vant/
MIT License
23.15k stars 9.47k forks source link

[Bug Report] Vue 3 TS import components, IDE autocompletion #7508

Closed fabianmarz closed 3 years ago

fabianmarz commented 3 years ago

Device / Browser

Chrome, PHPStorm

Vant Version

3.0.0-beta.6

Vue Version

3.0.2

Reproduction Link

https://codesandbox.io/s/vant-issue-moban-forked-z7efb

Describe the bug

Sorry if this is the wrong place but I need some guidance in how to setup Vant 3 with Vue 3. In the codesandbox link I replicated the main three files I'm having it running locally. In the setup guide of Vant, it tells to use the ts-import-plugin. but it seems to work with the configuration I have in the babel.config.js as well.

My question is, how to import the components properly so my IDE is picking up the autocompletion of possible attributes. The autocompletion is working for van-button or VanButton only. When I import import { Button } from 'vant';, I cannot use <van-button> in the template, but have to tell the Vue component to use the Vant component with the name override instead (see App.vue). Is there a proper way of including the Vant components without the necessity of declare the name of each?

Hope you are getting what my question is :-)

chenjiahan commented 3 years ago

It depends on how your IDE recognizes Vue components.

I recomment using vscode with vetur plugin, it can provide smart autocompletion for .vue file.

image