Wednesday, 15 November 2023

Is there a way to configure eslint in VSCode to support typesRoot types for JavaScript in HTML files?

I'm using a jsconfig.json like this

{
  "compilerOptions": {
    "target": "ESNext",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "typeRoots": [ "./node_modules/@webgpu/types", "./node_modules/@types"]
  },
  "include": [
    "build",
    ".",
    ".eslintrc.js",
  ]
}

and an eslintrc.js file like this

module.exports = {
  env: {
    browser: true,
  },
  parser: '@typescript-eslint/parser',
  parserOptions: {
    sourceType: 'module',
    ecmaVersion: 11,
    tsconfigRootDir: __dirname,
    project: ['./jsconfig.json'],
    extraFileExtensions: ['.html'],
  },
  plugins: [
    '@typescript-eslint',
    'eslint-plugin-html',
    'eslint-plugin-optional-comma-spacing',
    'eslint-plugin-one-variable-per-var',
    'eslint-plugin-require-trailing-comma',
  ],
  extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'],
  rules: {
    ...
  },
};   

The important part is this line

    "typeRoots": [ "./node_modules/@webgpu/types", "./node_modules/@types"]

It adds the webgpu types and I can see that's working in VSCode for a javascript file

enter image description here

But it's not working for JavaScript inside HTML files

enter image description here

Is it possible to get it to include knowledge of the types for JavaScript inside HTML files?



from Is there a way to configure eslint in VSCode to support typesRoot types for JavaScript in HTML files?

No comments:

Post a Comment