Lint other then *.ts file extensions

[ilearnio]

I have a vue.js project with basic vue-webpack-template setup that I'm moving to TypeScript and TSLint. And I need to lint my project using CLI. So I came up with this command:

tslint -c .tslintrc.js --type-check --project tsconfig.json src

It works well for *.ts files, but when one of them imports *.vue files (which is allowed in webpack) it throws this error Error at src/main.ts:4:17: Cannot find module './App.vue'.

Is there any way to make it lint the *.vue files? I know that in eslint there is a CLI option --ext that allows to do stuff like eslint --ext .js,.vue src. But I couldn't find anything like that in tslint.

There is a way to lint my project with Webpack on every file save but I know that this is a very slow process especially when the project get's bigger.

[ajafff]

Currently there is no easy way to make it work. Simply adding an option like --ext wouldn't work. TypeScript also decides how to parse files depending on the extendsion.
*.vue files also contain markup and styles, right? That would confuse TypeScript's parser and you would get bogus errors.

IIRC there's a vue loader for webpack which can be combined with the tslint-loader. Using them with webpack --watch is probably the best (and maybe the only) way to go. But guess you already knew that.

---

Recently I was thinking about a loader concept in tslint. It would extract the typescript source code from your file and map the errors produced by tslint to your actual file positions.

[ilearnio]

Thanks for quick response! Ok, I see. Do you think this would be implemented in observable feature? For now I would probably go with webpack+tslint approach until the project is small

[ajafff]

There's already an open issue requesting support for .vue files: #2099
There are currently no concrete plans for supporting loader plugins. Someone would need to come up with a proposal first.

Closing this as a duplicate.

[martijnthe]

@ajafff having a related issue:

$ tslint -p tsconfig.json ./*.ts ./__tests__/*.test.ts

Invalid source file: __tests__/TsExternals.test.ts. Ensure that the files supplied to lint have a .ts, .tsx, .d.ts, .js or .jsx extension.

I cannot get tslint to lint `*.test.ts files?

[ajafff]

That's actually a different problem. I assume __tests__ is excluded (or not included) in your tsconfig.json?
You cannot use -p option to lint files that are not in the project.

[martijnthe]

@ajafff that's correct. Odd that the message suggests that something is wrong with the extension.

In any case, I'd rather keep them excluded because I don't want the tests to end up in my dist. I guess I could create another tsconfig4tslint.json or something... hrmm

[ajafff]

@martijnthe the problem with the error message is known: #2208. I have already submitted a PR to fix it.

If you want type checking in your tests, you have no better option than what you mentioned above.

[martijnthe]

@ajaff thanks!