vue-cli-plugin-quasar
vue-cli-plugin-quasar copied to clipboard
Could not find a declaration file for module after upgrading to 3.0.1
Describe the bug
I started getting the following error during both of dev
and build
runs. The error appears in every .ts
file, where I have anything imported from 'quasar'
. So in my case - uid
and Notify
.
TS7016: Could not find a declaration file for module 'quasar/src/utils/uid.js'. '/path/to/app/node_modules/quasar/src/utils/uid.js' implicitly has an 'any' type.
To Reproduce
Error only started appearing after upgrading from 2.. to 3.0.1.
I have followed the upgrade guide as posted in release notes.
The rest of the code is otherwise unchanged.
I import from quasar with the following statement from docs, e.g. import { uid } from 'quasar'
.
Expected behavior Requested helpers being imported and not to throw any errors during compilation.
Platform (please complete the following information): Node: 14.3.1 NPM: 6.14.8 vue-cli-plugin-quasar: 3.0.1 quasar: 1.14.1 @quasar/extras: 1.9.8
Additional context
The interesting bit is that the IDE (VSC) highlights uid
function signature as expected () => string
, despite the above mentioned error.
Moreover, from time to time, with no apparent reason, the dev
(vue-cli-service serve
) command seems to compile just fine without any errors.
I'm still hesitating to post this issue, however I'm completely puzzled as to why such would be happening. I will gladly provide any additional info if needed, yet I'm not sure where to start looking for potential cause of this problem.
Kind regards
Hey there @mv-go, could you check if the problem happens also on a fresh install? Do you have the time to produce a repro?
Hey! Will try today, yup.
hey @IlCallo , sorry for a late reply!
Unfortunately, I was not able to reproduce the issue on a fresh install. Which only has me bugging, what is going wrong in my larger project.
Anyhow, since I can not reliably reproduce the issue, I guess this thread can be closed :(
Ooops, never mind, I think I found it. What helped is removing a bunch of (I think) unnecessary code from my project's vue.config
. Yeah, we do have a fairly large (50k+ lines) codebase, most of which was written a fair bit ago by people who are no longer with us.
Anyhow, steps that allowed me to reproduce.
-
vue create
with all the usual suspects + typescript (and Class-style component syntax) -
vue add quasar
with, once again, nothing special (font awesome, roboto, ie11 support, allow overwriting vue default components, etc.) - create a simple
utils
folder withutils.ts
inside, which importsuid
fromquasar
and exports a single method, like so
import { uid } from 'quasar'
export const generateUid = (): string => {
const newUid = uid()
return newUid
}
- import this helper in
HelloWorld.vue
->import { generateUid } from '../utils/utils'
- call it in
created
created () {
this.uuid = generateUid()
}
- display it in component
<div>
my new uid {{ uuid }}
</div>
- modify
vue.config.js
with a bunch of Webpack configs (from my larger project). Below is the entire file contents
module.exports = {
chainWebpack: config => {
const rule = config.module.rule('ts')
rule.uses.delete('thread-loader')
rule.use('ts-loader')
.loader('ts-loader')
.tap(options => {
// modify the options...
options.transpileOnly = false
options.happyPackMode = false
return options
})
const ruleX = config.module.rule('tsx')
ruleX.uses.delete('thread-loader')
ruleX.use('ts-loader')
.loader('ts-loader')
.tap(options => {
// modify the options...
options.transpileOnly = false
options.happyPackMode = false
return options
})
},
pluginOptions: {
quasar: {
importStrategy: 'kebab',
rtlSupport: false
}
},
transpileDependencies: [
'quasar'
]
}
- modify build scripts in
package.json
to use modern option as well"build": "vue-cli-service build --modern"
- run
npm run build
- command will fail with the following error
[tsl] ERROR in /path/to/project/src/utils/utils.ts(1,17)
TS7016: Could not find a declaration file for module 'quasar/src/utils/uid.js'. '/path/to/project/node_modules/quasar/src/utils/uid.js' implicitly has an 'any' type.
Not sure, why the above config would break the build, but here I am. Remove the aforementioned Webpack config (except for pluginOptions
and transpileDependencies
of course) resolves the issue. I'll still leave this here for anyone else, who might stumble upon this.
@IlCallo once again, thank you for your help. If you have any idea as to why this is happening - please spare a couple of minutes to educate me on the issue :)
Kind regards