I added some custom commands to my project and I also added a declaration file. According to Cypress's documentation, they say "To include the new ".d.ts" file into IntelliSense, I could update tsconfig.json", so I did and I don't know what is wrong...
the tsconfig file :
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"allowJs": true,
"strict": true,
"baseUrl": ".",
"paths": {
"cypress": [
"../node_modules"
],
"support": [
"../support"
]
},
"types": [
"cypress",
"support"
],
"esModuleInterop": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true
},
"include": [
"**/*.ts",
"**/*.d.ts"
],
"exclude": [
"config/config.js"
]
}
Refer to the Cypress Real World App, a payment application to demonstrate real-world usage of Cypress testing methods, patterns, and workflows.
The cypress/global.d.ts file demonstrates how to add type declarations for custom commands and tasks and cypress/tsconfig.json has additional TypeScript configuration.
Related
My Angular tsconfig does not detect my Cypress 12.3 types. I've tried all kinds of things to get this working, short of starting my Cypress project over (which I suspect would work).
My code runs fine but I cannot resolve this situation pictured here in my IDE:
At the moment, my cypress/tsconfig.json looks like this:
{
"extends": "../tsconfig.spec.json",
"files": [
"../cypress/**/*.ts",
"../cypress.config.ts",
"../node_modules/cypress"
],
"compilerOptions": {
"sourceMap": false,
"types": ["cypress", "node", "jasmine-expect", "chai"]
}
}
The above config is trying to prefer jasmine expect type over chai expect, which I REQUIRE.
Ok, I found the solution. Must be careful about using files rather than include/exclude:
{
"extends": "../tsconfig.spec.json",
"include": [
"**/*.ts",
"../cypress.config.ts",
"../node_modules/cypress"
],
"exclude": [
"../src/**/*.ts"
],
"compilerOptions": {
"sourceMap": false,
"types": ["cypress", "node", "jasmine-expect"]
}
}
Please does anyone know how to resolve this error??
TypeScript intellisense is disabled on template. To enable, configure `"jsx": "preserve"` in the `"compilerOptions"` property of tsconfig or jsconfig. To disable this prompt instead, configure `"experimentalDisableTemplateSupport": true` in `"vueCompilerOptions"` property.volar
in jsconfig.json
{
"compilerOptions": {
"target": "es5",
"module": "esnext",
"baseUrl": "./",
"moduleResolution": "node",
"paths": {
"#/*": [
"src/*"
]
},
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
],
"jsx": "preserve"
}
}
write --> "jsx": "preserve"
You need to add "jsx": "preserve" to your config under the compilerOptions section. This is slightly different depending on how your project is set up.
This is the officially recommended solution.
If you're using a .tsconfig it will look like this:
{
"compilerOptions": {
"jsx": "preserve"
}
}
With Nuxt 3 your .tsconfig will look closer to this:
{
// https://v3.nuxtjs.org/concepts/typescript
"extends": "./.nuxt/tsconfig.json",
"compilerOptions": {
"jsx": "preserve"
}
}
If you're using a .jsconfig then it will be more like this:
{
"compilerOptions": {
"module": "commonjs",
"target": "es6",
"jsx": "preserve"
},
"include": ["src/**/*"]
}
I wrote a short blog post on solving this here: michaelnthiessen.com/typescript-intellisense-error
On file jsconfig.json
add:
"vueCompilerOptions": {
"experimentalDisableTemplateSupport": true
},
In your jsconfig.json, put the following
"jsx": "preserve"
I was getting the same error
write "jsx": "preserve" in jsconfig.json file did work.
I have a Vue 2.x CLI based project that runs with typescript and vue class components. Here I want to use a package called vueisotope that has no type definition file. To make it work with typescript I changed my tsconfig.json to alternatively search for .d.ts files inside a 'customTypes' folder. I also created a customTypes/vueisotope/index.d.ts file and declared the module. On Ubuntu the project works well but on Windows 10 I still get the following error:
15:24 Could not find a declaration file for module 'vueisotope'. 'node_modules/vueisotope/dist/vue_isotope.min.js' implicitly has an 'any' type.
Try npm install #types/vueisotope if it exists or add a new declaration (.d.ts) file containing declare module 'vueisotope';
I also tried to reference the file as an ambient module but that also doesn't work:
/// <reference path = "../customTypes/vueisotope/index.d.ts" />
Am I doing something wrong here or is it a Windows/TypeScript/IDE issue? How can I bring that to work on a Windows machine?
My tsconfig:
{
"compilerOptions": {
"target": "esnext",
"module": "esnext",
"strict": true,
"jsx": "preserve",
"importHelpers": true,
"moduleResolution": "node",
"experimentalDecorators": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"sourceMap": true,
"baseUrl": ".",
"typeRoots": [
"./customTypes",
"./node_modules/#types"
],
"types": [
"webpack-env"
],
"paths": {
"#/*": [
"src/*"
]
},
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
]
},
"include": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"tests/**/*.ts",
"tests/**/*.tsx"
],
"exclude": [
"node_modules",
"customTypes"
]
}
my index.d.ts:
declare module "vueisotope" {
}
I simply didn't understand the typeRoots part correctly. I also had to define vueisotope inside the types part.
So the working tsconfig would be:
{
"compilerOptions": {
"target": "esnext",
"module": "esnext",
"strict": true,
"jsx": "preserve",
"importHelpers": true,
"moduleResolution": "node",
"experimentalDecorators": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"sourceMap": true,
"baseUrl": ".",
"typeRoots": [
"./customTypes",
"./node_modules/#types"
],
"types": [
"vueisotope",
"webpack-env"
],
"paths": {
"#/*": [
"src/*"
]
},
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
]
},
"include": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"tests/**/*.ts",
"tests/**/*.tsx"
],
"exclude": [
"node_modules",
"customTypes"
]
}
I have a large node js application. It manages HTTP REST requests. It was written in typescript. I am able to compile and run the application without any problem. In VSCode, I have a pre-launch task which basically compiles the code.
When I want to debug the application or try to add breakpoints in it with vscode, it gives me similar error messages like below:
Could not read source map for file:///Users/user/Developer/yoauto/engine/node_modules/#google-cloud/paginator/build/src/resource-stream.js: ENOENT: no such file or directory, open '/Users/user/Developer/yoauto/engine/node_modules/#google-cloud/paginator/build/src/resource-stream.js.map'
Please find my tsconfig.json and launch.json below:
{
"compilerOptions": {
"outDir": "dist/",
"allowSyntheticDefaultImports": true,
"esModuleInterop": true,
"strictBindCallApply": true,
"allowJs": false,
"checkJs": false,
"declaration": false,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"forceConsistentCasingInFileNames": true,
"importHelpers": true,
"noEmitHelpers": true,
"lib": ["dom", "es2016", "es2017.object"],
"target": "es6",
"module": "commonjs",
"noUnusedLocals": false,
"noUnusedParameters": false,
"noEmitOnError": true,
"noFallthroughCasesInSwitch": true,
"noImplicitAny": false,
"noImplicitReturns": false,
"noImplicitThis": false,
"strictNullChecks": false,
"pretty": true,
"removeComments": false,
"sourceMap": true,
"moduleResolution": "node",
"baseUrl": "src",
"paths": {
"#/*": ["./*"],
"#services/*": ["./core/services/*"],
"#domains/*": ["./core/domains/*"],
"#providers/*": ["./core/providers/*"],
"#controllers/*": ["./core/application/controllers/*"]
},
"resolveJsonModule": true
},
"include": ["./setup.ts", "./src/*", "./src/config/*.json", "setup.ts", "./_deploy/*.yaml"],
"exclude": [
"dist",
"node_modules",
"**/**/**.spec.ts",
"**/**/**.e2e.ts",
"**/**/**.spec.ts",
"**/__tests__/**"
]
}
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"skipFiles": [
"<node_internals>/**"
],
"program": "${workspaceFolder}/dist/setup.js",
// "preLaunchTask": "tsc: build - tsconfig.json",
"outFiles": [
"${workspaceFolder}/dist/**/*.js"
]
}
]
}
It was working yesterday. I do not know the problem. I found the closest issue on github but not sure it's relevant though.
Publish sources and source maps to npm
I think the problem is VSCode itself since I am able to debug the application with the latest webstorm without any problem (might be wrong)
Thanks for your help
Update :
I have downgraded my vscode installation to 1.46.1 from 1.47 and it worked so I am certain that something is not right with vscode 1.47
this seems to be a problem in vsCode like spotted here https://github.com/microsoft/vscode/issues/102042.
To solve it, add those lines to your launch.json config:
"type": "pwa-node",
"resolveSourceMapLocations": [
"${workspaceFolder}/**",
"!**/node_modules/**" // this lines prevent reading source maps from node_modules
],
Tell me if it helps :)
I've seen a lot of threads and discussions about that but I'm not getting to fix the issue. This is my post from some days ago.
One of the purposes of typings is to avoid the use of <reference> tags, right?
But if I don't use it, Visual Studio complains:
Visual Studio stops complaining once I reference browser.d.ts.
Here is my tsconfig:
{
"compilerOptions": {
"noImplicitAny": false,
"noEmitOnError": true,
"removeComments": false,
"sourceMap": true,
"target": "es5"
},
"files": [
],
"exclude": [
"node_modules",
"wwwroot"
]
}
I also tried removing the "files" property from the tsconfig as suggested here, but if I do this, I get compilation error in other typescript files inside the ambient folder of typings.
The code runs and all is fine, but I want to understand if I'm doing something wrong or if it's a Visual Studio problem.
For those who might have the same issue in the future:
I fixed the issue. The secret is to exclude the "files" property from tsconfig and in the "excluded" section add the folder "typings".
The tsconfig should now look like that:
{
"compilerOptions": {
"noImplicitAny": false,
"noEmitOnError": true,
"removeComments": false,
"sourceMap": true,
"target": "es5"
},
"exclude": [
"typings",
"node_modules",
"wwwroot"
]
}
In my case I fixed adding "jasmine" into "types" section in tsconfig.json. Like this:
{
"compilerOptions": {
"noImplicitAny": false,
"noEmitOnError": true,
"removeComments": false,
"sourceMap": true,
"target": "es5"
},
"exclude": [
"typings",
"node_modules",
"wwwroot"
],
"types": ["jasmine"]
}