Как удалить расширение .vue из импорта при использовании TypeScript в Vue.JS?

Question

Я создал проект с vue-cli3 и включил TypeScript

My src / app.vue :

<template>
  <div id="app">
    <hello-world msg="test"/>
  </div>
</template>

<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
import HelloWorld from '@/components/HelloWorld';

@Component({
  components: { HelloWorld },
})
export default class App extends Vue {}
</script>

компилятор, выдавший ошибку в "Cannot"найти модуль '@ / components / HelloWorld' ";

Компонент HelloWorld существует.

Однако, если я удаляю lang="ts" или добавляю расширение .vue, тогда все компилируется нормально.В моем tsconfig.json у меня есть

  "paths": {
    "@/*": [ "src/*" ]
  },

Это проблема с tsconfig.json или что-то еще?

Answer 1

Эта строка import HelloWorld from '@/components/HelloWorld'; должна быть import HelloWorld from '@/components/HelloWorld.vue.

Поскольку компилятор считает @/components/HelloWorld файлом .ts или .js, но он не существует.