BenoitZugmeyer / eslint-plugin-html

An ESLint plugin to extract and lint scripts from HTML files.
ISC License
430 stars 51 forks source link

Support for @typescript-eslint/parser ? #126

Closed ArnaudGathy closed 4 years ago

ArnaudGathy commented 4 years ago

Description

Hey, I am working on a project that uses js files, ts files and also js in script tags of html files. (yeah that's a lot of things at once) and I want to be able to lint all those things, so I installed this plugin.

I also had to setup ESLint with https://github.com/typescript-eslint to support the TypeScript file linting. It requires a specific parser for typescript-eslint to work : @typescript-eslint/parser.

When I use this parser, eslint-plugin-html stops working (I had no issue with the default parser esprima). I supose the TypeScript parser is not supported with this plugin.

Do you have any plan (or workaround) to support the TypeScript parser and still be able to use this plugin ?

This is the error generated when using the TS parser :

Error: Invalid location
    at locationToIndex (/Users/arnaudgathy/Documents/flowr/flowr-admin/node_modules/eslint-plugin-html/src/TransformableString.js:22:10)
    at TransformableString.originalLocation (/Users/arnaudgathy/Documents/flowr/flowr-admin/node_modules/eslint-plugin-html/src/TransformableString.js:122:19)
    at remapMessages (/Users/arnaudgathy/Documents/flowr/flowr-admin/node_modules/eslint-plugin-html/src/index.js:294:31)
    at verifyCodePart (/Users/arnaudgathy/Documents/flowr/flowr-admin/node_modules/eslint-plugin-html/src/index.js:212:12)
    at Linter.<computed> (/Users/arnaudgathy/Documents/flowr/flowr-admin/node_modules/eslint-plugin-html/src/index.js:219:9)
    at Linter._verifyWithConfigArray (/Users/arnaudgathy/Documents/flowr/flowr-admin/node_modules/eslint/lib/linter/linter.js:1255:21)
    at Linter.verify (/Users/arnaudgathy/Documents/flowr/flowr-admin/node_modules/eslint/lib/linter/linter.js:1210:25)
    at Linter.verifyAndFix (/Users/arnaudgathy/Documents/flowr/flowr-admin/node_modules/eslint/lib/linter/linter.js:1400:29)
    at verifyText (/Users/arnaudgathy/Documents/flowr/flowr-admin/node_modules/eslint/lib/cli-engine/cli-engine.js:230:48)
    at CLIEngine.executeOnText (/Users/arnaudgathy/Documents/flowr/flowr-admin/node_modules/eslint/lib/cli-engine/cli-engine.js:886:26)
BenoitZugmeyer commented 4 years ago

Interesting! I'll see what I can do to support this parser. I don't think it would require a lot of work.

BenoitZugmeyer commented 4 years ago

I just tried with a minimal project, and it seems to work correctly. Could you isolate a configuration and source file where you reproduce your error?

ArnaudGathy commented 4 years ago

Hey, thanks for taking a look into this issue. I managed to find the exact problem, it was not only linked to eslint-typescript, but also to some configuration I had to do to be able to lint with type information in typescript.

Their doc states that if you want to be able to lint in TS with type information, you should do this in the config : https://github.com/typescript-eslint/typescript-eslint/blob/master/docs/getting-started/linting/TYPED_LINTING.md

When I remove the parserOptions, eslint-plugin-html works again.

I made a repository with the minimal project, you can check the eslint config but I think the only relevant parts are the parser and parserOptions https://github.com/ArnaudGathy/eslint-test