Как многие из вас, возможно, уже знали, есть довольно много преимуществ относительно Typescript по сравнению с Javascript, таких как масштабируемость кода, читаемость и способность избегать ошибок времени выполнения и т. Д. Одним из самых увлекательных (или обезболивающих) является его природа статических типов, которая обеспечивает предсказательную помощь во время кодирования для большинства распространенных IDE. Эта функция автоматического предложения существенно сэкономила время нашим инженерам.

Поскольку Vue.js официально поддерживает Typescript после v2.5, объявление компонентов в стиле класса было нашим фаворитом при кодировании с помощью typescript на Vue.js, но поскольку многие полезные модули сообщества для Vue.js на самом деле хорошо написаны на Javascript, они редко предоставляют какую-либо поддержку декораторов машинописного текста, что фактически сделало наше любимое преимущество машинописного текста - - прогнозирующая помощь не может обеспечить его функциональность в нужном месте ...

Таким образом, мы решили им помочь.

Есть несколько основных модулей, которые мы используем с момента написания кода на javascript: idle-vue, Vuelidate, Vue-socket.io. Итак, мы создали декораторы для этих хороших модулей, и родился vue-plugin-helper-decorator.

Когда не определен конкретный декоратор, мы можем использовать только общий @component для выполнения работы, например, мы определяем конфигурацию vue-socket.io:

@component({
  sockets: {
    myReconnect: function () {
      console.log(‘reconnect’)
    }
  },
})

Поскольку эта конфигурация подключаемого модуля помещена как метод универсального класса внутри @component, этот метод не сможет обеспечить поддержку в любой прогнозной помощи в IDE. Мы хотим улучшить его и надеемся написать более элегантным способом, предварительно определив декоратор в vue-plugin-helper-decorator, способ кодирования изменился на следующий:

@SocketIO({
  name: ‘reconnect’ // can declare your custom event name / names
})
public myReconnect() {
  console.log(‘reconnect’)
}

Итак, после установки плагина вы можете предположить, что произойдет какое-то волшебство, и поехали ...

Теперь вы сможете писать код быстрее, не запоминая эти методы, и вместо этого позвольте самой системе помочь вам. Этот плагин теперь имеет открытый исходный код на GitHub, который вы можете найти здесь, также мы создали еще один плагин декоратора, который также обрабатывает ситуацию для локального хранилища. Не стесняйтесь проверить их и написать нам, если у вас есть какие-либо вопросы или предложения. Ваше здоровье!

Ссылки по теме: