frikinside / vue3-simple-typeahead

A simple and lightweight Vue3 typeahead component that show a suggested list of elements while the user types in.
https://vue3-simple-typeahead-demo.netlify.app/
MIT License
95 stars 28 forks source link

failed to resolve component vue3-simple-typeahead #12

Open bci24 opened 2 years ago

bci24 commented 2 years ago

The component is not working on vue 3 (composition api)

I need this in a component not globally

In my custom component I imported like in the example:

import SimpleTypeahead from 'vue3-simple-typeahead''
export default {
  name: 'my-vue-component',
  ...
  components: {
    SimpleTypeahead
  }
  ...
}

but it does not appear and I get a warning:

Failed to resolve component: vue3-simple-typeahead
If this is a native custom element, make sure to exclude it from component resolution via compiler.isCustomElement .......

Any idea?

* UPDATE **

1) If using as global is working..... but I don't want as global. 2) is there a way to bind some classes directly to the input ? ex: form-control form-control-lg .... Or I have to customize it individually to look like the bootstrap inputs....

frikinside commented 2 years ago

I used option api to build the component, but I'm not sure if that could be the problem. I don't think so, bit I could be wrong.

I'll make a few tests as soon as I can.

El vie, 6 may 2022 8:29, bci24 @.***> escribió:

The component is not working on vue 3 (composition api)

I need this in a component not globally

In my custom component I imported like in the example:

import SimpleTypeahead from 'vue3-simple-typeahead'' export default { name: 'my-vue-component', ... components: { SimpleTypeahead } ... }

but it does not appear and I get a warning:

Failed to resolve component: vue3-simple-typeahead If this is a native custom element, make sure to exclude it from component resolution via compiler.isCustomElement .......

Any idea?

— Reply to this email directly, view it on GitHub https://github.com/frikinside/vue3-simple-typeahead/issues/12, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADKRYJF6LPTEH6DLDWG75A3VIS357ANCNFSM5VHFLQKQ . You are receiving this because you are subscribed to this thread.Message ID: @.***>

frikinside commented 2 years ago

Sorry that keep you waiting, I did a few tests, but could not reproduce the problem.

I see no problem using the component with composition api, do you still have this problem?

P.D. Yes, I just updated the component adding fallingthrought attributes so you can add whatever attribute you want (like class) and it fallthrough to the input.

BradA1878 commented 2 years ago

@bci24 & @frikinside - This is a TypeScript error due to there not being a type declaration for the component. You can get around the issue by adding / // @ts-ignore above the line where the import is made.

frikinside commented 2 years ago

Thanks for the input @BradA1878!! @bci24 could you please try the solution provided by @BradA1878 and check if that solve your issue?

deadbaed commented 2 years ago

I also had this typescript error, when I was building my project (with vite) I got this issue:

Screenshot 2022-08-22 at 01 04 45

I fixed the issue by creating the file vue3-simple-typeahead.d.ts anywhere in my project with the following content (like the error message is saying):

declare module "vue3-simple-typeahead";

Yes, there's no typescript types, but at least the build error is gone :)

frikinside commented 2 years ago

Thanks a lot @x4m3 I'm not used to typescript so I find this kind of comments incredible valuable! Very nice way to "trick" typescript to avoid the build error.

There is no detrimental problems with that, right?

deadbaed commented 2 years ago

no, there's no detrimental problems, there just won't be any typescript typings, but it's still going to be valid javascript