Чтобы упростить переход на новую мажорную версию, можно воспользоваться инструментом по автоматической миграции ваших компонентов.
Для начала обновите ваше приложение до новой мажорной версии (v6) в соответствии с требованиями вашего пакетного менеджера и среды
Обратите внимание, минимальная поддерживаемая версия React увеличена до
v18.2.0
Пока для перевода доступны только
Typescript
-файлы (.ts/.tsx)
Перейдите в директорию с исходниками вашего проекта (обычно это src/
) и запустите следующую команду:
npx @vkontakte/vkui-codemods
Инструмент представляет собой консольное приложение, с помощью которого вы можете выбрать необходимые изменения и применить их, доступны следующие команды:
$ npx @vkontakte/vkui-codemods --help
Usage: @vkontakte/vkui-codemod [codemod-name]
Arguments:
codemod-name which codemod should be applied
Options:
-V, --version output the version number
-l --list list available codemods
--all apply all available codemods
-p --path <paths> path to files in which to apply the codemods (default: current directory)
--dry-run no changes are made to files
--ignore-config <config> ignore files if they match patterns sourced from a configuration file (e.g. a .gitignore)
--debug all logs are shown
--alias <alias> in case you have adapter over original library (default: "@vkontakte/vkui")
-h, --help display help for command
При запуске приложения без аргументов будет предложено выбрать один из имеющихся codemod (их название отражает название компонента, к которому будет применено изменение). Если вам необходимо применить все имеющиеся codemods, запустите команду с опцией --all
:
npx @vkontakte/vkui-codemods --all
Если вы хотите исключить некоторые файлы или директории из обработки, то временно создайте файл (по примеру .gitignore) с перечисленными исключениями:
npx @vkontakte/vkui-codemods --all --path "./examples" --ignore-config "./.codemodignore"
// .codemodignore
MyBeautifulComponentToIgnore.tsx
directoryToIgnore/
Приведенная выше команда применит все codemods в директории examples
(находится в корне текущей директории), игонорируя файл MyBeautifulComponentToIgnore.tsx
и директорию directoryToIgnore
, указанные в .codemodignore
(находится в корне текущей директории)
Обратите внимание, если вы используете собственный адаптер над библиотекой
VKUI
и делаете ре-экспорт существующих компонентов, то можете воспользоваться опцией--alias
для указания правильного пути.
npx @vkontakte/vkui-codemods --all --alias "@myscope/VKUIFake"