Идеальное Vue приложение на Typescript

Не будет нормальной типизации с Vuex, и все библиотеки для его типизации костыли. Выкинь его. Как? Берешь что-то вроде { ModuleName: Vue.observable(new MyStorageModuleName()) } и запихиваешь как плагин и/или даже в window.$myStorage.
Выходит действительно хорошо, использую такой подход на продакшене второй год. Vuex собираюсь откапывать для новых проектов только в 5-ой версии, где они обещали все с нуля переписать с нормальной поддержкой ts.
Алсо класс-синтаксис компонентов самому очень нравится, но, наверное, от этого надо уходить, для vue 3 его почти похоронили

mix.js('resources/js/app.ts', 'public/js')
    .sass('resources/sass/app.scss', 'public/css')
    .webpackConfig({
        module: {
            rules: [
                {
                    test: /\.tsx?$/,
                    loader: "ts-loader",
                    options: {
                        appendTsSuffixTo: [/\.vue$/]
                    },
                    exclude: '/node_modules/',
                }
            ]
        },
        resolve: {
            extensions: ["*", ".js", ".jsx", ".vue", ".ts", ".tsx"]
        }
    })
    .version();

if (mix.inProduction()) {
    mix.version();
}

declare module "*.vue" {
    import Vue from 'vue'
    export default Vue
}

<script lang="ts">
    import Vue from 'vue';
    import {AmoApiSettings} from "../../types/types";

    interface Data {
        settings?: AmoApiSettings,
        integration_id?: string
        is_loaded: boolean,
    }

    export default Vue.extend({
        name: "Amo",
        data: function (): Data {
            return {
                settings: undefined,
                integration_id: undefined,
                is_loaded: false,
            }
        },
    });
</script>

Динамические импорты компонентов — это по умолчанию, всегда так делайте (это Components: () => import(path)), webpack умный и такие импорты в 90% случаях уменьшат вам время полной загрузки страницы, а в оставшихся 10% — ничего не поменяют, так что оно того стоит. Это просто, одинаково и удобно.

Всегда в компонентах прописывайте имя (даже с учетом того, что оно опционально).

Старайтесь названия файлов компонентов согласовывать с названием классов (и именами внутри).

Вызовы к api — ТОЛЬКО из store, об этом вам скажет любой Vue разработчик.

Vue 3 вышел пол года назад! Скоро уже думаю 3.1 будет. Так что первое же предложение в статье — неправда.
Ну и со всем этим обвесом будет весело мигрировать на тройку, класс компоненты больше официально не поддерживаются им на смену пришла композиция.

Я тоже пытался подружить vue 2 с ts. Пришел к аналогичному решению, только ещё смарт модуль форкнул, т.к. там есть проблема с типизацией и автоподстановкой. + ещё какие то библиотеки ставил для чека типов в шаблонах, enums в шаблонах и т.д…
Мой вывод такой:
1) это не идеальная типизация, очень много не поддерживается, много не чекается, положиться на 100% нельзя. По сравнению с реакт миром грусть.
2) зоопарк библиотек/утилит дико раздражает, написаны они не очень, работают нестабильно.
3) декораторы, компонент — классы использовать очень не хочется
4) у меня все это добро вызывает тревогу, а у приходящих в компанию фронтов — панику.
5) итоговый вывод — не стоит оно того, js + jsdoc для vue 2 — оптимальный вариант.

Пока Vue 3 официально еще не вышел