An import path cannot end with a '.ts' extension.

[Shinigami92]

src/App.vue:2:23 - error TS2691: An import path cannot end with a '.ts' extension. Consider importing './App.js' instead.

---

I have following folder/file structure:

src/
  App.pug
  App.scss
  App.ts
  App.vue

// App.vue
<template lang="pug" src="./App.pug"></template>
<script lang="ts" src="./App.ts"></script>
<style lang="scss" src="./App.scss"></style>

---

When referencing a .ts file with lang set to ts, vue-tsc should check it's content with tsc

[johnsoncodehk]

This is expected, you should change src="./App.ts" to src="./App".

[Shinigami92]

Didn't know that this is possible 😃

Works now 👍, but the error message is misleading Is it possible to change it?

So if lang="ts" then error message equals:

src/App.vue:2:23 - error TS2691: An import path cannot end with a '.ts' extension. Consider importing './App' instead.

[johnsoncodehk]

Thanks for suggestion, but lang="ts" is no relationship with src, something like <script lang="ts" src="./App.js"> is also working.

btw I recommend you use Volar for code checking, vue-tsc is use for pipeline.

[Shinigami92]

This is for pipeline 🙂 I just added it to my build script

I cannot use Volar right now, cause it's a Vue 2 application 🙂

[johnsoncodehk]

Actually vue-tsc is use for vue 3 too, it has totally same type-checking result with volar.

Anyway if you want to use volar on vue 2 project, you could install @vue/runtime-dom, see: https://github.com/johnsoncodehk/volar#using