BonBonSlick
@BonBonSlick
Junior Web Developer Trainee

Vue + typescript игнорирует строгую типизацию?

export default class ModalSelectAge extends Vue implements IUser{
    @namespace(USER).Action
    setAge!: (age: number) => void;

setAge({commit}, data: boolean): void {
        console.trace({data}); // string
        commit(MUTATION_SET_AGE, data);
    },


    [MUTATION_SET_AGE](state: any, data: number): void {
        state._age = data;
    },


    age(state: any): number {
        return state._age;
    },


Должно выкидывать ошибку еще на этапе компонента когда вызван метод setAge
<input type='range'
                                       min='3'
                                       max='21'
                                       :value='this.age'
                                       class='form-control-range'
                                       @change='setAge($event.target.value)'
                                >

чего не происходит, таким образом можно в Store поместить что угодно, что в свою очередь делает Typescript абсолютно бесполезным.

Из примера выше геттер age вернет обьект, бул, нулл, что угодно, типизация проигнорирована.
  • Вопрос задан
  • 102 просмотра
Решения вопроса 1
BonBonSlick
@BonBonSlick Автор вопроса
Junior Web Developer Trainee
Если вкратце.
Vue 2 не поддерживает TypeScript.
Далее подробнее.
60db8ed287b14113435269.png
На фото выше видно что вызвана мутация и передан массив.
Но в мутации модуля стоит TS тип boolean или любоей другой, вообще не имеет значения.
const response = await listService.loadList(requestDTO);
        const {data} = response;
        commit(ADD_ITEMS, {items: data});

import {MutationTree} from 'vuex';

export default {
    [ADD_ITEMS](state, items: boolean) : void{
        state._items = state._items.concat(data.items);
    },
 
} as MutationTree<any>;


Типизация TS в Vuex без использования плагинов ОТСУТСТВУЕТ напрочь.

Что делает TS бесполезным и даже вредным интрументом который привносит в проект + 30%-60% доп работы и оверхеда без основной функции для которой он исопльзуется.

Пробовал несколько пакетов Vuex + TS, на данный момент только Vue + TS, Vuex лишь малочастично использует TS в виде } as MutationTree<any>; и подобных подсказок, которые мало играют роли.

То есть декораторы для шаблонов, интерфесики там всякие и все же немного больше типизации чем без TS, но пока сложно сказать стоит ли оно того вообще. Если в шаблоне типизация работает, потмоу шаблон рендерит декоратор
@Template
@Component<AnimeList>(
    {
        components: {
...
        },
        mixins:     [],
    },
)

export default class AnimeList extends Vue implements IList {

То Vuex имеет куда меньшую поддержку и куда больше проблем.

Подобные пакеты решают проблему Vuex + TS частично костылявого, потому что там лишь 30-50% функционала TS.
А именно, нельзя использовать extend для других модулий, что значит, дублирование кода, десяток тысяч строк в моем пет проекте.
Собственно TS начал использовать по причине типизации т.к. работать на JS в проекте где 25+ К строк, попаболь.
Часами ловить undefined или NaN баг, потому что где то был сбой, он мог так же и с сервера прилететь, к примеру битые данные, и все, клиент работает баговано, а с TS казалось бы должно выбивать ошибку.
Но увы.

То есть TS работает примерно на 20-30% без плагина, плагин накидывает еще 15-20% фич TS но при это делает приложение нерасширяемым.
В общем, все типы данных для Vuex Action / Mutation / State без плагина, аля докблоков, они ничего не валидируют, без доп Vuex + TS пакета.

Повторюсь, TS типизация в Vuex без исопльзования дкораторов, фасадов и прочих костылей, почти напрочь ОТСУТСТВУЕТ. Что значит почти? Мы все же можем использовать интерфейсы, классы и прочее для внутреней валидации, к примеру
export default {
  
} as { [key: string]: any };

И подобное при импорте модуля, вот собсна и все, пока ничего более полезного не обнаружил)

Пет проект не полностью перенес на TS, а постепенно переползает. Переносить сейчас на Vue 3, лично у меня по моим оценкам займет еще часов 250+ т.к. переписать 2-3 сотни компонентов с учетом всех конфигов и подводных камней, думаю оценка оптемистична.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы