VANT - это библиотека мобильной VUE компонент, поддерживаемой командой Front-End Youzan, обеспечивая полный набор базовых компонентов UI Basic и компоненты бизнеса. Через Vant вы можете быстро построить страницу с единым стилем и повысить эффективность развития.
1. Около 1,0
Расстояние до ВантПервый выпускПрошло всего полгода, и в течение этого полугода команда Vant широко впитывала отзывы и предложения сообщества и продолжала полировать и оптимизировать компоненты, благодаря чему Vant постепенно превратился в легкую и надежную библиотеку мобильных компонентов Vue.
На данный момент мы решили выпустить официальную версию 1.0 Vant и надеемся, что больше друзей смогут участвовать в разработке и использовании Vant в будущем.
Адрес гитхаба:github.com/youzan/vant
2. Существующие компоненты
3. Концепция развития
Легкий
В качестве библиотеки мобильных компонентов,Vant
Легкий вес всегда был основной концепцией разработки. Чтобы сбалансировать противоречие между все более богатыми функциями и легким весом, мы испробовали множество методов оптимизации, включая поддержку загрузки компонентов по требованию, повторное использование общих модулей и оптимизацию процесса компиляции компонентов.
После применения ряда методов оптимизации текущийVant
Средний размер компонентов составляет всего 8,8 КБ, а после Uglify + Gzip — около 1 КБ. В качестве сравнения,mint-ui
Средний размер компонентов составляет 15,2 КБ, а средний размер компонентов некоторых библиотек компонентов даже превышает 25 КБ.
Vant
Причина, по которой мы можем поддерживать такой небольшой размер компонента, в основном связана с нашим уникальным методом компиляции компонентов. Текущий основной метод компиляции компонентов заключается в компиляции каждого компонента через webpack и vue-loader и создании упакованного JS-файла для каждого компонента. Этот подход будет генерировать много избыточного кода, такого как встроенный модульный код webpack, встроенная функция нормализации vue-loader, неоднократно вводимый помощник babel и т. д., и мы не хотим вводить эти избыточные коды в результате компиляции компонента.
Сначала мы пытались решить вышеописанные проблемы с помощью rollup и rollup-plugin-vue, но вскоре нашли более прямой путь, то есть компилировать компоненты через официальный vue-template-compiler и babel, так что этот метод простой и чистый, и скомпилированный код очень чистый.Подробности здесь не повторяются.Заинтересованные студенты могут посмотреть на Vant.Исходный код сборочной части.
Итерация быстро
Другой очень важной концепцией является быстрая итерация. Десятки инженеров из фронтенд-команды Youzan используют версию на GitHub, которую вы видите сейчас, и у нас нет так называемой «внутренней версии». В то же время, дорожа собственной репутацией, мы не просто открываем исходный код, но поддерживаем его как технический продукт не только для собственного использования, но и для использования другими, поэтому мы сохраним его. Быстрый ответ на потребности сообщества, своевременные последующие действия и исправления ошибок.
На данный момент общее количество проектных коммитов превысило 1600, решено 300 проблем, объединено 400 пулл-реквестов и выпущено 90 релизов, в основном поддерживая ритм релизов 1-2 раза в неделю. Это включает в себя вклад многих разработчиков сообщества, спасибо им за их поддержкуVant
Вклад ~ В будущем мы продолжим поддерживать этот ритм разработки и выпускать более качественные продукты с открытым исходным кодом для сообщества.
Экологический
В дополнение к поставке компонентов, мы также предоставляемVant
Мы предприняли множество попыток разработать экосистему, надеясь покрыть потребности разработки различных сценариев и обеспечить удобство для всех. Вот некоторые из наших существующих экосистем или возможностей:
- Скаффолдинг на основе vue-cli
vue-cli-template-vant
- служба поддержки
nuxt
Рендеринг на стороне сервера - служба поддержки
Typescript
Определение типа - служба поддержки
i18n
Многоязычная настройка - поддержка через
postcss
Плагины для настройки темы - Официальный демонстрационный склад -vant-demo
- Библиотека компонентов апплета, основанная на той же визуальной спецификации -zanui-weapp
- Пример проекта мобильного магазина сообщества с открытым исходным кодом -vant--mobile-mall
Что касается экологизации, у нас еще есть много аспектов, которые необходимо доработать, например, обеспечение поддержки rem, подключаемых модулей подсказок кода vscode и т. д. Это будет направление, которое мы попробуем в 2018 году.
Четвертый, последний
Прогресс проектов с открытым исходным кодом неотделим от вклада сообщества.Vant
Всем, кто делал пиары и комментарии, особая благодарность сообществу@chuangbo,@qianzhaoyan,@GeoffZhuРавный вклад одноклассников. Надеюсь, в будущем к нам присоединится больше студентовVant
находится в разработке. Если вы заинтересованы в похвале передовой команды, вы можете присоединиться к нам и играть вместе ~
Электронная почта для доставки резюме: chenjiahan@youzan.com ^_^
Эта статья была впервые опубликована вБлог о технологиях Youzan.