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
[Bug Report] No typings for importing "A La Carte" components #3943
Comments
I've added some basic types: Lines 1 to 15 in 10c86d1
Unfortunately I couldn't get transform-imports or ts-import-plugin working, so you'll have to import everything like so: import Vuetify from 'vuetify/es5/components/Vuetify'
import VApp from 'vuetify/es5/components/VApp'
import VNavigationDrawer from 'vuetify/es5/components/VNavigationDrawer'
import VFooter from 'vuetify/es5/components/VFooter'
import VList from 'vuetify/es5/components/VList'
import VBtn from 'vuetify/es5/components/VBtn'
import VIcon from 'vuetify/es5/components/VIcon'
import VGrid from 'vuetify/es5/components/VGrid'
import VToolbar from 'vuetify/es5/components/VToolbar'
import transitions from 'vuetify/es5/components/transitions'
import 'vuetify/src/stylus/app.styl' |
will you consider creating a new issue to for the transform-imports / ts-import-plugin aspect. |
I don't know if there's any more I can do to help with that, if it works I imagine it'd use these types. I spent a couple hours on it but couldn't get anything to happen, but you're welcome to have a go. |
Hello! How do you guys found that Typescript accepts a glob pattern for module name? sorry for off topic! 😁 |
Hey, I tried the above steps and am getting the following:
"dependencies": { |
@iancrowther Did you fix this? I can't seem to get VSCode to find the typings even though it exists here... |
@Li357 what exactly are you importing? |
@qm3ster Right now I'm importing VApp and Vuetify a la carte:
And VSCode complains:
I don't need any actual typings, but why would the errors be there if I'm just importing a la carte? |
Hit the same issue. |
Solved the issue by adding
|
@JeremyWalters I never had to do that. |
@qm3ster My
|
@KaelWD Is there a good reason declare const Vuetify: Vuetify
export default Vuetify
export interface Vuetify {
install: PluginFunction<VuetifyUseOptions>
version: string
} Can I just change it to this? declare const VuetifyPlugin: Vuetify
export default VuetifyPlugin
export interface Vuetify {
install: PluginFunction<VuetifyUseOptions>
version: string
} |
@qm3ster :
|
@tohagan yeah, that file is supposed to be re-exporting just the |
@Li357 Sorry no, I had to park this! |
Is this supposed to be fixed? Just created test project with vue-cli 3 with typescript and still got this problem. All a la carte imports apart first one - vuetify - are erroneous. |
You need |
@KaelWD adding "types": ["vuetify"] in tsconfig doesn't solve the problem unfortunately. Why do we need typings when the source is already typescript? |
Same, problem still exists when installing |
I resolved it by making it a.js file instead of.ts until there is a better solution |
Yep, installed via |
same here: Could not find a declaration file for module 'vuetify/lib |
I hit a similar issue. However using According to the documentation, those compiler options are exclusive. You can't use both. {
"compilerOptions": {
//...
},
"include": [
"node_modules/vuetify/types",
]
} Given that TypeScript does not allow to have an array in the @KaelWD Would you accept a PR that did the above? |
"include": [
..., // let the default includes
"node_modules/vuetify/types", // add this one
]
"exclude": [
"node_modules/^(?!vuetify/types).*$" // change the default exclude rule to this
], Just that and it's ok. |
I don't really understand how that would help, don't you still need to tell tsc to include that somehow? |
@KaelWD Sorry, after re-reading my comment, I realized that it wasn't really clear. By default, for an imported package named Currently, vuetify/packages/vuetify/package.json Line 15 in 7e9dab2
However this files only include a subset of all type definitions of the different way My previous suggestion involved renaming
Does that makes sense? |
All of those are imported by index.d.ts, there's no need to concatenate them.
That's the problem here, we're importing |
I completely missed those lines. I guess this might be a bug in TypeScript, I'll investigate more.
In my understanding (but I'll have to check), TypeScript knows that anything of the form |
Ok, I am very confused. I tried to create a simple project that would expose the problem we are facing, but in that small repo, everything just works. I am really starting to think that this might be a weird bug in the TypeScript compiler. |
@pascoual's solution above works for the time being. "include": [
"node_modules/vuetify/types",
],
"exclude": [
"node_modules/^(?!vuetify/types).*$"
], |
Unfortunately, this is still an issue, and quite annoying for newcomers to Vue/Vuetify/TypeScript: "ERROR in C:/Users/nemet/tiva11/tiva11forvue/src/plugins/vuetify.ts Fortunately, @pascoual solution worked to me, either. |
The problem still exists when trying to import individual components in unit tests.
|
I added vuetify with the CLI and got the typescript error. This solution worked for me: TLDR: In |
I think this should be added into the document of https://vuetifyjs.com/en/framework/a-la-carte |
this problem still exists in Vuetify 2, even after adding "vuetify" to types (in tsconfig.json) |
Is it possible to add more specific typings for individual components? For example, adding method definitions like "reset()" or 'validate()" on Input Components? This will immensely increase productivity for TypeScript users! |
Versions and Environment
Vuetify: 1.0.17
Vue: 2.5.16
Browsers: Chrome 66.0.3359.117
OS: Windows 10
Steps to reproduce
Run
Then you add typescript support to
my-project
(changemain.js
tomain.ts
etc...) by following the official vue page on typescript or something like https://github.com/Microsoft/TypeScript-Vue-StarterAttempting to run this (i.e.
npm run dev
) will result in errors such as:which pertaining to the following import lines in
main.ts
Expected Behavior
no errors. should build and run fine.
Actual Behavior
has errors doesn't build or run
Reproduction Link
https://github.com/vuetifyjs/vuetify/blob/dev/index.d.ts
Other comments
Please update https://github.com/vuetifyjs/vuetify/blob/dev/index.d.ts
You will see over there, that there are actually no references to exported
A La Carte
components etc..Note that Even though this pertains to A La Carte, it must actually be fixed in the main vuetify repo is why this issue has been opened here.
The text was updated successfully, but these errors were encountered: