A
A
Alexey Nikolaev2019-11-01 13:45:10
typescript
Alexey Nikolaev, 2019-11-01 13:45:10

Why doesn't the Typescript compiler process .vue files?

Good day.
There is an existing project on Vue, Typescript is not used everywhere there (where necessary, we write // @ts-check at the beginning of the file). Now we are starting to type the .vue components themselves (previously, only logic and external dependencies were typed). Types are checked with the `tsc` command in the terminal.
I'm trying to enable the check, I write in the "script" block of the "@ts-check" component. Visual Studio Code + Vetur immediately underlines errors and typing flaws in the component in red. However, tsc in the console still does not swear at anything!
I thought that, probably, he simply for some reason does not load .vue files. Looked at the output of `--traceResulution`, I see this:

======== Resolving module './CodeRequester.vue' from 'C:/repositories/projectsrc/components/common/CodeRequester/index.js'. ========
Explicitly specified module resolution kind: 'NodeJs'.
Loading module as file / folder, candidate module location 'C:/repositories/projectsrc/components/common/CodeRequester/CodeRequester.vue', target file type 'TypeScript'.
File 'C:/repositories/projectsrc/components/common/CodeRequester/CodeRequester.vue.ts' does not exist.
File 'C:/repositories/projectsrc/components/common/CodeRequester/CodeRequester.vue.tsx' does not exist.
File 'C:/repositories/projectsrc/components/common/CodeRequester/CodeRequester.vue.d.ts' does not exist.
Directory 'C:/repositories/projectsrc/components/common/CodeRequester/CodeRequester.vue' does not exist, skipping all lookups in it.
Loading module as file / folder, candidate module location 'C:/repositories/projectsrc/components/common/CodeRequester/CodeRequester.vue', target file type 'JavaScript'.
File 'C:/repositories/projectsrc/components/common/CodeRequester/CodeRequester.vue.js' does not exist.
File 'C:/repositories/projectsrc/components/common/CodeRequester/CodeRequester.vue.jsx' does not exist.
Directory 'C:/repositories/projectsrc/components/common/CodeRequester/CodeRequester.vue' does not exist, skipping all lookups in it.
======== Module name './CodeRequester.vue' was not resolved. ========

I understand that ts does not know anything about .vue components, and tries to process these files in ways that it understands. But how to teach him to see? I saw a lot of instructions on the Internet, mostly about the webpack + vue-loader + ts-loader bundle (inside).
My question is about tsc itself outside of webpacks and vue-loaders.
Is it possible? If yes, how?
Thanks in advance.

Answer the question

In order to leave comments, you need to log in

1 answer(s)
S
Stanislav Silin, 2019-11-01
@byme


Is it possible? If yes, how?
No.
tsc is the TypeScript compiler. Why does the TypeScript compiler need to compile *.vue?
If you need to enable compilation use vue-loader.
Visual Studio Code + Vetur underline errors in red immediately
Since Vetur is the same vue-loader only inside Visual Studio Code and I wouldn't be surprised if it uses vue-loader inside.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question