Как мне настроить Vue, чтобы иметь возможность импортировать машинописные файлы из Single File Components?

Question

Я разрабатываю проект с Vue. js 2 (через vue -cli 3), который имеет несколько Vue Single File Components. В проекте уже закодированы десятки модулей.

Я пытался улучшить читабельность кода и попытался добавить Typescript в проект, установив плагин vue typcript (vue add typcript) и мой Удивительно, он отредактировал половину файлов, выдал кучу ошибок и сломал некоторые модули и зависимости. После этого мне пришлось вернуться к точке до этого, так как проект стал непригодным для использования.

Затем я попытался импортировать файл ts, добавив загрузчик / парсер машинописного текста в стек webpack / eslint / babel, но не безрезультатно.

Итак, вопрос в том, как я могу импортировать файл .ts из компонента, не нарушая все это? Это вообще возможно? Конечно, главное - избегать компиляции ts в js каждый раз, когда я делаю изменения.

Редактировать: просто чтобы прояснить ситуацию, мне нужно импортировать файл .ts в мой обычный Vue Компонент. Я еще ничего не нашел в документах.

Пример:

<script>
// The following import would look for a @/path/to/MyTSClass.js and fail

// If I added the .ts extension it would throw an 'Unexpected token' error and tell me 
// to install an 'additional loader to handle the result of these loaders'

import MyTSClass from "@/path/to/MyTSClass"; 

export default {
    name:"MyComponent",
    methods: {
        myMethod() {
            let myVar = new MyTSClass();
            return myVar.doSomething();
        }
    }
}
</script>