vuetify: [Bug Report] Could not find a declaration file for module 'vuetify/lib'

Versions and Environment

Vuetify: 1.3.15 Vue: 2.5.17 Browsers: Google Chrome OS: Windows 10

Steps to reproduce

Hi guys, I follow the Vue-CLI 3 guide and when I try to compile the source code the terminal show me a Typescript error.

$ vue create my-app
$ cd my-app
$ vue add vuetify
$ npm run serve

Expected Behavior

The Typescript code should compile.

Actual Behavior

2:21 Could not find a declaration file for module 'vuetify/lib'. 'C:/project/path/node_modules/vuetify/lib/index.js' implicitly has an 'any' type.
  Try `npm install @types/vuetify` if it exists or add a new declaration (.d.ts) file containing `declare module 'vuetify/lib';`
    1 | import Vue from 'vue'
  > 2 | import Vuetify from 'vuetify/lib'
      |                     ^
    3 | import 'vuetify/src/stylus/app.styl'
    4 |
    5 | Vue.use(Vuetify, {

Reproduction Link

https://codepen.io/MatiasOlivera/pen/JwbQqy

Other comments

Typescript: 3.2.2

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 62
Comments: 19 (3 by maintainers)

Commits related to this issue

fix typescript compiler error https://github.com/vuetifyjs/vuetify/issues/5944 — committed to ferrywlto/vuetify-pwa-starter by ferrywlto 5 years ago
Fixed error 'vuetify' does not exist in type https://github.com/vuetifyjs/vuetify/issues/5944 https://github.com/vuetifyjs/vuetify/issues/8289 — committed to frank-yoon/vue-cloud by frank-yoon 4 years ago
vuetify had a missing type declaration in tsconfig, as desribed here: https://github.com/vuetifyjs/vuetify/issues/5944#issuecomment-480494060 modified: tsconfig.json — committed to googleinterns/recomator by s17k 4 years ago

Most upvoted comments

@KaelWD Thank you for the link. More specifically, this comment helped me out to properly update my tsconfig.json:

"compilerOptions": {
  "types": ["...", "vuetify"],

+190

Al-un on Apr 6, 2019

In our projects, we use vue add vuetify approach to add Vuetify into our project.

The generated file plugins/vuetify.ts has this line:

import Vuetify from 'vuetify/lib';

remove the /lib from to import Vuetify from 'vuetify';

it will solve the issue. 🥂

if you are looking for a-la-carte installation please read: this

+27

ferrywlto on Aug 9, 2019

Adding this module declaration to a *.d.ts file works like a charm for my purposes:

declare module 'vuetify/lib' {
  import 'vuetify/types/lib'
}

+13

acklavidian on Sep 26, 2019

I had similar errors on a fresh install.

Once I did this, it worked.

Go in src/main.ts and paste the following content right after the imports import Vuetify from ‘vuetify’; import ‘vuetify/dist/vuetify.min.css’; Vue.use(Vuetify);

https://medium.com/@attiewilly/how-i-married-vuetify-with-typescript-d6441dedd16

+13

timothyeash on Aug 9, 2019

This is still an issue with a brand new project created with vue cli 4 and then adding vuetify via vue add vuetify. We shouldn’t have to be manually fixing issues after using the CLI, it should just work.

+12

dcb99 on May 15, 2020

This is not a good solution for two reasons:

You now have to manually list all packages with types in tsconfig.json.
The package consumer should not have to do anything for bundled types to work.

The recommended solution is to have the declaration files output alongside the built JavaScript files. Can this please be done?

Edit: Correction to point #1 above – you only need to list packages with global declarations.

+12

glen-84 on May 17, 2019

Still an issue with new projects… Why is this closed?

douglasg14b on Oct 26, 2020

This is added in the FAQ section of the docs.

MajesticPotatoe on Apr 13, 2020

This is really annoying, none of the above solutions works for me. New project with newest dependencies set up with CLI 3.

If i do

remove the /lib from to import Vuetify from ‘vuetify’;

the error disappears but styles are missing fonts.

declare module ‘vuetify/lib’ { import ‘vuetify/types/lib’ }

did not work either,

SOLUTION:

BUT this did the trick (in my tsconfig.json) , add “vuetify” to types: (And i assume its the only correct way??)

“types”: [ “webpack-env”, “jest”, “vuetify” ],

devpixde on Oct 5, 2019

Hello guys, any news on this ?? I’d really love for vuetify to support typescript. Otherwise the tests don’t even run, so the app becomes impossible to test

hamza0867 on Aug 6, 2019

@devpixde “vuetify” should be in the types anyway, but that is not what helped me out.

I’ve changed the import statement to import { Scroll } from 'vuetify/es5/directives'; and this works for me.

Btw, the problem has been confirmed on official discord #bugs channel on 09/09/2019, but I’ve no idea if that yielded anything further.

Aurora12 on Oct 5, 2019

@ferrywlto thanks! I’ve just used everything brand new including Vuetify 2.0.10, and stumbled upon this issue.

Aurora12 on Aug 22, 2019

See https://github.com/vuetifyjs/vue-cli-plugin-vuetify/issues/43

KaelWD on Dec 20, 2018