Typescript: Successful build but had lots of 'fake' IntelliSense errors In Typescript (after Visual Studio 2019 + TS upgrade)

[hvilppu]

TypeScript Version: 3.9 (Was earlier 3.4.2)

I upgraded my Visual Studio to the new version Version 16.7.3. and TS to 3.9 from (3.4.2)

After the upgrade, I get a lot of IntelliSense errors. Those are not 'real' and do not have even underlined with red:

But not red underline:

Expected behavior:
Intellisense worked on the VS 2017 and VS 2019 earlier version

Actual behavior:
Intellisense broke up. But the project builds.

What I have done:

• Deleted .vs foder
• Deleted bin/obj folders
• Installed TS SDK 3.9
• Set project to use 3.9 on settings
• Restored NuGet packets

[hvilppu]

Additional info:

tsconfig.json:

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "experimentalDecorators": true,
    "module": "es2015",
    "moduleResolution": "node",
    "target": "es5",
    "sourceMap": true,
    "skipDefaultLibCheck": true,
    "strict": true,
    "strictFunctionTypes": false,
    "types": [ ],
    "lib": [ "es2017", "dom", "scripthost" ],
    "typeRoots": [ "../node_modules/@types" ]
  },
  "exclude": [
    "bin"
  ]
}

I also tried the Unload -> Load project with no luck

[hvilppu]

Even more info. Alt build project for files seems to be "Miscellaneous" (I don't have a project named like that)

[uniqueiniquity]

Hi @hvilppu, I'm sorry for the issues the upgrade is giving you.

In the properties window, what is the "Build Action" for your tsconfig.json?
I would recommend that you set it to "TypeScript file" or "TypeScriptCompile" (they're the same - the particular display name depends on what kind of VS project you're using).

If setting that doesn't resolve the issue, could you please follow the instructions shown here to generate a log of the IntelliSense behavior (also known as a language service log)?

I look forward to investigating further!

[hvilppu]

No luck with this one:

In the properties window, what is the "Build Action" for your tsconfig.json?
I would recommend that you set it to "TypeScript file" or "TypeScriptCompile" (they're the same - the particular display name depends on what kind of VS project you're using).

I try to generate logs later and post here results.

[hvilppu]

ti-3068.log

Here is the first one of logs needs more?

All errors comes to "Miscellaneous"-project (The real .ts files are at "FishPortal.Web"-project)

[uniqueiniquity]

Yes - it's the other ones that I need (specifically the one containing the phrase ProjectHost in the filename). Thank you!

For transparency, I'm trying figure out why files are ending up in the Miscellaneous project instead of the FishPortal.Web project. That log should be able to show me how the TypeScript language service is interpreting your project structure.

[hvilppu]

I cannot see log starting with "ProjectHost" here is all I got with these instructions

I saved logs with PerfView to perfview.log

(2 different runs)

perflog.txt
tsserver.21896.log
tsserver.20604.log
ti-21896.log
tsserver.20492.log
tsserver.9904.log
ti-20492.log

[uniqueiniquity]

These logs are perfect. I'll take a look and get back to you as soon as I can.

[uniqueiniquity]

The issue appears to be related to having the alerts.vue.html file open - we're not handling that file very well.
Would you be willing to share the contents of that file? I've never seen the .vue.html file extension used before, so I'm curious to understand how you are using it.

[hvilppu]

Hellos:

I simplified files here: ( I need to change them .txt so I can upload them here)

Real files are:
alerts.css
alerts.ts
alerts.vue.html

alerts.css.txt
alerts.ts.txt
alerts.vue.html.txt

So .vue.html is just an HTML file that has .vue on its name.

There are 3 files 1) .css and 2)alert.ts that are "code behind" for 3) alert.vue.html.. nothing special on them.

BUT I get also errors for:

And routes.ts is just ts file that does not have "Html-parent-file"
It is that simple:

import { RouteConfig } from 'vue-router';
import { Component } from 'vue-property-decorator';

let routes: RouteConfig[] = [    
    { path: '/', component: require('./components/login/login.vue.html').default, meta: { authenticated: false } }, // NO AUTH
];

export default routes;

[uniqueiniquity]

Thank you for the simplified files!

The issue is that VS considers .html files to include JS content from the perspective of figuring out your projects.
Your main project is configured by your tsconfig.json and does not include any JS content.

To fix this, you can add allowJs: true to the compilerOptions section of your tsconfig.
With this change, you may want to add an include section to be more precise about the files included in your project, in case you have any JS files or other HTML files nearby that you don't want included:

{
  "include": [
    "./**/*.ts",
    "./**/*.vue.html"
  ]
}

[hvilppu]

Yeh. This worked! Can be closed now. Thanks!