{"id":15017571,"url":"https://github.com/vkcom/create-vk-mini-app","last_synced_at":"2025-04-05T04:08:50.470Z","repository":{"id":41987941,"uuid":"143418563","full_name":"VKCOM/create-vk-mini-app","owner":"VKCOM","description":"Create VK Apps with no build configuration.","archived":false,"fork":false,"pushed_at":"2024-10-14T06:56:53.000Z","size":3261,"stargazers_count":54,"open_issues_count":24,"forks_count":23,"subscribers_count":14,"default_branch":"master","last_synced_at":"2024-10-29T15:45:03.464Z","etag":null,"topics":["react","vk","vkapps"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/VKCOM.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"docs/CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":".github/CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-08-03T11:21:53.000Z","updated_at":"2024-10-14T06:54:00.000Z","dependencies_parsed_at":"2024-03-18T15:09:23.116Z","dependency_job_id":"5bfa8cd9-7c5b-481b-a9ef-d84ae810c823","html_url":"https://github.com/VKCOM/create-vk-mini-app","commit_stats":{"total_commits":192,"total_committers":30,"mean_commits":6.4,"dds":0.7291666666666667,"last_synced_commit":"ce943e465068c5cc442f5aebfe9454d10cfb6095"},"previous_names":["vkcom/create-vk-app"],"tags_count":42,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VKCOM%2Fcreate-vk-mini-app","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VKCOM%2Fcreate-vk-mini-app/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VKCOM%2Fcreate-vk-mini-app/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VKCOM%2Fcreate-vk-mini-app/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/VKCOM","download_url":"https://codeload.github.com/VKCOM/create-vk-mini-app/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246131310,"owners_count":20728302,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["react","vk","vkapps"],"created_at":"2024-09-24T19:50:41.932Z","updated_at":"2025-03-29T03:10:14.064Z","avatar_url":"https://github.com/VKCOM.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# create-vk-mini-app\n\nПакет **create-vk-mini-app** предназначен для создания и развёртывания [мини-приложений ВКонтакте](https://dev.vk.com/mini-apps/overview). С его помощью вы можете быстро создать проект мини-приложения с подключёнными библиотеками и инструментами, которые необходимы для работы на платформе ВКонтакте.\n\n## Ключевые особенности\n\n- Cборка с помощью [Vite](https://vitejs.dev/guide/).\n\n- Автоматическое подключение и поддержка последних версий библиотек, необходимых для создания мини-приложений.\n\n- Конфигурация проекта под различные задачи.\n\n- Поддержка TypeScript и JavaScript.\n\n- Интерактивный режим создания проекта.\n\n- Бесплатный хостинг мини-приложения при помощи [vk-miniapps-deploy](https://dev.vk.com/ru/mini-apps/development/hosting).\n\n## Запуск\n\n### yarn\n\n```\nyarn create @vkontakte/vk-mini-app [app-dir-name] [params]\n```\n\n### npm\n\n```\nnpm init @vkontakte/vk-mini-app@latest [app-dir-name] -- [params]\n```\n\n\u003e Обратите внимание на двойное тире перед списком параметров. Оно необходимо, это требование npm.\n\n### npx\n\n```\nnpx @vkontakte/create-vk-mini-app [app-dir-name] [params]\n```\n\n### Для Node.js \u003c 18.0.0\n\nЕсли вы используете более раннюю версию Node.js, чем 18.0.0, то вам нужен пакет create-vk-mini-app версии 1. Чтобы указать номер версии, введите `@1` после названия пакета.\n\n```\nnpx @vkontakte/create-vk-mini-app@1 [app-dir-name] [options]\n```\n\n### Дальнейшие шаги\n\nКоманды, упомянутые выше, запускают скрипт создания приложения. Скрипт последовательно попросит вас указать следующие параметры:\n\n- Имя папки для приложения. Если имя папки соответствует требованиям именования npm-пакетов, то это же имя будет указано как название проекта в `package.json`. Если имя папки не может быть использовано для именования пакета, скрипт попросит вас указать другое имя.\n\n- Язык программирования: TypeScript или JavaScript.\n\n- Структурные шаблоны — набор библиотек, которые будут включены в проект:\n\n - VKUI+Bridge+Router — рекомендуемый вариант для создания мини-приложений ВКонтакте.\n\n - VKUI+Bridge\n\n - VKUI-only — этот вариант не подходит для создания мини-приложений. Используйте его для быстрого создания веб-приложений, использующих библиотеку VKUI.\n\n [Подробнее о шаблонах](#project-templates)\n\n## Параметры командной строки\n\nПри запуске вы можете ввести следующие параметры командной строки, чтобы указать характеристики создаваемого приложения.\n\nВсе параметры необязательные.\n\n\u003ctable\u003e\n\u003cthead\u003e\n\u003cth\u003eПараметр\u003c/th\u003e\n\u003cth\u003eОписание\u003c/th\u003e\n\u003c/thead\u003e\n\u003ctbody\u003e\n\u003ctr\u003e\n\u003ctd\u003e\u003cb\u003eapp-dir-name\u003c/b\u003e\u003c/td\u003e\n\u003ctd\u003eИмя папки для создаваемого приложения.\u003c/td\u003e\n\u003c/tr\u003e\n\u003ctr\u003e\n\u003ctd width=\"210px\"\u003e\u003cb\u003e--projectName={name}\u003c/b\u003e\u003c/td\u003e\n\u003ctd\u003eИмя проекта создаваемого приложения, которое будет указано в \u003ccode\u003epackage.json\u003c/code\u003e.\u003cbr/\u003eИспользуется в случае, когда имя папки не соответствует правилам именования npm-пакетов.\u003c/td\u003e\n\u003c/tr\u003e\n\u003ctr\u003e\n\u003ctd\u003e\u003cb\u003e--typescript\u003c/b\u003e\u003c/td\u003e\n\u003ctd\u003eСоздаёт проект на TypeScript. Если этот параметр не указан, то скрипт попросит указать язык при создании приложения.\u003c/td\u003e\n\u003c/tr\u003e\n\u003ctr\u003e\n\u003ctd\u003e\u003cb\u003e--template={name}\u003c/b\u003e\u003cbr/\u003eили\u003cbr/\u003e\u003cb\u003e--t={name}\u003c/b\u003e\u003c/td\u003e\n\u003ctd\u003eСтруктурный шаблон — набор библиотек, которые будут включены в приложение при создании. Возможные значения \u003ccode\u003e{name}\u003c/code\u003e: \u003cul\u003e\u003cli\u003evkui-bridge-router\u003c/li\u003e\u003cli\u003evkui-bridge\u003c/li\u003e\u003cli\u003evkui-only\u003c/li\u003e\u003c/ul\u003e \u003c/td\u003e\n\u003c/tr\u003e\n\u003c/tbody\u003e\n\u003c/table\u003e\n\n## Примеры командной строки\n\n#### Пример 1\n\n```\nyarn create @vkontakte/vk-mini-app mini-app --typescript --template=vkui-bridge-router\n```\n\nСоздаст проект из структурного шаблона `VKUI+Bridge+Router` на TypeScript в подпапке `mini-app` текущей папки.\n\n#### Пример 2\n\n```\nnpm init @vkontakte/vk-mini-app . -- --template=vkui-bridge\n```\n\nСоздаст проект из структурного шаблона `VKUI+Bridge`. Скрипт запросит имя папки и язык программирования.\n\n## \u003ca id='project-templates'/\u003e Структурные шаблоны\n\n| Параметр | Описание |\n| ----------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n| \u003cnobr\u003e**vkui-bridge-router**\u003c/nobr\u003e | Проект со следующими включёнными библиотеками: \u003cul\u003e\u003cli\u003e[VKUI](https://github.com/VKCOM/VKUI) — Библиотека React-компонентов для создания UI.\u003c/li\u003e\u003cli\u003e[VK Bridge](https://github.com/VKCOM/vk-bridge/) — Библиотека для взаимодействия с платформой ВКонтакте.\u003c/li\u003e\u003cli\u003e[vk-mini-apps-router](https://github.com/VKCOM/vk-mini-apps-router) — Библиотека маршрутизации.\u003c/li\u003e\u003c/ul\u003e**Совет.** Мы рекомендуем именно этот вариант для создания мини-приложений.\u003cbr/\u003e\u003cbr/\u003eВ проект также подключены другие инструменты и пакеты, которые упрощают создание мини-приложений:\u003cul\u003e\u003cli\u003evk-miniapps-deploy — размещение файлов мини-приложения на [хостинге ВКонтакте](https://dev.vk.com/ru/mini-apps/development/hosting).\u003c/li\u003e\u003cli\u003eVK Tunnel — доступ к веб-серверу, запущенному на рабочем компьютере, из глобальной сети. Необходимо для отладки.\u003c/li\u003e\u003cli\u003eEruda — консоль разработчика. Используется для отладки.\u003c/li\u003e\u003cli\u003e@vkontakte/icons — набор иконок.\u003c/li\u003e\u003cli\u003eVite — сборка приложения.\u003c/li\u003e\u003cli\u003eESLint — проверка синтаксиса и правил кодирования.\u003c/li\u003e\u003cli\u003eReact и React-DOM — стандартные React-библиотеки.\u003c/li\u003e\u003c/ul\u003e |\n| **vkui-bridge** | Те же библиотеки и инструменты, что и при использовании **vkui-bridge-router**, за исключением библиотеки маршрутизации `vk-mini-apps-router`. |\n| **vkapp-only** | Проект со следующими библиотеками и инструментами:\u003cul\u003e\u003cli\u003eVKUI\u003c/li\u003e\u003cli\u003e@vkontakte/icons\u003c/li\u003e\u003cli\u003eReact и React-DOM\u003c/li\u003e\u003cli\u003eVite\u003c/li\u003e\u003cli\u003eESLint\u003c/li\u003e\u003c/ul\u003eЭтот вариант не подойдёт для создания мини-приложений, так как в нём отсутствует VK Bridge — библиотека, которая необходима для взаимодействия с платформой. Используйте этот вариант для создания веб-приложений, использующих библиотеку VKUI. |\n\n## Полезные ссылки\n\n- [Документация VKUI](https://vkcom.github.io/VKUI/)\n\n- [Документация vk-mini-apps-router](https://dev.vk.com/libraries/router)\n\n- [Примеры мини-приложений](https://dev.vk.com/mini-apps/examples)\n\n- [Сообщество VK Mini Apps](https://vk.com/vkappsdev) — сообщество разработчиков мини-приложений ВКонтакте\n\n## Сотрудничество\n\nМы рады новым идеям и предложениям по улучшению библиотеки. Если вы хотите расширить примеры или улучшить интерфейс командной строки:\n\n1. Сделайте ответвление (fork) репозитория.\n\n2. Склонируйте репозиторий и установите зависимости, выполнив команду `yarn`.\n\n3. Внесите изменения в код.\n\n4. Выполните сборку с помощью команды `yarn run build`.\n\n5. Установите изменённый пакет: `yarn link`. \n Запустите его, чтобы протестировать изменения: `create-vk-mini-app`.\n\n6. Отправьте MR нам на проверку.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvkcom%2Fcreate-vk-mini-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvkcom%2Fcreate-vk-mini-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvkcom%2Fcreate-vk-mini-app/lists"}