{"id":393561,"date":"2024-06-29T11:05:07","date_gmt":"2024-06-29T11:05:07","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=393561"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=393561","title":{"rendered":"<span>\u041f\u044f\u0442\u0451\u0440\u043e\u0447\u043a\u0430 \u2014 \u0418\u043d\u0442\u0435\u0433\u0440\u0438\u0440\u0443\u0439 \u043c\u0435\u043d\u044f \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e<\/span>"},"content":{"rendered":"<div><!--[--><!--]--><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/718\/086\/5c3\/7180865c3a5069a7e519da70dcd282cf.png\" width=\"780\" height=\"441\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/718\/086\/5c3\/7180865c3a5069a7e519da70dcd282cf.png\"\/><\/figure>\n<p>\u0412\u0441\u0435\u043c \u043f\u0440\u0438\u0432\u0435\u0442! \u041c\u0435\u043d\u044f \u0437\u043e\u0432\u0443\u0442 \u0412\u0438\u0442\u0430\u043b\u0438\u0439, \u044f \u0432\u0435\u0434\u0443\u0449\u0438\u0439 frontend-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0432 KTS.<\/p>\n<p>\u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u044f \u0434\u0435\u043b\u044e\u0441\u044c \u043e\u043f\u044b\u0442\u043e\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u044b frontend-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0443\u0435\u0442 \u0441 \u0431\u043e\u043b\u044c\u0448\u0438\u043c \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e\u043c \u0432\u043d\u0435\u0448\u043d\u0438\u0445 \u0441\u0438\u0441\u0442\u0435\u043c. \u0424\u0440\u043e\u043d\u0442\u0435\u043d\u0434 \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u0433\u043b\u0430\u0432\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0438 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u2014\u00a0\u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u043e\u0432. \u0413\u043b\u0430\u0432\u043d\u044b\u0439 \u043f\u0440\u043e\u0435\u043a\u0442 \u0434\u0435\u043b\u0430\u0435\u043c \u043c\u044b \u0432 KTS, \u0430 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0442 \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u0435 \u043a\u043e\u043c\u0430\u043d\u0434\u044b.<\/p>\n<p>\u0412 \u0441\u0442\u0430\u0442\u044c\u0435 \u043c\u044b \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0430\u0441\u043f\u0435\u043a\u0442\u044b:<\/p>\n<ul>\n<li>\n<p><a href=\"#architecture_lk2\">\u0410\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0430 \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#uikit\">\u0427\u0442\u043e \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432 UI-\u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0435<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#core\">\u0421\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u044f\u0434\u0440\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#microfrontends\">\u041c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u044b<\/a>. \u041c\u044b \u043f\u043e\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u043b\u0438 \u0442\u0440\u0438 \u043f\u043e\u0434\u0445\u043e\u0434\u0430 \u043a\u043e \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043d\u0438\u044e \u043c\u043e\u0434\u0443\u043b\u0435\u0439. \u0412 \u0441\u0442\u0430\u0442\u044c\u0435 \u043f\u0440\u043e\u0430\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u0435\u043c \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430 \u0438 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0438 \u043a\u0430\u0436\u0434\u043e\u0433\u043e. \u041f\u043e\u0434\u0435\u043b\u044e\u0441\u044c, \u043f\u043e\u0447\u0435\u043c\u0443 \u043c\u044b \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043b\u0438 \u043e\u0442 \u043e\u0434\u043d\u043e\u0433\u043e \u0441\u043f\u043e\u0441\u043e\u0431\u0430 \u043a \u0434\u0440\u0443\u0433\u043e\u043c\u0443.<\/p>\n<ul>\n<li>\n<p><a href=\"#iframe\">iframe<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#npm\">NPM-\u043f\u0430\u043a\u0435\u0442\u044b<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#wmf\">Webpack Module Federation<\/a><\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><a href=\"#mobile\">\u041a\u0430\u043a \u043c\u044b \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043b\u0438 \u0441\u0432\u043e\u0439 \u0441\u0435\u0440\u0432\u0438\u0441 \u0432 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435<\/a><\/p>\n<\/li>\n<\/ul>\n<h2>\u041f\u044f\u0442\u0451\u0440\u043e\u0447\u043a\u0430, \u0447\u0442\u043e \u0442\u044b?<\/h2>\n<p>\u0414\u0432\u0430 \u0433\u043e\u0434\u0430 \u043d\u0430\u0437\u0430\u0434 \u0432 KTS \u043f\u0440\u0438\u0448\u0435\u043b X5 Retail Group \u0441 \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u043c \u043d\u043e\u0432\u043e\u0433\u043e \u043b\u0438\u0447\u043d\u043e\u0433\u043e \u043a\u0430\u0431\u0438\u043d\u0435\u0442\u0430 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430 \u041f\u044f\u0442\u0451\u0440\u043e\u0447\u043a\u0438 \u2014\u00a0\u041b\u041a2. \u0427\u0435\u0440\u0435\u0437 \u043b\u0438\u0447\u043d\u044b\u0439 \u043a\u0430\u0431\u0438\u043d\u0435\u0442 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0437\u0430\u0440\u043f\u043b\u0430\u0442\u0443 \u0438 \u0440\u0430\u0431\u043e\u0447\u0435\u0435 \u0440\u0430\u0441\u043f\u0438\u0441\u0430\u043d\u0438\u0435, \u0437\u0430\u043f\u043b\u0430\u043d\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0438 \u0441\u043e\u0433\u043b\u0430\u0441\u043e\u0432\u0430\u0442\u044c \u043e\u0442\u043f\u0443\u0441\u043a, \u0437\u0430\u043f\u0440\u043e\u0441\u0438\u0442\u044c \u0441\u043f\u0440\u0430\u0432\u043a\u0438 \u0441 \u043c\u0435\u0441\u0442\u0430 \u0440\u0430\u0431\u043e\u0442\u044b, \u043f\u043e\u0434\u043f\u0438\u0441\u0430\u0442\u044c \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u044b \u044d\u043b\u0435\u043a\u0442\u0440\u043e\u043d\u043d\u043e\u0439 \u043f\u043e\u0434\u043f\u0438\u0441\u044c\u044e \u0438 \u0442.\u0434. \u0420\u0443\u043a\u043e\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c \u043d\u0430\u043d\u0438\u043c\u0430\u0435\u0442, \u0443\u0432\u043e\u043b\u044c\u043d\u044f\u0435\u0442 \u0438\u043b\u0438 \u043f\u0435\u0440\u0435\u0432\u043e\u0434\u0438\u0442 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430, \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 \u043a\u043e\u043c\u0430\u043d\u0434\u043e\u0439&#8230; \u0412 \u043e\u0431\u0449\u0435\u043c, \u044d\u0442\u043e \u043f\u0440\u043e\u0434\u0443\u043a\u0442 \u0441 \u043e\u0433\u0440\u043e\u043c\u043d\u044b\u043c \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e\u043c \u0431\u0438\u0437\u043d\u0435\u0441-\u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432, \u0440\u043e\u043b\u0435\u0439 \u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u043e\u0432.<\/p>\n<p>\u041c\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432 \u0443\u0436\u0435 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043b\u043e\u0441\u044c \u0432 \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u044b\u0445 \u0441\u0435\u0440\u0432\u0438\u0441\u0430\u0445, \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u044b \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u043b\u0438\u0441\u044c \u0432\u0440\u0443\u0447\u043d\u0443\u044e. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u043e\u0434\u0443\u043a\u0442 \u043e\u043f\u0440\u0430\u0432\u0434\u044b\u0432\u0430\u043b \u043e\u0436\u0438\u0434\u0430\u043d\u0438\u044f, \u0440\u0430\u0431\u043e\u0442\u0430 \u0434\u043e\u043b\u0436\u043d\u0430 \u0438\u0434\u0442\u0438 \u0431\u044b\u0441\u0442\u0440\u043e. \u041a\u043e\u043d\u0435\u0447\u043d\u0430\u044f \u0446\u0435\u043b\u044c \u2014 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u043f\u0440\u043e\u0434\u0443\u043a\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u044f\u0435\u0442 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0432\u0441\u0435\u0445 \u0441\u0438\u0441\u0442\u0435\u043c \u0432 \u043e\u0434\u043d\u043e\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438.<\/p>\n<p>\u0427\u0430\u0441\u0442\u043e \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u044b \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u044b \u2014 \u043e\u043d\u0438 \u043d\u0435 \u0432\u043b\u0438\u044f\u044e\u0442 \u0434\u0440\u0443\u0433 \u043d\u0430 \u0434\u0440\u0443\u0433\u0430, \u0438 \u0438\u0445 \u043c\u043e\u0436\u043d\u043e \u0440\u0430\u0437\u0432\u0438\u0432\u0430\u0442\u044c \u043f\u0430\u0440\u0430\u043b\u043b\u0435\u043b\u044c\u043d\u043e. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0440\u0430\u0437\u0434\u0435\u043b \u0440\u0430\u0441\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430 \u043c\u043e\u0436\u043d\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u0441 \u0440\u0430\u0437\u0434\u0435\u043b\u043e\u043c \u0432\u044b\u043f\u043b\u0430\u0442. \u042d\u0442\u043e \u0437\u043d\u0430\u0447\u0438\u0442, \u0447\u0442\u043e \u043f\u0440\u043e\u0435\u043a\u0442 \u043c\u043e\u0436\u043d\u043e \u0440\u0430\u0437\u0434\u0435\u043b\u0438\u0442\u044c \u043c\u0435\u0436\u0434\u0443 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c\u0438 \u043a\u043e\u043c\u0430\u043d\u0434\u0430\u043c\u0438 \u0438 \u0437\u0430 \u0441\u0447\u0435\u0442 \u044d\u0442\u043e\u0433\u043e \u0443\u0432\u0435\u043b\u0438\u0447\u0438\u0442\u044c \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0430 \u043d\u0430 \u043d\u043e\u0432\u044b\u0439 \u043f\u043e\u0440\u0442\u0430\u043b.<\/p>\n<p>\u0421\u043f\u0443\u0441\u0442\u044f \u043f\u043e\u043b\u0433\u043e\u0434\u0430 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 MVP \u0441\u0444\u043e\u0440\u043c\u0438\u0440\u043e\u0432\u0430\u043b\u043e\u0441\u044c \u044f\u0434\u0440\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0438 \u043f\u043e\u044f\u0432\u0438\u043b\u0430\u0441\u044c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0440\u0430\u0441\u043f\u0430\u0440\u0430\u043b\u043b\u0435\u043b\u0438\u0442\u044c \u0440\u0430\u0431\u043e\u0442\u044b. \u0417\u0434\u0435\u0441\u044c \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442\u0441\u044f \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e\u0435: \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u044c \u043f\u0430\u0440\u0430\u043b\u043b\u0435\u043b\u044c\u043d\u043e\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u041b\u041a2 \u0437\u0430\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u043f\u0440\u043e\u0434\u0443\u043a\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043d\u0435 \u0435\u0434\u0438\u043d\u043e\u0439 \u043a\u043e\u043c\u0430\u043d\u0434\u043e\u0439 \u0438 \u0434\u0430\u0436\u0435 \u043d\u0435 \u043e\u0434\u043d\u043e\u0439 \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u0435\u0439, \u0430 \u043c\u043d\u043e\u0433\u0438\u043c\u0438 \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u044b\u043c\u0438 \u043a\u043e\u043c\u0430\u043d\u0434\u0430\u043c\u0438 \u0438 \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u044f\u043c\u0438. \u0412 \u0442\u0430\u043a\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435 \u043d\u0435\u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0432 \u043e\u0434\u043d\u043e\u043c \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0438, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u044d\u0442\u043e \u0441\u0440\u0430\u0437\u0443 \u0436\u0435 \u043f\u0440\u0438\u0432\u0435\u043b\u043e \u0431\u044b \u043a \u0445\u0430\u043e\u0441\u0443. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u043d\u0443\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u043f\u0440\u0438\u0434\u0443\u043c\u0430\u0442\u044c \u0443\u0434\u043e\u0431\u043d\u044b\u0439 \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u043c\u043d\u043e\u0433\u0438\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u0432 \u0438 \u0438\u0445 \u0438\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u0438 \u0432 \u0431\u0430\u0437\u043e\u0432\u044b\u0439 \u043f\u0440\u043e\u0435\u043a\u0442.<\/p>\n<p><a class=\"anchor\" name=\"architecture_lk2\" id=\"architecture_lk2\"><\/a><\/p>\n<h2>\u0410\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0430 \u041b\u041a2<\/h2>\n<p>\u0411\u0430\u0437\u043e\u0432\u044b\u0439 \u043f\u0440\u043e\u0435\u043a\u0442 \u041b\u041a2 \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u043c \u043c\u044b \u0432 KTS. \u0412 \u041b\u041a2 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442\u0441\u044f \u043a\u043e\u0440\u043d\u0435\u0432\u0430\u044f \u043b\u043e\u0433\u0438\u043a\u0430 \u0438 \u0431\u043e\u043b\u044c\u0448\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0431\u0438\u0437\u043d\u0435\u0441-\u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432. \u0418 \u043c\u044b \u0436\u0435 \u0437\u0430\u043d\u0438\u043c\u0430\u0435\u043c\u0441\u044f \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435\u043c \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u0434\u0440\u0443\u0433\u0438\u0445 \u043a\u043e\u043c\u0430\u043d\u0434.<\/p>\n<p>\u0417\u0430\u0444\u0438\u043a\u0441\u0438\u0440\u0443\u0435\u043c \u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043d\u0438\u044f \u0438 \u043f\u0440\u0438\u043d\u0446\u0438\u043f\u044b, \u0438\u0441\u0445\u043e\u0434\u044f \u0438\u0437 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043c\u044b \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043b\u0438 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0443:<\/p>\n<ul>\n<li>\n<p>\u041f\u0440\u043e\u0435\u043a\u0442 \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0432 \u043e\u0434\u043d\u043e\u043c \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u043c \u0441\u0442\u0438\u043b\u0435;<\/p>\n<\/li>\n<li>\n<p>\u0414\u043b\u044f \u0443\u0434\u043e\u0431\u0441\u0442\u0432\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043f\u0440\u043e\u0435\u043a\u0442 \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c SPA;<\/p>\n<\/li>\n<li>\n<p>\u0410\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u044f, \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044f \u0438 \u0434\u0440. \u2014\u00a0\u044d\u0442\u043e \u0431\u0430\u0437\u043e\u0432\u0430\u044f \u043b\u043e\u0433\u0438\u043a\u0430\u00a0\u044f\u0434\u0440\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u0412\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u044f\u0434\u0440\u043e\u043c \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c \u043f\u0440\u0435\u0434\u0441\u043a\u0430\u0437\u0443\u0435\u043c\u044b\u043c, \u0435\u0434\u0438\u043d\u043e\u043e\u0431\u0440\u0430\u0437\u043d\u044b\u043c \u0438 \u043b\u0435\u0433\u043a\u0438\u043c \u0434\u043b\u044f \u0432\u0441\u0435\u0445 \u043a\u043e\u043c\u0430\u043d\u0434;<\/p>\n<\/li>\n<li>\n<p>\u0421\u0442\u043e\u0440\u043e\u043d\u043d\u044f\u044f \u043a\u043e\u043c\u0430\u043d\u0434\u0430 \u0434\u043e\u043b\u0436\u043d\u0430 \u0437\u0430\u0442\u0440\u0430\u0442\u0438\u0442\u044c \u043c\u0438\u043d\u0438\u043c\u0443\u043c \u0443\u0441\u0438\u043b\u0438\u0439, \u0447\u0442\u043e\u0431\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u043c\u043e\u0434\u0443\u043b\u044c \u0438 \u0432\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0435\u0433\u043e \u0432 \u041b\u041a2.<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u0440\u043e\u0435\u043a\u0442 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0438\u0437 \u0441\u0435\u0431\u044f <a href=\"https:\/\/ru.wikipedia.org\/wiki\/%D0%9C%D0%BE%D0%BD%D0%BE%D1%80%D0%B5%D0%BF%D0%BE%D0%B7%D0%B8%D1%82%D0%BE%D1%80%D0%B8%D0%B9\">\u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439<\/a>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0442\u0440\u0438 \u043f\u0430\u043a\u0435\u0442\u0430:<\/p>\n<ul>\n<li>\n<p><code>lk2<\/code> \u2014\u00a0\u0433\u043b\u0430\u0432\u043d\u044b\u0439 \u043f\u0430\u043a\u0435\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u0442 \u0432\u0441\u044e \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0443. <code>lk2<\/code> \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u043f\u0430\u043a\u0435\u0442\u044b \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0438\u043c\u0435\u043d\u043d\u043e \u0432 \u043d\u0435\u0433\u043e \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u044e\u0442\u0441\u044f \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u0435 \u043c\u043e\u0434\u0443\u043b\u0438.<\/p>\n<\/li>\n<\/ul>\n<p>\u0421\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0434\u0432\u0430 \u043f\u0430\u043a\u0435\u0442\u0430 \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442 \u0432\u0441\u0435 \u043a\u043e\u043c\u0430\u043d\u0434\u044b, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043c\u044b \u043f\u0443\u0431\u043b\u0438\u043a\u0443\u0435\u043c \u0438\u0445 \u0432 \u043f\u0440\u0438\u0432\u0430\u0442\u043d\u043e\u043c NPM-registry.<\/p>\n<ul>\n<li>\n<p><code>@five\/uikit<\/code> \u2014 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 UI-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432;<\/p>\n<\/li>\n<li>\n<p><code>@five\/core<\/code> \u2014\u00a0\u044f\u0434\u0440\u043e \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0441\u0442\u043e\u0440\u044b, React-\u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u044b \u0438 \u0447\u0430\u0441\u0442\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043e \u0442\u043e\u043c, \u043a\u0430\u043a \u0437\u0430\u0441\u0435\u0442\u0430\u043f\u0438\u0442\u044c \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439, \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u0432 <a href=\"https:\/\/habr.com\/ru\/company\/kts\/blog\/553806\/\">\u043d\u0430\u0448\u0435\u0439 \u0441\u0442\u0430\u0442\u044c\u0435<\/a>.<\/p>\n<p>\u041d\u0430 \u0440\u0438\u0441\u0443\u043d\u043a\u0435 \u043d\u0438\u0436\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0430 \u043f\u043e\u043b\u0443\u0447\u0438\u0432\u0448\u0430\u044f\u0441\u044f \u0441\u0445\u0435\u043c\u0430.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/b17\/944\/39a\/b1794439a9bcabc277f3cf2d1e3f74b6.png\" alt=\"\u0422\u0435\u043a\u0443\u0449\u0430\u044f \u0441\u0445\u0435\u043c\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430\" title=\"\u0422\u0435\u043a\u0443\u0449\u0430\u044f \u0441\u0445\u0435\u043c\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430\" width=\"1814\" height=\"1468\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/b17\/944\/39a\/b1794439a9bcabc277f3cf2d1e3f74b6.png\"\/><\/p>\n<div><figcaption>\u0422\u0435\u043a\u0443\u0449\u0430\u044f \u0441\u0445\u0435\u043c\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430<\/figcaption><\/div>\n<\/figure>\n<p>\u041f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430 \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f \u0441\u043b\u0435\u0434\u0443\u044e\u0442 \u0438\u0437 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u043f\u0440\u043e\u0435\u043a\u0442 \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u0435\u0434\u0438\u043d\u043e\u0439 \u043a\u043e\u0434\u043e\u0432\u043e\u0439 \u0431\u0430\u0437\u044b:<\/p>\n<ul>\n<li>\n<p><code>@five\/uikit<\/code> \u0438 <code>@five\/core<\/code> \u0447\u0430\u0441\u0442\u043e \u0434\u043e\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0442\u0441\u044f. \u042d\u0442\u0438 \u043f\u0430\u043a\u0435\u0442\u044b \u0432\u0445\u043e\u0434\u044f\u0442 \u0432 \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043f\u043e\u0441\u043b\u0435 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0438\u0445 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u0442\u044c \u043d\u043e\u0432\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e. \u0412\u043e \u0432\u0440\u0435\u043c\u044f \u0441\u0431\u043e\u0440\u043a\u0438 <code>lk2<\/code> \u0431\u0443\u0434\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d \u043a\u043e\u0434 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a \u043d\u0435 \u0438\u0437 registry, \u0430 \u0438\u0437 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043e\u043d \u0432\u0441\u0435\u0433\u0434\u0430 \u0430\u043a\u0442\u0443\u0430\u043b\u0435\u043d. \u041d\u043e\u0432\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e \u043f\u0443\u0431\u043b\u0438\u043a\u0443\u0435\u043c \u0442\u043e\u043b\u044c\u043a\u043e \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u043c \u043a\u043e\u043c\u0430\u043d\u0434\u0430\u043c.<\/p>\n<\/li>\n<li>\n<p>\u0423\u0434\u043e\u0431\u043d\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u0435\u043a\u0442 \u043f\u043e \u0432\u0435\u0442\u043a\u0430\u043c: \u0438 \u0432 <code>@five\/uikit<\/code> \u0438 \u0432 <code>@five\/core<\/code> \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u0447\u043d\u044b\u0435 \u0434\u043b\u044f \u0432\u0435\u0442\u043a\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p>\u041e\u0440\u0438\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0432 \u043e\u0434\u043d\u043e\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u0433\u043e\u0440\u0430\u0437\u0434\u043e \u043f\u0440\u043e\u0449\u0435, \u0447\u0435\u043c \u0432 \u0442\u0440\u0451\u0445 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\u0445.<\/p>\n<\/li>\n<\/ul>\n<p><a class=\"anchor\" name=\"uikit\" id=\"uikit\"><\/a><\/p>\n<h2>UI-\u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 @five\/uikit<\/h2>\n<p><code>@five\/uikit<\/code>\u00a0\u2014\u00a0\u044d\u0442\u043e \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 UI-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432. \u0412 \u043d\u0435\u0451 \u043c\u044b \u0432\u044b\u043d\u043e\u0441\u0438\u043c \u0432\u0441\u0435 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b: \u043a\u043d\u043e\u043f\u043a\u0438, \u043f\u0430\u043d\u0435\u043b\u0438, \u043a\u0430\u043b\u0435\u043d\u0434\u0430\u0440\u0438 \u0438 \u0442.\u0434. \u041a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0438\u0437 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0432\u043e \u0432\u0441\u0435\u0445 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430\u0445 \u0438 \u043d\u0435 \u0437\u0430\u0432\u044f\u0437\u0430\u043d\u044b \u043d\u0430 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0435.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/c1c\/f5f\/8e8\/c1cf5f8e89b8611bb1a9c773efd2f333.png\" alt=\"\u041f\u0440\u0438\u043c\u0435\u0440 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u0438\u0437 @five\/uikit\" title=\"\u041f\u0440\u0438\u043c\u0435\u0440 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u0438\u0437 @five\/uikit\" width=\"978\" height=\"214\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/c1c\/f5f\/8e8\/c1cf5f8e89b8611bb1a9c773efd2f333.png\"\/><\/p>\n<div><figcaption>\u041f\u0440\u0438\u043c\u0435\u0440 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u0438\u0437 @five\/uikit<\/figcaption><\/div>\n<\/figure>\n<p>NPM-\u043f\u0430\u043a\u0435\u0442\u044b \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u043c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e Rollup. \u042d\u0442\u043e\u0442 \u0441\u0431\u043e\u0440\u0449\u0438\u043a, \u0432 \u043e\u0442\u043b\u0438\u0447\u0438\u0435 \u043e\u0442 Webpack, \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u0442 ES-\u043c\u043e\u0434\u0443\u043b\u0438 \u0438 \u043b\u0443\u0447\u0448\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u0438\u0442 \u0434\u043b\u044f \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a. \u041d\u0430 \u043c\u043e\u043c\u0435\u043d\u0442 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u0441\u0442\u0430\u0442\u044c\u0438 \u0432 \u043f\u044f\u0442\u043e\u043c \u0412\u0435\u0431\u043f\u0430\u043a\u0435 \u0443\u0436\u0435 \u043f\u043e\u044f\u0432\u0438\u043b\u0430\u0441\u044c \u0441\u0431\u043e\u0440\u043a\u0430 ES-\u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u0432 \u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435. \u041a\u043e\u0433\u0434\u0430 \u044d\u0442\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0441\u0442\u0430\u043d\u0435\u0442 \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u043e\u0439, \u043c\u044b \u043e\u0442\u043a\u0430\u0436\u0435\u043c\u0441\u044f \u043e\u0442 Rollup \u0432 \u043f\u043e\u043b\u044c\u0437\u0443 Webpack, \u0447\u0442\u043e\u0431\u044b \u0441\u0431\u043e\u0440\u043a\u0438 \u043d\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u043b\u0438\u0441\u044c \u043e\u0434\u043d\u0438\u043c \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u043c.<\/p>\n<p>\u0414\u043b\u044f \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c <a href=\"https:\/\/storybook.js.org\/\">Storybook<\/a>.<\/p>\n<p>\u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043e \u0442\u043e\u043c, \u043a\u0430\u043a \u0441\u043e\u0431\u0440\u0430\u0442\u044c \u0441\u0432\u043e\u044e UI-\u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443, \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443 \u0432 \u043e\u0434\u043d\u043e\u0439 \u0438\u0437 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0445 \u0441\u0442\u0430\u0442\u0435\u0439. \u200b<\/p>\n<p><a class=\"anchor\" name=\"core\" id=\"core\"><\/a><\/p>\n<h2>\u042f\u0434\u0440\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 @five\/core<\/h2>\n<p><code>@five\/core<\/code> \u2014\u00a0\u044d\u0442\u043e \u044f\u0434\u0440\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u0415\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 <code>lk2<\/code> \u0438 \u043a\u0430\u0436\u0434\u044b\u0439 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434.<\/p>\n<h3>\u0421\u0442\u043e\u0440\u044b<\/h3>\n<p>\u0412 \u043f\u0435\u0440\u0432\u0443\u044e \u043e\u0447\u0435\u0440\u0435\u0434\u044c <code>core<\/code> \u043d\u0443\u0436\u0435\u043d \u0434\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u0443 \u0432\u0441\u0435\u0445 \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c\u044b\u0445 \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u0431\u044b\u043b \u043e\u0431\u0449\u0438\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e \u0441\u0435\u0441\u0441\u0438\u0438 \u0438 \u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 <code>core<\/code> \u0432\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u0432 \u0441\u0435\u0431\u044f \u0431\u0430\u0437\u043e\u0432\u044b\u0435 Redux-\u0441\u0442\u043e\u0440\u044b.<\/p>\n<ul>\n<li>\n<p><code>userStore<\/code> \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0434\u0430\u043d\u043d\u044b\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u042d\u0442\u043e\u0442 \u0441\u0442\u043e\u0440 \u0438\u0441\u043f\u0443\u0441\u043a\u0430\u0435\u0442 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0435 Redux-\u044d\u043a\u0448\u0435\u043d\u044b. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u044d\u043a\u0448\u0435\u043d <code>USER_NOT_AUTHORIZED<\/code> \u0441\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442, \u043a\u043e\u0433\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0440\u0430\u0437\u043b\u043e\u0433\u0438\u043d\u0438\u043b\u0441\u044f \u0438\u043b\u0438 \u0437\u0430\u043f\u0440\u043e\u0441 \u043a api \u0437\u0430\u0432\u0435\u0440\u0448\u0438\u043b\u0441\u044f \u0441\u043e \u0441\u0442\u0430\u0442\u0443\u0441\u043e\u043c 401. \u041d\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u044d\u0442\u0438 \u044d\u043a\u0448\u0435\u043d\u044b \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u043c\u0438, \u0442.\u043a. \u043e\u043d\u0438 \u043f\u0440\u0435\u0434\u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u044b \u0432\u0441\u0435\u043c\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044e, \u0438 \u0438\u0445 \u0434\u043e\u043b\u0436\u0435\u043d \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u043a\u0430\u0436\u0434\u044b\u0439 \u0441\u0442\u043e\u0440. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0435\u0440\u0435\u0442\u0435\u0440\u0435\u0442\u044c \u0438\u043b\u0438 \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435.<\/p>\n<\/li>\n<li>\n<p>\u0412\u0441\u0435 \u0437\u0430\u043f\u0440\u043e\u0441\u044b \u043a API \u043f\u0440\u043e\u0445\u043e\u0434\u044f\u0442 \u0447\u0435\u0440\u0435\u0437 <code>apiStore<\/code>. \u0412 \u043d\u0451\u043c \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0442\u0441\u044f \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0435 \u043e\u0448\u0438\u0431\u043a\u0438:<\/p>\n<ul>\n<li>\n<p>\u0432 \u0441\u043b\u0443\u0447\u0430\u0435 \u043e\u0442\u0432\u0435\u0442\u0430 \u0441\u043e \u0441\u0442\u0430\u0442\u0443\u0441\u043e\u043c 401 \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u044d\u043a\u0440\u0430\u043d \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u0438;<\/p>\n<\/li>\n<li>\n<p>\u0432 \u0441\u043b\u0443\u0447\u0430\u0435 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0438\u0445 \u043e\u0448\u0438\u0431\u043e\u043a \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435.<\/p>\n<\/li>\n<\/ul>\n<p>\u0418\u043c\u0435\u043d\u043d\u043e \u0431\u043b\u0430\u0433\u043e\u0434\u0430\u0440\u044f \u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u0432\u0441\u0435 \u0437\u0430\u043f\u0440\u043e\u0441\u044b \u043f\u0440\u043e\u0445\u043e\u0434\u044f\u0442 \u0447\u0435\u0440\u0435\u0437 <code>apiStore<\/code>, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0438 \u043d\u0430 \u043b\u044e\u0431\u043e\u0439 \u0437\u0430\u043f\u0440\u043e\u0441 \u0438 \u0438\u043d\u0438\u0446\u0438\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0435 \u044d\u043a\u0448\u0435\u043d\u044b, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, <code>USER_NOT_AUTHORIZED<\/code>. \u0412 <code>apiStore<\/code> \u043d\u0435\u0442 \u0441\u0432\u043e\u0435\u0433\u043e Redux-\u0441\u0442\u0435\u0439\u0442\u0430, \u043e\u043d \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0442\u043e\u043b\u044c\u043a\u043e <a href=\"https:\/\/github.com\/reduxjs\/redux-thunk\">thunk<\/a>-\u044d\u043a\u0448\u0435\u043d\u044b \u0438 \u0432\u0441\u043f\u043e\u043c\u043e\u0433\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0443\u0442\u0438\u043b\u0438\u0442\u044b.<\/p>\n<\/li>\n<\/ul>\n<p><a class=\"anchor\" name=\"navigation_store\" id=\"navigation_store\"><\/a><\/p>\n<ul>\n<li>\n<p><code>navigationStore<\/code>. \u041a\u0430\u043a \u043f\u0438\u0441\u0430\u043b \u0432\u044b\u0448\u0435, \u043b\u0438\u0447\u043d\u044b\u043c \u043a\u0430\u0431\u0438\u043d\u0435\u0442\u043e\u043c \u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0438 \u0441 \u0440\u0430\u0437\u043d\u044b\u043c\u0438 \u0440\u043e\u043b\u044f\u043c\u0438. \u0420\u043e\u043b\u044c \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e\u0441\u0442\u044c \u0440\u0430\u0437\u0434\u0435\u043b\u0430. \u0423 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430 \u043c\u0430\u0433\u0430\u0437\u0438\u043d\u0430 \u0435\u0441\u0442\u044c \u0440\u0430\u0437\u0434\u0435\u043b \u0441 \u0433\u0440\u0430\u0444\u0438\u043a\u043e\u043c \u0440\u0430\u0431\u043e\u0442\u044b, \u0430 \u0443 \u043e\u0444\u0438\u0441\u043d\u043e\u0433\u043e \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430 \u044d\u0442\u043e\u0433\u043e \u0440\u0430\u0437\u0434\u0435\u043b\u0430 \u043d\u0435\u0442, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043e\u0444\u0438\u0441\u043d\u044b\u0439 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0441 \u043f\u043e\u043d\u0435\u0434\u0435\u043b\u044c\u043d\u0438\u043a\u0430 \u043f\u043e \u043f\u044f\u0442\u043d\u0438\u0446\u0443. \u0418\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043e \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0445 \u0440\u0430\u0437\u0434\u0435\u043b\u0430\u0445 \u0437\u0430\u043f\u043e\u043b\u043d\u044f\u0435\u0442 \u043d\u0430\u0448 \u043c\u0435\u043d\u0435\u0434\u0436\u0435\u0440 \u0432 \u043f\u0430\u043d\u0435\u043b\u0438 \u0430\u0434\u043c\u0438\u043d\u0438\u0441\u0442\u0440\u0430\u0442\u043e\u0440\u0430.<\/p>\n<p>\u0412 <code>navigationStore<\/code> \u0445\u0440\u0430\u043d\u0438\u0442\u0441\u044f \u043a\u043e\u043d\u0444\u0438\u0433 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u044b\u0447\u0438\u0441\u043b\u044f\u0435\u0442\u0441\u044f \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0435\u0433\u043e \u0434\u0430\u043d\u043d\u044b\u0445. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043c\u043e\u0436\u0435\u043c \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u0431\u0430\u043d\u043d\u0435\u0440 \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u043c \u0440\u0435\u0433\u0438\u043e\u043d\u0435 \u0438\u043b\u0438 \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u043a\u043d\u043e\u043f\u043a\u0443 \u0434\u043b\u044f \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u043e\u0432 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u0439 \u0434\u043e\u043b\u0436\u043d\u043e\u0441\u0442\u0438.<\/p>\n<p>\u0418\u0442\u043e\u0433\u043e: <code>navigationStore<\/code> \u0445\u0440\u0430\u043d\u0438\u0442 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043e \u0434\u043e\u0441\u0442\u0443\u043f\u0430\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432, \u0441 \u043a\u043e\u0442\u043e\u0440\u044b\u043c\u0438 \u043e\u0442\u043a\u0440\u044b\u0442 \u041b\u041a2:<\/p>\n<ul>\n<li>\n<p>\u0441\u0435\u0441\u0441\u0438\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f;<\/p>\n<\/li>\n<li>\n<p>\u043f\u043b\u0430\u0442\u0444\u043e\u0440\u043c\u0430, \u0441 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043e\u0442\u043a\u0440\u044b\u0442 \u041b\u041a2 (\u0434\u0435\u0441\u043a\u0442\u043e\u043f\u043d\u044b\u0439 \u0431\u0440\u0430\u0443\u0437\u0435\u0440, \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u0439 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0438\u043b\u0438 WebView \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f).<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h3>\u041a\u043e\u0440\u043d\u0435\u0432\u043e\u0439 React-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 X5LkApp<\/h3>\n<p><code>@five\/core<\/code> \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u0442 React-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 <code>X5LkApp<\/code>. \u0418 <code>lk2<\/code>, \u0438 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u044b \u0434\u043e\u043b\u0436\u043d\u044b \u0438\u043c\u0435\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0434\u0430\u043d\u043d\u044b\u043c \u0438\u0437 \u044f\u0434\u0440\u0430. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0438\u0445 \u043d\u0443\u0436\u043d\u043e \u043e\u0431\u0435\u0440\u043d\u0443\u0442\u044c \u0432 <code>X5LkApp<\/code>. <code>X5LkApp<\/code> \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u0447\u0430\u0441\u0442\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<h4>\u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442<\/h4>\n<p>\u0414\u043b\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u043e\u0432 \u0438 \u0433\u043b\u0430\u0432\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0443\u0436\u0435\u043d \u043e\u0431\u0449\u0438\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442. \u042d\u0442\u043e\u0442 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u0437\u0430\u0434\u0430\u0451\u0442\u0441\u044f \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c\u0438 React-\u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u0430\u043c\u0438. \u041f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u044b \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u0441\u044f \u0432 <code>@five\/core<\/code>, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0434\u0430\u043d\u043d\u044b\u0435 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430 \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u043e \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b \u0438 \u0432 <code>lk2<\/code> \u0438 \u0432\u043e \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c\u044b\u0445 \u043c\u043e\u0434\u0443\u043b\u044f\u0445. \u0420\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u044b:<\/p>\n<ul>\n<li>\n<p>\u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 Redux-\u0441\u0442\u043e\u0440. \u0415\u0441\u0442\u044c \u0434\u0432\u0430 \u0441\u043f\u043e\u0441\u043e\u0431\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u043c\u0438 \u043c\u043e\u0434\u0443\u043b\u044c \u043c\u043e\u0436\u0435\u0442 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0441 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u043c \u0441\u0442\u043e\u0440\u043e\u043c:<\/p>\n<ol>\n<li>\n<p>\u0427\u0435\u0440\u0435\u0437 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 <code>X5UserContext<\/code>. \u0412 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u043d\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u0434\u0430\u043d\u043d\u044b\u0445 \u0438 \u044d\u043a\u0448\u0435\u043d\u043e\u0432.<\/p>\n<\/li>\n<li>\n<p>\u0427\u0435\u0440\u0435\u0437 inject \u0432 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 \u0441\u0442\u043e\u0440. \u0422\u043e\u0433\u0434\u0430 \u043c\u043e\u0436\u043d\u043e \u043e\u0431\u0440\u0430\u0449\u0430\u0442\u044c\u0441\u044f \u043a\u043e \u0432\u0441\u0435\u043c Redux-\u0441\u0442\u043e\u0440\u0430\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0430.<\/p>\n<\/li>\n<\/ol>\n<p>\u0412\u0442\u043e\u0440\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u043c\u0435\u043d\u0435\u0435 \u0431\u0435\u0437\u043e\u043f\u0430\u0441\u0435\u043d \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432 \u0440\u0435\u0434\u043a\u0438\u0445 \u0441\u043b\u0443\u0447\u0430\u044f\u0445. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u043c\u044b \u0432 <code>lk2<\/code>, \u0442.\u043a. \u043d\u0430 \u043d\u0430\u0448\u0435\u0439 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u0434\u0430\u043d\u043d\u044b\u043c\u0438.<\/p>\n<\/li>\n<li>\n<p>React-\u0440\u043e\u0443\u0442\u0435\u0440.<\/p>\n<\/li>\n<li>\n<p><code>ConnectToMobX<\/code> \u2014\u00a0\u043a\u043e\u043d\u043d\u0435\u043a\u0442\u043e\u0440 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0445 \u0441\u0442\u043e\u0440\u043e\u0432 \u0438\u0437 Redux \u043a MobX. \u0414\u0430, \u043d\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u0435\u0441\u0442\u044c \u043e\u0431\u0430 \u0441\u0442\u0435\u0439\u0442-\u043c\u0435\u043d\u0435\u0434\u0436\u0435\u0440\u0430. \u0421\u043d\u0430\u0447\u0430\u043b\u0430 \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 \u0442\u043e\u043b\u044c\u043a\u043e Redux, \u043d\u043e \u0437\u0430\u0442\u0435\u043c \u043f\u043e\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u043b\u0438 MobX, \u0438 \u0436\u0438\u0442\u044c \u0441\u0442\u0430\u043b\u043e \u0432\u0435\u0441\u0435\u043b\u0435\u0435: \u043a\u043e\u0434\u0430 \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f \u043c\u0435\u043d\u044c\u0448\u0435, \u0430 \u0437\u0430\u0434\u0430\u0447\u0438 \u0437\u0430\u043a\u0440\u044b\u0432\u0430\u044e\u0442\u0441\u044f \u0431\u044b\u0441\u0442\u0440\u0435\u0435. \u0421\u0435\u0439\u0447\u0430\u0441 \u043c\u044b \u043f\u043e\u0441\u0442\u0435\u043f\u0435\u043d\u043d\u043e \u043f\u0435\u0440\u0435\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u043c \u0441\u0442\u043e\u0440\u044b c Redux \u043d\u0430 MobX.<\/p>\n<\/li>\n<li>\n<p><code>StatisticsProvider<\/code> \u2014\u00a0\u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430 \u0434\u043b\u044f \u0441\u0431\u043e\u0440\u0430 \u0441\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0438.<\/p>\n<\/li>\n<\/ul>\n<p>\u0412\u0441\u0435\u0433\u043e \u0435\u0441\u0442\u044c 7 \u0442\u0430\u043a\u0438\u0445 \u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u043e\u0432.<\/p>\n<p><a class=\"anchor\" name=\"main_screen\" id=\"main_screen\"><\/a><\/p>\n<h4>\u041f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 X5LkApp<\/h4>\n<ul>\n<li>\n<p>\u0421\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u0438.<\/p>\n<\/li>\n<li>\n<p>\u0420\u0430\u0437\u043c\u0435\u0442\u043a\u0430 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u041e\u043d\u0430 \u0432\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u0432 \u0441\u0435\u0431\u044f \u0431\u043e\u043a\u043e\u0432\u043e\u0435 \u043c\u0435\u043d\u044e \u0438 \u0448\u0430\u043f\u043a\u0443 \u0441 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0435\u0439 \u043e \u0442\u0435\u043a\u0443\u0449\u0435\u043c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/b5f\/72e\/f10\/b5f72ef10efc86c4a5969a867b2954bf.png\" alt=\"\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0441\u0435\u0440\u0432\u0438\u0441\u0430\" title=\"\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0441\u0435\u0440\u0432\u0438\u0441\u0430\" width=\"2460\" height=\"1878\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/b5f\/72e\/f10\/b5f72ef10efc86c4a5969a867b2954bf.png\"\/><\/p>\n<div><figcaption>\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0441\u0435\u0440\u0432\u0438\u0441\u0430<\/figcaption><\/div>\n<\/figure>\n<\/li>\n<\/ul>\n<p>\u041e\u0431\u0451\u0440\u0442\u043a\u0430 <code>X5LkApp<\/code> \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0438 \u0432 <code>lk2<\/code> \u0438 \u0432 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430\u0445, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043d\u043e\u0432\u043e\u0433\u043e \u0440\u0430\u0437\u0434\u0435\u043b\u0430 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u043e \u0438 \u0434\u043b\u044f \u043d\u0430\u0441, \u0438 \u0434\u043b\u044f \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u0445 \u043a\u043e\u043c\u0430\u043d\u0434.<\/p>\n<p>\u0420\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 <code>X5LkApp<\/code> \u043d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0435.<\/p>\n<p><strong>\u0412 \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0435\u043c \u043c\u043e\u0434\u0443\u043b\u0435:<\/strong><\/p>\n<p>\u041a\u043e\u0440\u043d\u0435\u0432\u043e\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430:<\/p>\n<pre><code class=\"javascript\">\/\/ externalModule\/src\/ExternalModuleApp.tsx import { X5LkApp } from '@five\/core'; import ExternalModuleContent from '.\/ExternalModuleContent';  const ExternalModuleApp = () => (   &lt;X5LkApp>     &lt;ExternalModuleContent \/>   &lt;\/X5LkApp> );  export default ExternalModuleApp;<\/code><\/pre>\n<p>\u041a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0441 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u043e\u0439:<\/p>\n<pre><code class=\"javascript\">\/\/ externalModule\/src\/ExternalModuleContent.tsx import { useX5Data } from '@five\/core';  \/\/ \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c UI-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0438\u0437 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 import { Typo, UserCard } from '@five\/uikit';  const ExternalModuleApp = () => {   \/\/ ExternalModuleApp \u043e\u0431\u0451\u0440\u043d\u0443\u0442 \u0432 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 X5LkApp,   \/\/ \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u043d\u0443\u0442\u0440\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442   const { user } = useX5Data();    return (     &lt;>       &lt;Typo>\u041f\u0440\u0438\u0432\u0435\u0442 \u0438\u0437 \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0435\u0433\u043e \u043c\u043e\u0434\u0443\u043b\u044f&lt;\/Typo>       &lt;UserCard user={user} \/>     &lt;\/>   ); }; export default ExternalModuleApp;<\/code><\/pre>\n<p><strong>\u0412 lk2:<\/strong><\/p>\n<pre><code class=\"javascript\">\/\/ five\/packages\/lk2\/src\/Root.tsx import { useX5Data } from '@five\/core';  import SomePage from '.\/pages\/Page';  \/\/ \u0412 \u044d\u0442\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435 \u0438\u043c\u043f\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043c\u043e\u0434\u0443\u043b\u044c import ExternalComponentPage from '.\/pages\/ExernalComponentPage';  export const Root = () => (   \/\/ \u041a\u043e\u043d\u0442\u0435\u043d\u0442 lk2 \u0442\u043e\u0436\u0435 \u043e\u0431\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0442\u0435\u0441\u044f \u0432 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u0438\u0437 @five\/core   &lt;X5LkApp>     &lt;Switch>       &lt;Route path=\"\/some-page\" component={SomePage} \/>       &lt;Route path=\"\/external-module-page\" component={ExternalComponentPage} \/>     &lt;\/Switch>   &lt;\/X5LkApp> ); <\/code><\/pre>\n<h3>\u0412\u0441\u043f\u043e\u043c\u043e\u0433\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b<\/h3>\n<p><code>@five\/core<\/code> \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u0442 \u0432\u0441\u043f\u043e\u043c\u043e\u0433\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b. \u041e\u043d\u0438 \u0443\u043f\u0440\u043e\u0449\u0430\u044e\u0442 \u0440\u0430\u0431\u043e\u0442\u0443 \u0441 \u0440\u0430\u0437\u043c\u0435\u0442\u043a\u043e\u0439. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<ul>\n<li>\n<p><code>Layout.LayoutContent<\/code> \u2014\u00a0\u043e\u0431\u0451\u0440\u0442\u043a\u0430 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442 \u043e\u0442\u0441\u0442\u0443\u043f\u044b, \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0438 \u043a\u043d\u043e\u043f\u043a\u0443 &#171;\u041d\u0430\u0437\u0430\u0434&#187;.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/ead\/d8c\/f8c\/eadd8cf8cd5a98e59fc9c3587188df05.png\" alt=\"\u0413\u0440\u0430\u043d\u0438\u0446\u044b \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c\u043e\u0433\u043e \u043c\u043e\u0434\u0443\u043b\u044f\" title=\"\u0413\u0440\u0430\u043d\u0438\u0446\u044b \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c\u043e\u0433\u043e \u043c\u043e\u0434\u0443\u043b\u044f\" width=\"1200\" height=\"916\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ead\/d8c\/f8c\/eadd8cf8cd5a98e59fc9c3587188df05.png\"\/><\/p>\n<div><figcaption>\u0413\u0440\u0430\u043d\u0438\u0446\u044b \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c\u043e\u0433\u043e \u043c\u043e\u0434\u0443\u043b\u044f<\/figcaption><\/div>\n<\/figure>\n<\/li>\n<li>\n<p>\u0422\u0430\u043a\u0436\u0435 \u0441\u0440\u0435\u0434\u0438 \u0432\u0441\u043f\u043e\u043c\u043e\u0433\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0435\u0441\u0442\u044c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0443\u0436\u043d\u044b \u0432\u0441\u0435\u043c \u043a\u043e\u043c\u0430\u043d\u0434\u0430\u043c, \u043d\u043e \u043e\u043d\u0438 \u0441\u0438\u043b\u044c\u043d\u043e \u0437\u0430\u0432\u044f\u0437\u0430\u043d\u044b \u043d\u0430 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0443, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0438\u0445 \u043d\u0435\u043b\u044c\u0437\u044f \u0432\u044b\u043d\u0435\u0441\u0442\u0438 \u0432 <code>@five\/uikit<\/code>, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e &#171;\u0433\u043b\u0443\u043f\u044b\u0435&#187; \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b.<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u2014 \u043f\u0430\u043d\u0435\u043b\u044c \u0434\u043b\u044f \u0432\u044b\u0431\u043e\u0440\u0430 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/8cb\/1da\/6c3\/8cb1da6c3fc2e7d96a23641f3c789d21.png\" alt=\"\u041a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 EmployeeSelectPanel \u0434\u043b\u044f \u0432\u044b\u0431\u043e\u0440\u0430 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430\" title=\"\u041a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 EmployeeSelectPanel \u0434\u043b\u044f \u0432\u044b\u0431\u043e\u0440\u0430 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430\" width=\"2094\" height=\"1842\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/8cb\/1da\/6c3\/8cb1da6c3fc2e7d96a23641f3c789d21.png\"\/><\/p>\n<div><figcaption>\u041a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 EmployeeSelectPanel \u0434\u043b\u044f \u0432\u044b\u0431\u043e\u0440\u0430 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430<\/figcaption><\/div>\n<\/figure>\n<\/li>\n<\/ul>\n<p><a class=\"anchor\" name=\"core_interaction_schema\" id=\"core_interaction_schema\"><\/a><\/p>\n<p>\u0412 \u0438\u0442\u043e\u0433\u0435 \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442\u0441\u044f \u0442\u0430\u043a\u0430\u044f \u0441\u0445\u0435\u043c\u0430 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f <code>@five\/core<\/code>, <code>lk2<\/code> \u0438 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u043e\u0432. \u0421\u0442\u0440\u0435\u043b\u043a\u0438 \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u044e\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043e\u0434\u043d\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0434\u0440\u0443\u0433\u0438\u043c\u0438.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/43f\/9db\/c68\/43f9dbc6848eb33ac1016ef3fb358e99.png\" alt=\"\u0421\u0445\u0435\u043c\u0430 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u0441 @five\/core\" title=\"\u0421\u0445\u0435\u043c\u0430 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u0441 @five\/core\" width=\"1454\" height=\"1618\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/43f\/9db\/c68\/43f9dbc6848eb33ac1016ef3fb358e99.png\"\/><\/p>\n<div><figcaption>\u0421\u0445\u0435\u043c\u0430 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u0441 @five\/core<\/figcaption><\/div>\n<\/figure>\n<p><a class=\"anchor\" name=\"microfrontends\" id=\"microfrontends\"><\/a><\/p>\n<h2>\u041a\u0430\u043a \u043c\u044b \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0435\u043c \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u044b<\/h2>\n<p>\u041e \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430\u0445 \u043c\u043d\u043e\u0433\u043e \u0433\u043e\u0432\u043e\u0440\u044f\u0442, \u0432 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u044d\u0442\u043e\u0442 \u043f\u043e\u0434\u0445\u043e\u0434 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043e\u043f\u0440\u0430\u0432\u0434\u0430\u043d \u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c:<\/p>\n<ul>\n<li>\n<p>\u041a\u043e\u043c\u0430\u043d\u0434\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0442 \u043c\u043e\u0434\u0443\u043b\u0438 \u0438\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e \u0438 \u043d\u0435 \u0432\u043b\u0438\u044f\u044e\u0442 \u0434\u0440\u0443\u0433 \u043d\u0430 \u0434\u0440\u0443\u0433\u0430.<\/p>\n<\/li>\n<li>\n<p>\u041a\u043e\u043c\u0430\u043d\u0434\u044b \u043f\u043e\u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0438 \u0443\u0445\u043e\u0434\u044f\u0442, \u043a\u043e\u043d\u0435\u0447\u043d\u044b\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0438\u0445 \u0440\u0430\u0431\u043e\u0442\u044b \u2014\u00a0\u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043b\u0435\u0433\u043a\u043e \u0434\u043e\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c, \u043f\u0435\u0440\u0435\u043c\u0435\u0441\u0442\u0438\u0442\u044c \u0438\u043b\u0438 \u0443\u0434\u0430\u043b\u0438\u0442\u044c, \u043d\u043e \u043a\u043e\u043c\u0430\u043d\u0434\u0430 \u043d\u0435 \u043c\u043e\u0436\u0435\u0442 \u0432\u043d\u0435\u0441\u0442\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0432 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0443 \u0441\u0438\u0441\u0442\u0435\u043c\u044b \u2014 \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u043e \u0441 \u0442\u043e\u0447\u043a\u0438 \u0437\u0440\u0435\u043d\u0438\u044f \u043d\u0430\u0434\u0451\u0436\u043d\u043e\u0441\u0442\u0438 \u0438 \u0431\u0435\u0437\u043e\u043f\u0430\u0441\u043d\u043e\u0441\u0442\u0438.<\/p>\n<\/li>\n<li>\n<p>\u041a\u043e\u043c\u0430\u043d\u0434\u044b \u043f\u0440\u0438\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u043e\u0442\u043b\u0438\u0447\u0430\u044e\u0449\u0438\u0445\u0441\u044f \u043f\u0440\u0430\u043a\u0442\u0438\u043a \u0438 \u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043d\u0438\u0439 \u043a \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044e, \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0443 \u0438 \u0441\u0442\u0438\u043b\u044e \u043a\u043e\u0434\u0430, \u0443 \u043a\u043e\u043c\u0430\u043d\u0434 \u043f\u043e-\u0440\u0430\u0437\u043d\u043e\u043c\u0443 \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u044b \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u044b. \u0418\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0441\u0442\u044c \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043a\u0430\u0436\u0434\u043e\u0439 \u043a\u043e\u043c\u0430\u043d\u0434\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0432 \u043f\u0440\u0438\u0432\u044b\u0447\u043d\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435, \u0447\u0442\u043e \u0443\u0441\u043a\u043e\u0440\u044f\u0435\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u0438 \u0432\u043d\u0435\u0434\u0440\u0435\u043d\u0438\u0435.<\/p>\n<\/li>\n<li>\n<p>\u0411\u0438\u0437\u043d\u0435\u0441-\u043f\u0440\u043e\u0446\u0435\u0441\u0441\u044b \u0432 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043c\u043e\u0434\u0443\u043b\u044f\u0445 \u043e\u0447\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u044b, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0438\u0445 \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0442 \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043c\u0430\u043d\u0434\u044b.<\/p>\n<\/li>\n<\/ul>\n<p>\u041c\u044b \u043f\u0440\u043e\u0431\u043e\u0432\u0430\u043b\u0438 \u0442\u0440\u0438 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u043c\u043e\u0434\u0443\u043b\u0435\u0439. \u041d\u0438\u0436\u0435 \u043f\u0440\u043e\u0430\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u044e \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430 \u0438 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0438 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0438\u0437 \u043d\u0438\u0445, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043f\u043e\u0434\u0435\u043b\u044e\u0441\u044c, \u043f\u043e\u0447\u0435\u043c\u0443 \u043c\u044b \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043b\u0438 \u043e\u0442 \u043e\u0434\u043d\u043e\u0433\u043e \u043a \u0434\u0440\u0443\u0433\u043e\u043c\u0443.<\/p>\n<p><a class=\"anchor\" name=\"iframe\" id=\"iframe\"><\/a><\/p>\n<h3>iframe<\/h3>\n<p>\u0412 \u0441\u0430\u043c\u043e\u043c \u043d\u0430\u0447\u0430\u043b\u0435 \u0435\u0449\u0451 \u043d\u0435 \u0431\u044b\u043b\u043e \u043f\u0430\u043a\u0435\u0442\u0430 <code>@five\/core<\/code>, \u043d\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u044c \u0432\u043e \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043d\u0438\u0438 \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u0443\u0436\u0435 \u0431\u044b\u043b\u0430. <code>iframe<\/code> \u0441\u0442\u0430\u043b \u043f\u0435\u0440\u0432\u044b\u043c \u0441\u043f\u043e\u0441\u043e\u0431\u043e\u043c, \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u043c\u044b \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043b\u0438 \u043c\u043e\u0434\u0443\u043b\u0438.<\/p>\n<p>\u041f\u0435\u0440\u0435\u0434 \u043d\u0430\u043c\u0438 \u0441\u0442\u043e\u044f\u043b\u0430 \u0437\u0430\u0434\u0430\u0447\u0430 \u2014 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043c\u043e\u0434\u0443\u043b\u044c \u0432 \u043a\u0440\u0430\u0442\u0447\u0430\u0439\u0448\u0438\u0435 \u0441\u0440\u043e\u043a\u0438. \u0412 \u0442\u0435\u0445 \u0443\u0441\u043b\u043e\u0432\u0438\u044f\u0445 <code>iframe<\/code> \u043f\u043e\u043a\u0430\u0437\u0430\u043b\u0441\u044f \u0441\u0430\u043c\u044b\u043c \u043f\u0440\u043e\u0441\u0442\u044b\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u043c.<\/p>\n<p>\u0412 React-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0447\u043a\u0443, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0440\u0430\u0441\u0442\u044f\u043d\u0443\u0442\u044c <code>iframe<\/code> \u0438 \u0432\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0432 \u043d\u0435\u0433\u043e \u0441\u0441\u044b\u043b\u043a\u0443 \u043d\u0430 \u043c\u043e\u0434\u0443\u043b\u044c. \u0421 \u0443\u0447\u0451\u0442\u043e\u043c \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u0443 \u043d\u0430\u0441 \u0443\u0436\u0435 \u0431\u044b\u043b \u0430\u0434\u043c\u0438\u043d\u0438\u0441\u0442\u0440\u0438\u0440\u0443\u0435\u043c\u044b\u0439 <a href=\"#navigation_store\">navigationStore<\/a>, \u044d\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u043f\u0440\u043e\u0441\u0442\u043e.<\/p>\n<p>\u041c\u043e\u0434\u0443\u043b\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 API \u0431\u044d\u043a\u0435\u043d\u0434\u0430 \u041b\u041a2. \u041d\u043e \u0442.\u043a. \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 <code>iframe<\/code> \u0438 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0438\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u044b \u0434\u0440\u0443\u0433 \u043e\u0442 \u0434\u0440\u0443\u0433\u0430, \u043c\u043e\u0434\u0443\u043b\u044c \u0434\u043e\u043b\u0436\u0435\u043d \u043f\u0440\u043e\u0439\u0442\u0438 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u044e \u0432 \u041b\u041a2. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043d\u0430 \u0431\u044d\u043a\u0435\u043d\u0434\u0435 \u043d\u0443\u0436\u0435\u043d \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0439 \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c. \u0415\u0433\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0440\u0430\u0441\u0445\u043e\u0434\u044b, \u043d\u043e \u0432 \u0434\u0430\u043b\u044c\u043d\u0435\u0439\u0448\u0438\u043c \u0438 \u0434\u043b\u044f \u0434\u0440\u0443\u0433\u0438\u0445 \u0441\u043f\u043e\u0441\u043e\u0431\u043e\u0432 \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043d\u0438\u044f \u043f\u0440\u0438\u0433\u043e\u0434\u0438\u0442\u0441\u044f \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u044f, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u044d\u0442\u043e \u043d\u0435 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043e\u043a, \u0430 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u044c.<\/p>\n<p>\u041c\u0435\u0445\u0430\u043d\u0438\u0437\u043c \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u0438 \u0434\u043e\u043b\u0436\u0435\u043d \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0442\u044c \u043c\u043e\u0434\u0443\u043b\u044e \u0442\u043e\u043a\u0435\u043d, \u0434\u0430\u043b\u0435\u0435 \u0441 \u044d\u0442\u0438\u043c \u0442\u043e\u043a\u0435\u043d\u043e\u043c \u043c\u043e\u0434\u0443\u043b\u044c \u0445\u043e\u0434\u0438\u0442 \u0432 \u043d\u0430\u0448 API. \u0412 \u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0439 \u0441\u0432\u043e\u0435\u0439 \u0447\u0430\u0441\u0442\u0438 \u0431\u044d\u043a\u0435\u043d\u0434 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0438\u0437 \u0441\u0435\u0431\u044f proxy \u043a \u0443\u0436\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u043c \u0431\u044d\u043a\u0435\u043d\u0434-\u0441\u0435\u0440\u0432\u0438\u0441\u0430\u043c. \u0418 \u0447\u0430\u0449\u0435 \u0432\u0441\u0435\u0433\u043e \u043c\u043e\u0434\u0443\u043b\u044c \u0441\u043e\u0437\u0434\u0430\u0451\u0442 \u0434\u043b\u044f \u043d\u0435\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441. \u041d\u043e \u0432 \u044d\u0442\u043e\u043c \u0431\u044d\u043a\u0435\u043d\u0434-\u0441\u0435\u0440\u0432\u0438\u0441\u0435 \u0442\u043e\u0436\u0435 \u043d\u0443\u0436\u043d\u0430 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u044f, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u043d\u0435 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0442\u043e\u0433\u043e, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u043b\u0438 \u043c\u043e\u0434\u0443\u043b\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0438\u0437 \u0431\u044d\u043a\u0435\u043d\u0434\u0430 \u041b\u041a2, \u043e\u043d \u0434\u043e\u043b\u0436\u0435\u043d \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0442\u043e\u043a\u0435\u043d \u043a \u0446\u0435\u043b\u0435\u0432\u043e\u043c\u0443 \u0431\u044d\u043a\u0435\u043d\u0434-\u0441\u0435\u0440\u0432\u0438\u0441\u0443.<\/p>\n<p>\u0418\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0441\u0442\u044c <code>iframe<\/code> \u043f\u043e\u0432\u044b\u0448\u0430\u0435\u0442 \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430: \u0435\u0441\u043b\u0438 \u0432\u043d\u0443\u0442\u0440\u0438 \u043c\u043e\u0434\u0443\u043b\u044f \u0432\u0441\u0451 \u0441\u043b\u043e\u043c\u0430\u0435\u0442\u0441\u044f, \u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0443\u043f\u0430\u0434\u0451\u0442, \u044d\u0442\u043e \u043d\u0438\u043a\u0430\u043a \u043d\u0435 \u043f\u043e\u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u0440\u0430\u0431\u043e\u0442\u0443 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u041d\u043e \u0435\u0441\u0442\u044c \u0438 \u043e\u0431\u0440\u0430\u0442\u043d\u0430\u044f \u0441\u0442\u043e\u0440\u043e\u043d\u0430 \u043c\u0435\u0434\u0430\u043b\u0438: \u0441\u0438\u043b\u044c\u043d\u0430\u044f \u0438\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0441\u0442\u044c \u0443\u0441\u043b\u043e\u0436\u043d\u044f\u0435\u0442 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u043c\u043e\u0434\u0443\u043b\u044f \u0441 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c:<\/p>\n<ul>\n<li>\n<p>\u0420\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u043e\u0431\u0449\u0430\u0435\u0442\u0441\u044f \u0441 iframe \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <a href=\"https:\/\/developer.mozilla.org\/ru\/docs\/Web\/API\/Window\/postMessage\">postMessage<\/a>. \u042d\u0442\u043e \u0437\u043d\u0430\u0447\u0438\u0442, \u0447\u0442\u043e, \u043d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0439, \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u044b\u0432\u0430\u0442\u044c \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u043e\u0433\u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043c\u043e\u0434\u0443\u043b\u044f \u0438 \u044f\u0434\u0440\u0430. \u042d\u0442\u043e \u044f\u0432\u043d\u043e \u043c\u0435\u043d\u0435\u0435 \u0443\u0434\u043e\u0431\u043d\u043e, \u0447\u0435\u043c, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, React-\u043f\u0440\u043e\u043f\u0441\u044b.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432\u043d\u0435 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430 \u044f\u0434\u0440\u0430, \u0432 \u043d\u0435\u0433\u043e \u0441\u043b\u043e\u0436\u043d\u043e \u0431\u0435\u0441\u0448\u043e\u0432\u043d\u043e \u0438\u043d\u0442\u0435\u0433\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0440\u043e\u0443\u0442\u0438\u043d\u0433, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0434\u0440\u0443\u0433\u0438\u0435 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p>\u0412\u043e\u0437\u0440\u0430\u0441\u0442\u0430\u0435\u0442 \u0438\u043d\u0442\u0435\u043d\u0441\u0438\u0432\u043d\u043e\u0441\u0442\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f API: \u0434\u0430\u043d\u043d\u044b\u0435, \u0443\u0436\u0435 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u043d\u044b\u0435 \u0432 <code>lk2<\/code>, \u0434\u043e\u043b\u0436\u043d\u044b \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0437\u0430\u043f\u0440\u0430\u0448\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u0432 <code>iframe<\/code>. \u041c\u043e\u0436\u043d\u043e, \u043a\u043e\u043d\u0435\u0447\u043d\u043e, \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0447\u0435\u0440\u0435\u0437 <code>postMessage<\/code>, \u043d\u043e \u043a\u0430\u0436\u0435\u0442\u0441\u044f, \u0447\u0442\u043e \u044d\u0442\u043e \u0435\u0449\u0451 \u0441\u043b\u043e\u0436\u043d\u0435\u0435.<\/p>\n<\/li>\n<li>\n<p>\u0421\u043b\u043e\u0436\u043d\u043e \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c \u0432 \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u043e\u043c \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0438 \u0432\u043d\u0435\u0448\u043d\u0438\u0439 \u0432\u0438\u0434 \u0438 \u043a\u043e\u0440\u043d\u0435\u0432\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b: \u043f\u0440\u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0438 <code>@five\/uikit<\/code> \u043a\u043e\u043c\u0430\u043d\u0434\u0430 \u043c\u043e\u0434\u0443\u043b\u044f \u0434\u043e\u043b\u0436\u043d\u0430 \u0430\u043a\u0442\u0443\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u0435\u0440\u0441\u0438\u044e \u043f\u0430\u043a\u0435\u0442\u0430. \u041c\u043e\u0436\u0435\u0442 \u043f\u043e\u044f\u0432\u0438\u0442\u044c\u0441\u044f \u0440\u0430\u0441\u0445\u043e\u0436\u0434\u0435\u043d\u0438\u0435.<\/p>\n<\/li>\n<\/ul>\n<p>\u0412 \u0441\u043b\u0443\u0447\u0430\u0435 \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043d\u0438\u044f \u0447\u0435\u0440\u0435\u0437 <code>iframe<\/code> \u043c\u043e\u0434\u0443\u043b\u044c \u2014\u00a0\u044d\u0442\u043e \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u0441\u0435\u0440\u0432\u0438\u0441. \u041a\u043e\u043c\u0430\u043d\u0434\u0430 \u043c\u0435\u043d\u0435\u0435 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u0430 \u0441\u0442\u0435\u043a\u043e\u043c \u043a\u043e\u0440\u043d\u0435\u0432\u043e\u0433\u043e \u043c\u043e\u0434\u0443\u043b\u044f, \u043e\u043d\u0430 \u043c\u043e\u0436\u0435\u0442 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 CI\/CD. \u042d\u0442\u043e \u043f\u043b\u044e\u0441, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u0434\u0430\u0451\u0442 \u0431\u043e\u043b\u044c\u0448\u0443\u044e \u0441\u0432\u043e\u0431\u043e\u0434\u0443 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439. \u041d\u043e \u044d\u0442\u043e \u0438 \u043c\u0438\u043d\u0443\u0441, \u0442\u0430\u043a \u043a\u0430\u043a \u043a\u043e\u043c\u0430\u043d\u0434\u0435 \u043d\u0443\u0436\u043d\u044b \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b:<\/p>\n<ul>\n<li>\n<p>\u043d\u0443\u0436\u043d\u043e \u0432\u044b\u0434\u0435\u043b\u0438\u0442\u044c \u0441\u0435\u0440\u0432\u0435\u0440\u0430, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0431\u0443\u0434\u0435\u0442 \u0445\u043e\u0441\u0442\u0438\u0442\u044c\u0441\u044f \u0441\u0435\u0440\u0432\u0438\u0441;<\/p>\n<\/li>\n<li>\n<p>\u0447\u0442\u043e\u0431\u044b \u0440\u0430\u0437\u043b\u043e\u0436\u0438\u0442\u044c \u0441\u0435\u0440\u0432\u0438\u0441, \u043d\u0443\u0436\u043d\u043e \u0437\u0430\u0442\u0440\u0430\u0442\u0438\u0442\u044c \u0443\u0441\u0438\u043b\u0438\u044f \u043d\u0430 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0443 \u0438\u043d\u0444\u0440\u0430\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u044b.<\/p>\n<\/li>\n<\/ul>\n<p>\u0412\u0430\u0436\u043d\u044b\u0439 \u043f\u043b\u044e\u0441 \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043d\u0438\u044f \u0447\u0435\u0440\u0435\u0437 <code>iframe<\/code> \u2014 \u044d\u0442\u043e\u0442 \u043f\u043e\u0434\u0445\u043e\u0434 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u044f\u0442\u044c \u043c\u043e\u0434\u0443\u043b\u0438 \u0431\u0435\u0437 \u043f\u0440\u0438\u0432\u043b\u0435\u0447\u0435\u043d\u0438\u044f \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0435\u0440\u043e\u0432 \u043a\u043e\u043c\u0430\u043d\u0434\u044b \u041b\u041a2: \u0434\u043b\u044f \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043d\u0438\u044f \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0432 \u043f\u0430\u043d\u0435\u043b\u0438 \u0430\u0434\u043c\u0438\u043d\u0438\u0441\u0442\u0440\u0430\u0442\u043e\u0440\u0430 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0435\u0449\u0451 \u043e\u0434\u0438\u043d \u0440\u0430\u0437\u0434\u0435\u043b \u0441\u043e \u0441\u0441\u044b\u043b\u043a\u043e\u0439, \u0438 \u043e\u043d \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u043e\u044f\u0432\u0438\u0442\u0441\u044f \u0432 \u043f\u0440\u043e\u0435\u043a\u0442\u0435. \u0422\u0430\u043a \u0436\u0435 \u0438 \u0441 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435\u043c: \u043a\u043e\u043c\u0430\u043d\u0434\u0430 \u043c\u043e\u0434\u0443\u043b\u044f \u043f\u0440\u043e\u0441\u0442\u043e \u0440\u0430\u0441\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0435\u0442 \u043d\u043e\u0432\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u044d\u0442\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043e\u043f\u0435\u0440\u0430\u0442\u0438\u0432\u043d\u043e, \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442 \u043a\u043e\u043c\u0430\u043d\u0434\u044b \u041b\u041a2, \u043e\u043a\u0430\u0437\u044b\u0432\u0430\u044e\u0442\u0441\u044f \u0432 \u043f\u0440\u043e\u0434\u0430\u043a\u0448\u0435\u043d\u0435. \u041f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u043e \u0440\u0430\u0441\u0442\u0451\u0442, \u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u043e\u043d\u0438 \u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u0447\u0430\u0441\u0442\u043e, \u044d\u0442\u0430 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u044c \u043e\u0447\u0435\u043d\u044c \u043f\u043e\u043b\u0435\u0437\u043d\u0430. \u0421\u043b\u0435\u0434\u0443\u0435\u0442 \u0443\u0447\u0435\u0441\u0442\u044c, \u0447\u0442\u043e \u0432 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0441\u0442\u044c \u0438 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c \u0437\u0430 \u0440\u0430\u0431\u043e\u0442\u043e\u0441\u043f\u043e\u0441\u043e\u0431\u043d\u043e\u0441\u0442\u044c\u044e \u043c\u043e\u0434\u0443\u043b\u044f \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043b\u0435\u0436\u0438\u0442 \u043d\u0430 \u043a\u043e\u043c\u0430\u043d\u0434\u0435, \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0449\u0435\u0439 \u0435\u0433\u043e.<\/p>\n<p>\u0421\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u043d\u0430\u0447\u0438\u043d\u0430\u044e\u0442\u0441\u044f, \u043a\u043e\u0433\u0434\u0430 \u043c\u043e\u0434\u0443\u043b\u044c \u0434\u043e\u043b\u0436\u0435\u043d \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u043e\u0434\u043d\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430. \u041f\u0440\u0438\u0432\u0435\u0434\u0443 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0439 \u043f\u0440\u0438\u043c\u0435\u0440: \u0432 \u043b\u0438\u0447\u043d\u043e\u043c \u043a\u0430\u0431\u0438\u043d\u0435\u0442\u0435 \u0435\u0441\u0442\u044c \u0433\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u044b \u0432\u0438\u0434\u0436\u0435\u0442\u044b \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0440\u0430\u0437\u0434\u0435\u043b\u043e\u0432. <a href=\"#main_screen\">\u041d\u0430 \u0440\u0438\u0441\u0443\u043d\u043a\u0435 \u0432\u044b\u0448\u0435<\/a> \u043c\u043e\u0436\u043d\u043e \u0432\u0438\u0434\u0435\u0442\u044c \u0432\u0438\u0434\u0436\u0435\u0442\u044b \u0440\u0430\u0437\u0434\u0435\u043b\u043e\u0432 &#171;\u0414\u0435\u043d\u044c\u0433\u0438&#187;, &#171;\u0413\u0440\u0430\u0444\u0438\u043a \u0440\u0430\u0431\u043e\u0442\u044b&#187; \u0438 &#171;\u0417\u0430\u0434\u0430\u0447\u0438&#187;. \u0415\u0441\u043b\u0438 \u043c\u043e\u0434\u0443\u043b\u044c \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0447\u0435\u0440\u0435\u0437 <code>iframe<\/code>, \u043d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u0434\u0443\u043c\u044b\u0432\u0430\u0442\u044c \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c\u044b \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432: \u0432\u0438\u0434\u0436\u0435\u0442\u0430 \u0438 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043c\u043e\u0434\u0443\u043b\u044f. \u042d\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0434\u0434\u043e\u043c\u0435\u043d\u044b \u0438\u043b\u0438 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432 \u043f\u0443\u0442\u0438, \u043d\u043e \u0432 \u043b\u044e\u0431\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u044d\u0442\u043e \u043d\u0435 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0443\u0434\u043e\u0431\u043d\u043e.<\/p>\n<h4>\u0418\u0442\u043e\u0433\u0438 \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043d\u0438\u044f \u0447\u0435\u0440\u0435\u0437 iframe<\/h4>\n<p><strong>\u041f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430:<\/strong><\/p>\n<ul>\n<li>\n<p>\u041e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043f\u0440\u043e\u0441\u0442\u043e\u0442\u0430 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0439 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438;<\/p>\n<\/li>\n<li>\n<p>\u0418\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0441\u0442\u044c, \u0430 \u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e, \u043d\u0430\u0434\u0435\u0436\u043d\u043e\u0441\u0442\u044c;<\/p>\n<\/li>\n<li>\n<p>\u0421\u0432\u043e\u0431\u043e\u0434\u0430 \u0432\u044b\u0431\u043e\u0440\u0430 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0439;<\/p>\n<\/li>\n<li>\n<p>\u041d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u044c \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043c\u043e\u0434\u0443\u043b\u044f.<\/p>\n<\/li>\n<\/ul>\n<p><strong>\u041d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0438:<\/strong><\/p>\n<ul>\n<li>\n<p>\u0421\u043b\u043e\u0436\u043d\u043e\u0435 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 <code>lk2<\/code> \u0438 \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c\u043e\u0433\u043e \u043c\u043e\u0434\u0443\u043b\u044f;<\/p>\n<\/li>\n<li>\n<p>\u041e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u0435 \u043e\u0431\u0449\u0435\u0433\u043e \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0434\u043b\u044f \u0440\u043e\u0443\u0442\u0438\u043d\u0433\u0430;<\/p>\n<\/li>\n<li>\n<p>\u0412 \u043f\u0430\u043a\u0435\u0442\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e <code>@five\/uikit<\/code>;<\/p>\n<\/li>\n<li>\n<p>\u0418\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0441\u0442\u044c \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0438\u0432\u0435\u0441\u0442\u0438 \u043a \u043f\u043e\u0442\u0435\u0440\u0435 \u0432\u0437\u0430\u0438\u043c\u043e\u0437\u0430\u043c\u0435\u043d\u044f\u0435\u043c\u043e\u0441\u0442\u0438 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u043e\u0432;<\/p>\n<\/li>\n<li>\n<p>\u0414\u043b\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u043c\u043e\u0434\u0443\u043b\u044f \u0442\u0440\u0435\u0431\u0443\u044e\u0442\u0441\u044f \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b: <\/p>\n<ul>\n<li>\n<p>\u0418\u043d\u0444\u0440\u0430\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 prod \/ test;<\/p>\n<\/li>\n<li>\n<p>\u041a\u043e\u043c\u043f\u0435\u0442\u0435\u043d\u0446\u0438\u0438;<\/p>\n<\/li>\n<li>\n<p>\u0412\u0440\u0435\u043c\u044f \u043d\u0430 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0443 CI\/CD.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p>\u0421\u043b\u043e\u0436\u043d\u043e \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0441\u0440\u0430\u0437\u0443 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0438\u0437 \u043f\u0430\u043a\u0435\u0442\u0430.<\/p>\n<\/li>\n<\/ul>\n<p>\u0412 \u0438\u0442\u043e\u0433\u0435 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0438 \u043f\u0435\u0440\u0435\u0432\u0435\u0441\u0438\u043b\u0438 \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430, \u0438 \u043c\u044b \u043f\u0435\u0440\u0435\u0448\u043b\u0438 \u043a \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c\u0443 \u043f\u043e\u0434\u0445\u043e\u0434\u0443, \u0443\u0441\u043f\u0435\u0432 \u0432\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <code>iframe<\/code> \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u0438\u043d \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u043c\u043e\u0434\u0443\u043b\u044c.<\/p>\n<p>\u0414\u0430\u043b\u044c\u0448\u0435 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u0435\u0439!<\/p>\n<p><a class=\"anchor\" name=\"npm\" id=\"npm\"><\/a><\/p>\n<h3>NPM-\u043f\u0430\u043a\u0435\u0442\u044b<\/h3>\n<p>\u0421\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u0448\u0430\u0433\u043e\u043c \u043c\u044b \u0440\u0435\u0448\u0438\u043b\u0438 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0442\u044c \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u044b \u043a\u0430\u043a NPM-\u043f\u0430\u043a\u0435\u0442\u044b. \u042d\u0442\u043e\u043c\u0443 \u0441\u043f\u043e\u0441\u043e\u0431\u0441\u0442\u0432\u043e\u0432\u0430\u043b\u043e \u0442\u043e, \u0447\u0442\u043e \u0443 \u043d\u0430\u0441 \u0443\u0436\u0435 \u0431\u044b\u043b  <code>@five\/uikit<\/code>, \u043e\u0441\u0442\u0430\u0432\u0430\u043b\u043e\u0441\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c <code>@five\/core<\/code>.<\/p>\n<p>\u0423 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u0447\u0435\u0440\u0435\u0437 NPM-\u043f\u0430\u043a\u0435\u0442\u044b \u0435\u0441\u0442\u044c \u0432\u0430\u0436\u043d\u044b\u0435 \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430:<\/p>\n<p><strong>\u041f\u0440\u043e\u0441\u0442\u043e\u0442\u0430 \u043f\u0435\u0440\u0432\u043e\u0439 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438<\/strong> \u2014\u00a0\u0433\u0440\u0443\u0431\u044b\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442: \u043a\u043e\u043f\u0438\u0440\u0443\u0435\u043c \u043a\u043e\u043d\u0444\u0438\u0433\u0438 \u0438\u0437 \u0443\u0436\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0435\u0433\u043e \u043f\u0430\u043a\u0435\u0442\u0430 \u0438 \u0432\u0441\u0451 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442!<\/p>\n<p><strong>\u041d\u0435 \u043d\u0443\u0436\u043d\u044b \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 DevOps-\u0440\u0435\u0441\u0443\u0440\u0441\u044b.<\/strong><\/p>\n<p>\u0422\u0435\u0445\u043d\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u0435\u0440\u0441\u0438\u044f NPM-\u043f\u0430\u043a\u0435\u0442\u0430 \u2014\u00a0\u044d\u0442\u043e \u043f\u0440\u043e\u0441\u0442\u043e \u0430\u0440\u0445\u0438\u0432 \u0441\u043e\u0431\u0440\u0430\u043d\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430, \u043b\u0435\u0436\u0430\u0449\u0438\u0439 \u0432 NPM-registry, \u0430 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u044f \u043e\u0447\u0435\u0440\u0435\u0434\u043d\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 \u2014\u00a0\u044d\u0442\u043e \u043f\u0440\u043e\u0441\u0442\u043e \u0432\u044b\u0437\u043e\u0432 \u043a\u043e\u043c\u0430\u043d\u0434\u044b <code>yarn publish<\/code>. \u0412 \u0438\u0442\u043e\u0433\u0435 NPM-\u043f\u0430\u043a\u0435\u0442 \u043f\u043e\u043f\u0430\u0434\u0430\u0435\u0442 \u0432 \u0441\u0431\u043e\u0440\u043a\u0443 \u041b\u041a2. \u042d\u0442\u043e \u0437\u043d\u0430\u0447\u0438\u0442, \u0447\u0442\u043e \u0432 \u043e\u0442\u043b\u0438\u0447\u0438\u0435 \u043e\u0442 \u043f\u043e\u0434\u0445\u043e\u0434\u0430 \u0441 <code>iframe<\/code>, \u043d\u0435 \u043d\u0443\u0436\u043d\u044b \u0441\u0435\u0440\u0432\u0435\u0440\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u0442\u0434\u0430\u0432\u0430\u043b\u0438 \u0431\u044b \u0441\u0442\u0430\u0442\u0438\u043a\u0443 \u043c\u043e\u0434\u0443\u043b\u044f. \u0411\u043e\u043b\u0435\u0435 \u0442\u043e\u0433\u043e, \u043e\u0447\u0435\u043d\u044c \u043f\u0440\u043e\u0441\u0442\u043e \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u043f\u0430\u0439\u043f\u043b\u0430\u0439\u043d, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043e\u0431\u0438\u0440\u0430\u043b \u0431\u044b \u043c\u043e\u0434\u0443\u043b\u044c \u0438 \u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u043b \u043d\u043e\u0432\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e.<\/p>\n<p><strong>\u041d\u0435 \u0434\u0443\u0431\u043b\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043a\u043e\u0434 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a<\/strong>, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445 \u0441\u0440\u0430\u0437\u0443 \u0432 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u043f\u0430\u043a\u0435\u0442\u0430\u0445.<\/p>\n<details class=\"spoiler\">\n<summary>\u0421\u043f\u0440\u0430\u0432\u043a\u0430, \u043a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442 dependencies, devDependencies \u0438 peerDependencies.<\/summary>\n<div class=\"spoiler__content\">\n<p>\u0412 <code>package.json<\/code> \u0435\u0441\u0442\u044c \u0442\u0440\u0438 \u0441\u0435\u043a\u0446\u0438\u0438 \u0441 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u044f\u043c\u0438. \u0420\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043c\u043e\u0434\u0443\u043b\u044f <code>@five\/someModule<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 <code>react<\/code> \u0438 \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u0442\u0441\u044f \u0441\u0431\u043e\u0440\u0449\u0438\u043a\u043e\u043c <code>rollup<\/code>.<\/p>\n<pre><code class=\"json\">{   \"name\": \"@five\/someModule\",   \"version\": \"1.0.0\",   \"dependencies\": {     \"react\": \"17.0.1\"   },   \"devDependencies\": {     \"rollup\": \"2.0.4\"   },   \"peerDependencies\": {     \"react\": \">=17\"   } }<\/code><\/pre>\n<p><strong>dependencies<br \/><\/strong>\u0417\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u0438\u0437 <code>dependencies<\/code> \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u044e\u0442\u0441\u044f <strong>\u0442\u0440\u0430\u043d\u0437\u0438\u0442\u0438\u0432\u043d\u043e<\/strong> \u043f\u0440\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0435 \u043f\u0430\u043a\u0435\u0442\u0430.<\/p>\n<pre><code class=\"bash\"># \u041f\u043e\u0442\u044f\u043d\u0435\u0442 \u0437\u0430 \u0441\u043e\u0431\u043e\u0439 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u044c react, # \u0442.\u043a. \u043e\u043d\u0430 \u0443\u043a\u0430\u0437\u0430\u043d\u0430 \u0432 dependencies yarn add @five\/someModule<\/code><\/pre>\n<p><strong>devDependencies<br \/><\/strong>\u0417\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u0438\u0437 \u0434\u0430\u043d\u043d\u043e\u0439 \u0441\u0435\u043a\u0446\u0438\u0438 <strong>\u043d\u0435 \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u0442\u0440\u0430\u043d\u0437\u0438\u0442\u0438\u0432\u043d\u043e<\/strong>. \u042d\u0442\u043e \u0437\u043d\u0430\u0447\u0438\u0442, \u0447\u0442\u043e \u0432 <code>devDependnecies<\/code> \u043c\u043e\u0436\u043d\u043e \u0443\u043a\u0430\u0437\u0430\u0442\u044c <code>rollup<\/code> \u0438 \u043f\u0440\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0435 \u043c\u043e\u0434\u0443\u043b\u044f \u044d\u0442\u043e\u0442 \u043f\u0430\u043a\u0435\u0442 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d \u043d\u0435 \u0431\u0443\u0434\u0435\u0442.<\/p>\n<pre><code class=\"bash\"># Rollup \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d \u043d\u0435 \u0431\u0443\u0434\u0435\u0442, \u0442.\u043a. \u043e\u043d \u0443\u043a\u0430\u0437\u0430\u043d \u0432 devDependencies yarn add @five\/someModule<\/code><\/pre>\n<p><strong>peerDependencies<br \/><\/strong>\u0414\u0430\u043d\u043d\u0430\u044f \u0441\u0435\u043a\u0446\u0438\u044f \u043d\u0443\u0436\u043d\u0430 \u0434\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u0434\u0435\u043a\u043b\u0430\u0440\u0430\u0442\u0438\u0432\u043d\u043e \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u043f\u0430\u043a\u0435\u0442\u044b \u0438 \u0438\u0445 \u0432\u0435\u0440\u0441\u0438\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0443\u0436\u043d\u044b \u0434\u043b\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u043c\u043e\u0439 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438. \u0415\u0441\u043b\u0438 \u043f\u0430\u043a\u0435\u0442 <code>react<\/code> \u0443\u043a\u0430\u0436\u0435\u043c \u0432 <code>peerDependencies<\/code>, \u0442\u043e \u043f\u0440\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0435 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 \u0443\u0432\u0438\u0434\u0438\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435 \u0441 \u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c React.<\/p>\n<pre><code class=\"bash\"># \u0423\u0432\u0438\u0434\u0438\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435 \u0441 \u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c React yarn add @five\/someModule<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n<p>\u0412 \u043d\u0430\u0448\u0435\u043c \u043f\u043e\u0434\u0445\u043e\u0434\u0435 \u0432\u0441\u0435 \u043f\u0430\u043a\u0435\u0442\u044b \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0432 \u0441\u0435\u043a\u0446\u0438\u0438 <code>devDependecies<\/code>, \u0430 <code>dependencies<\/code> \u043f\u0443\u0441\u0442. \u0412\u0441\u0435 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442 \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0435 (<code>@five\/core<\/code>, <code>@five\/uikit<\/code>, <code>react<\/code>, <code>mobx<\/code> \u0438 \u0434\u0440\u0443\u0433\u0438\u0435), \u043f\u043e\u043c\u0438\u043c\u043e <code>devDependecies<\/code> \u0443\u043a\u0430\u0437\u0430\u043d\u044b \u0438 \u0432 <code>peerDependecies<\/code>. \u0423\u0436\u0435 \u0432\u043d\u0443\u0442\u0440\u0438 \u043f\u0430\u043a\u0435\u0442\u0430 <code>lk2<\/code> \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u044f\u0432\u043d\u043e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c, \u043e\u0442 \u043a\u0430\u043a\u0438\u0445 \u043f\u0430\u043a\u0435\u0442\u043e\u0432 \u0437\u0430\u0432\u0438\u0441\u044f\u0442 \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c\u044b\u0435 \u043c\u043e\u0434\u0443\u043b\u0438 \u0438 \u0432 \u043a\u0430\u043a\u0438\u0445 \u0432\u0435\u0440\u0441\u0438\u044f\u0445 \u044d\u0442\u0438 \u043f\u0430\u043a\u0435\u0442\u044b \u043d\u0443\u0436\u043d\u044b. \u041d\u0438\u0447\u0435\u0433\u043e \u043d\u0435 \u043f\u043e\u0434\u0442\u044f\u043d\u0435\u0442\u0441\u044f \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0431\u0435\u0437 \u043d\u0430\u0448\u0435\u0433\u043e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044f.<\/p>\n<p>\u0412 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u0445 Rollup \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u043f\u043b\u0430\u0433\u0438\u043d <code>rollup-plugin-peer-deps-external<\/code>. \u042d\u0442\u043e\u0442 \u043f\u043b\u0430\u0433\u0438\u043d \u0438\u0441\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u0438\u0437 \u0431\u0430\u043d\u0434\u043b\u0430 \u043c\u043e\u0434\u0443\u043b\u044f \u043a\u043e\u0434 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a, \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u044b\u0445 \u0432 <code>peerDependecies<\/code>. \u0412 \u0438\u0442\u043e\u0433\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u0435 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u044b \u0432 <code>lk2<\/code>. \u042d\u0442\u043e \u043f\u043e\u043b\u043e\u0436\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u0438\u0442\u043e\u0433\u043e\u0432\u044b\u0439 \u0440\u0430\u0437\u043c\u0435\u0440 \u0431\u0430\u043d\u0434\u043b\u0430.<\/p>\n<p><strong>\u0412\u0435\u0440\u0441\u0438\u0438 <\/strong><code>@five\/core<\/code> \u0438 <code>@five\/uikit<\/code> \u0432\u0441\u0435\u0433\u0434\u0430 \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u044b, \u0434\u0430\u0436\u0435 \u0435\u0441\u043b\u0438 \u043a\u043e\u043c\u0430\u043d\u0434\u0430 \u043d\u0435 \u0443\u0441\u043f\u0435\u043b\u0430 \u0430\u043a\u0442\u0443\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u0435\u0440\u0441\u0438\u044e \u0432 \u0441\u0432\u043e\u0451\u043c \u043c\u043e\u0434\u0443\u043b\u0435. \u041f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u0432 \u0431\u0430\u043d\u0434\u043b \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430 \u043d\u0435 \u043f\u043e\u043f\u0430\u0434\u0430\u044e\u0442 <code>@five\/core<\/code> \u0438 <code>@five\/uikit<\/code>, \u044d\u0442\u0438 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u0431\u0435\u0440\u0443\u0442\u0441\u044f \u0438\u0437 \u043f\u0430\u043a\u0435\u0442\u0430 <code>lk2<\/code>. \u0410 \u0442.\u043a. \u043f\u0440\u043e\u0435\u043a\u0442 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u0430\u043d \u0432 \u0432\u0438\u0434\u0435 \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f, \u0442\u043e \u043a\u043e\u0434 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a \u0431\u0435\u0440\u0451\u0442\u0441\u044f \u0438\u0437 \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430, \u0430 \u043d\u0435 \u0438\u0437 NPM-registry.<\/p>\n<p><strong>\u0418\u0437 \u043c\u043e\u0434\u0443\u043b\u044f \u043b\u0435\u0433\u043a\u043e \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c  \u0441\u0440\u0430\u0437\u0443 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432.<\/strong><\/p>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c\u043e\u0433\u043e \u043c\u043e\u0434\u0443\u043b\u044f \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0433\u043e\u0440\u0430\u0437\u0434\u043e \u043f\u0440\u043e\u0449\u0435, \u0447\u0435\u043c \u0432 \u0441\u043b\u0443\u0447\u0430\u0435 \u0441 <code>iframe<\/code>:<\/p>\n<pre><code class=\"javascript\">import { SomePage, SomeWidget } from '@five\/someModule';<\/code><\/pre>\n<p><strong>\u0423\u0434\u043e\u0431\u043d\u043e\u0435 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u043c\u043e\u0434\u0443\u043b\u044f \u0441 \u041b\u041a2.<\/strong><\/p>\n<p>\u041c\u043e\u0434\u0443\u043b\u044c \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u0442 \u043e\u0431\u044b\u0447\u043d\u044b\u0435 React-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b. \u042d\u0442\u043e \u0437\u043d\u0430\u0447\u0438\u0442, \u0447\u0442\u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u043d\u0438\u043c \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432\u0441\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0438\u0437 React: \u043e\u0431\u0449\u0438\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u0434\u043b\u044f \u0440\u043e\u0443\u0442\u0438\u043d\u0433\u0430, \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u0438, \u0441\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0438, \u0434\u0430\u043d\u043d\u044b\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u0412 \u0441\u0430\u043c\u043e\u043c \u043f\u0440\u043e\u0441\u0442\u043e\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0435, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043f\u0440\u043e\u043f\u0441\u044b! \u041a\u0430\u043a \u043c\u0430\u043b\u043e \u043d\u0443\u0436\u043d\u043e \u0434\u043b\u044f \u0443\u0434\u043e\u0431\u043d\u043e\u0433\u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f)<\/p>\n<p>\u0411\u043e\u043b\u044c\u0448\u0438\u043d\u0441\u0442\u0432\u043e \u043a\u043e\u043c\u0430\u043d\u0434 \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442 \u043c\u043e\u0434\u0443\u043b\u044c \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c Typescript, \u0447\u0442\u043e \u0434\u0430\u0451\u0442 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432 \u043f\u0440\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0435 \u043c\u043e\u0434\u0443\u043b\u044f. \u041d\u043e \u0434\u043b\u044f \u043d\u0430\u0441 \u044d\u0442\u043e \u0432\u0430\u0436\u043d\u043e \u0442\u0435\u043c, \u0447\u0442\u043e \u043f\u0440\u0438 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0438 \u043f\u0430\u043a\u0435\u0442\u0430 \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0435\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441. \u042d\u0442\u043e \u0441\u0438\u043b\u044c\u043d\u043e \u0443\u043f\u0440\u043e\u0449\u0430\u0435\u0442 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u043a\u043e\u043c\u0430\u043d\u0434 \u0438 \u043f\u043e\u0432\u044b\u0448\u0430\u0435\u0442 \u043d\u0430\u0434\u0451\u0436\u043d\u043e\u0441\u0442\u044c \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u043d\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u044b.<\/p>\n<p>\u0422\u0440\u0435\u0431\u043e\u0432\u0430\u043d\u0438\u044f \u043a \u0435\u0434\u0438\u043d\u043e\u043c\u0443 \u0441\u0442\u0435\u043a\u0443 \u043f\u043e\u0432\u044b\u0448\u0430\u044e\u0442 <strong>\u0432\u0437\u0430\u0438\u043c\u043e\u0437\u0430\u043c\u0435\u043d\u044f\u0435\u043c\u043e\u0441\u0442\u044c \u043a\u043e\u043c\u0430\u043d\u0434<\/strong>.<\/p>\n<p><strong>\u0415\u0434\u0438\u043d\u0430\u044f \u0442\u043e\u0447\u043a\u0430 \u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0441\u0442\u0438.<\/strong><\/p>\n<p>\u0412 \u043e\u0442\u043b\u0438\u0447\u0438\u0435 \u043e\u0442 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430 \u0441 <code>iframe<\/code>, \u043a\u043e\u043c\u0430\u043d\u0434\u0430 \u041b\u041a2 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0438\u0440\u0443\u0435\u0442 \u043f\u0440\u043e\u0446\u0435\u0441\u0441 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u043c\u043e\u0434\u0443\u043b\u044f, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0435\u0433\u043e \u0444\u0438\u043d\u0430\u043b\u044c\u043d\u0443\u044e \u0440\u0430\u0431\u043e\u0442\u0443. \u041c\u044b \u043e\u0431\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0435\u043c \u043c\u043e\u0434\u0443\u043b\u044c \u0432 <a href=\"https:\/\/ru.reactjs.org\/docs\/error-boundaries.html\">Error Boundary<\/a>. \u0415\u0441\u043b\u0438 \u043f\u0430\u0439\u043f\u043b\u0430\u0439\u043d \u0441 \u043f\u0430\u043a\u0435\u0442\u043e\u043c \u0443\u043f\u0430\u0434\u0451\u0442, \u0442\u043e \u0441\u043b\u043e\u043c\u0430\u043d\u043d\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c \u043d\u0435 \u043f\u043e\u043f\u0430\u0434\u0451\u0442 \u0432 \u043f\u0440\u043e\u0434\u0430\u043a\u0448\u0435\u043d. \u0411\u043e\u043b\u0435\u0435 \u0442\u043e\u0433\u043e, \u043f\u0435\u0440\u0435\u0434 \u0440\u0435\u043b\u0438\u0437\u043e\u043c \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0440\u043e\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0440\u0430\u0431\u043e\u0442\u043e\u0441\u043f\u043e\u0441\u043e\u0431\u043d\u043e\u0441\u0442\u044c \u043c\u043e\u0434\u0443\u043b\u044f.<\/p>\n<h4>\u041d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0438 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e NPM-\u043f\u0430\u043a\u0435\u0442\u043e\u0432<\/h4>\n<p>\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u044b \u043d\u0438\u0436\u0435, \u0437\u0430\u0441\u0442\u0430\u0432\u0438\u043b\u0438 \u0437\u0430\u0434\u0443\u043c\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u043e \u043d\u043e\u0432\u043e\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0435 \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043d\u0438\u044f:<\/p>\n<p><strong>\u0414\u043b\u0438\u043d\u043d\u0430\u044f \u0446\u0435\u043f\u043e\u0447\u043a\u0430 \u043f\u043e\u043f\u0430\u0434\u0430\u043d\u0438\u044f \u043c\u043e\u0434\u0443\u043b\u044f \u0432 \u043f\u0440\u043e\u0434\u0430\u043a\u0448\u0435\u043d.<\/strong><\/p>\n<p>\u041f\u0440\u043e\u0446\u0435\u0441\u0441 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u043c\u043e\u0434\u0443\u043b\u044f \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n<ol>\n<li>\n<p>\u041a\u043e\u043c\u0430\u043d\u0434\u0430 \u043c\u043e\u0434\u0443\u043b\u044f \u043f\u0443\u0431\u043b\u0438\u043a\u0443\u0435\u0442 \u043d\u043e\u0432\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e \u0438 \u0441\u043e\u043e\u0431\u0449\u0430\u0435\u0442 \u043e\u0431 \u044d\u0442\u043e\u043c \u043d\u0430\u0448\u0435\u043c\u0443 \u043c\u0435\u043d\u0435\u0434\u0436\u0435\u0440\u0443;<\/p>\n<\/li>\n<li>\n<p>\u041c\u0435\u043d\u0435\u0434\u0436\u0435\u0440 \u041b\u041a2 \u0437\u0430\u0432\u043e\u0434\u0438\u0442 \u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0437\u0430\u0434\u0430\u0447\u0443 \u043d\u0430 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430;<\/p>\n<\/li>\n<li>\n<p>\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0434\u0435\u043b\u0430\u0435\u0442 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u0443\u044e \u0432\u0435\u0442\u043a\u0443 \u0441 \u043d\u043e\u0432\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0435\u0439 \u043f\u0430\u043a\u0435\u0442\u0430, \u0440\u0430\u0441\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0435\u0442 \u0432\u0435\u0442\u043a\u0443 \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f;<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c, \u0447\u0442\u043e \u0432\u0441\u0451 \u0441\u043e\u0431\u0440\u0430\u043b\u043e\u0441\u044c, \u0432\u0435\u0442\u043a\u0430 \u0440\u0430\u0437\u043b\u043e\u0436\u0438\u043b\u0430\u0441\u044c, \u043f\u0430\u043a\u0435\u0442 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442;<\/p>\n<\/li>\n<li>\n<p>\u0416\u0434\u0451\u043c \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0438 \u043e\u0434\u043e\u0431\u0440\u0435\u043d\u0438\u044f \u043c\u0435\u043d\u0435\u0434\u0436\u0435\u0440\u043e\u0432;<\/p>\n<\/li>\n<li>\n<p>\u0412\u043b\u0438\u0432\u0430\u0435\u043c \u0432\u0435\u0442\u043a\u0443 \u0432 <code>dev<\/code>, \u0436\u0434\u0451\u043c \u0440\u0435\u043b\u0438\u0437\u0430 (\u0438\u043b\u0438 \u0441\u0442\u0430\u0440\u0442\u0443\u0435\u043c \u0440\u0435\u043b\u0438\u0437 \u0442\u043e\u043b\u044c\u043a\u043e \u0440\u0430\u0434\u0438 \u043d\u043e\u0432\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0438);<\/p>\n<\/li>\n<li>\n<p>\u0412\u043b\u0438\u0432\u0430\u0435\u043c <code>dev<\/code> \u0432 <code>master<\/code> \u0438 \u0437\u0430\u0432\u043e\u0434\u0438\u043c \u0440\u0435\u043b\u0438\u0437\u043d\u0443\u044e \u0432\u0435\u0442\u043a\u0443;<\/p>\n<\/li>\n<li>\n<p>\u041f\u0443\u0431\u043b\u0438\u043a\u0443\u0435\u043c \u0440\u0435\u043b\u0438\u0437.<\/p>\n<\/li>\n<\/ol>\n<p>\u041d\u0430 \u0432\u0441\u0435\u0445 \u044d\u0442\u0430\u043f\u0430\u0445, \u0433\u0434\u0435 \u0447\u0442\u043e-\u0442\u043e \u043a\u0443\u0434\u0430-\u0442\u043e \u0432\u043b\u0438\u0432\u0430\u0435\u0442\u0441\u044f, \u0436\u0434\u0451\u043c \u043f\u0430\u0439\u043f\u043b\u0430\u0439\u043d, \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0432 \u044d\u0442\u043e \u0432\u0440\u0435\u043c\u044f \u0434\u0435\u043b\u0430\u0435\u0442 \u0434\u0440\u0443\u0433\u0438\u0435 \u0437\u0430\u0434\u0430\u0447\u0438 (\u0438\u043b\u0438 \u043f\u044c\u0451\u0442 \u0447\u0430\u0439, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u0440\u0430\u0431\u043e\u0442\u044b \u043d\u0435 \u043e\u0447\u0435\u043d\u044c \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0438\u0432\u043d\u043e).<\/p>\n<p>\u0410 \u0435\u0441\u043b\u0438 \u0443\u0447\u0435\u0441\u0442\u044c, \u0447\u0442\u043e \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u043c\u043d\u043e\u0433\u043e, \u0438\u0445 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u043e \u0432\u043e\u0437\u0440\u0430\u0441\u0442\u0430\u0435\u0442, \u0438 \u0440\u0430\u0431\u043e\u0442\u0430 \u0432\u0435\u0434\u0451\u0442\u0441\u044f \u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u0438\u043d\u0442\u0435\u043d\u0441\u0438\u0432\u043d\u043e, \u044d\u0442\u043e \u043f\u0440\u0438\u0432\u043e\u0434\u0438\u0442 \u043a \u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u043c\u043d\u043e\u0433\u043e \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432 \u043a\u043e\u043c\u0430\u043d\u0434\u044b \u041b\u041a2 \u0443\u0445\u043e\u0434\u0438\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0430 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u0435\u0440\u0441\u0438\u0439 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u043e\u0432.<\/p>\n<p><strong>yarn integrity check failed<\/strong><\/p>\n<p>\u0421\u043b\u043e\u0432\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0435 \u0433\u0440\u0435\u044e\u0442 \u043c\u043d\u0435 \u0434\u0443\u0448\u0443&#8230; \u042d\u0442\u0430 \u043e\u0448\u0438\u0431\u043a\u0430 \u0432\u043e\u0437\u043d\u0438\u043a\u0430\u0435\u0442, \u0435\u0441\u043b\u0438 \u0441\u0434\u0435\u043b\u0430\u0442\u044c <code>yarn publish<\/code> \u0431\u0435\u0437 \u043f\u043e\u0434\u043d\u044f\u0442\u0438\u044f \u0432\u0435\u0440\u0441\u0438\u0438 \u043f\u0430\u043a\u0435\u0442\u0430 \u0432 <code>package.json<\/code>. \u041f\u0440\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0435 \u043f\u0430\u043a\u0435\u0442\u0430 \u0432 \u0444\u0430\u0439\u043b <code>yarn.lock<\/code> \u043f\u043e\u043f\u0430\u0434\u0430\u0435\u0442 \u0445\u044d\u0448 \u043e\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u043f\u0430\u043a\u0435\u0442\u0430. \u042d\u0442\u043e\u0442 \u0445\u044d\u0448 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u0447\u0435\u043d \u0434\u043b\u044f \u0432\u0435\u0440\u0441\u0438\u0438 \u043f\u0430\u043a\u0435\u0442\u0430. \u0415\u0441\u043b\u0438 \u043e\u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u0442\u044c \u0432\u0435\u0440\u0441\u0438\u044e \u0431\u0435\u0437 \u043f\u043e\u0434\u043d\u044f\u0442\u0438\u044f \u0446\u0438\u0444\u0440\u044b \u0432 <code>package.json<\/code>, \u043f\u0430\u0439\u043f\u043b\u0430\u0439\u043d, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0449\u0438\u0439 \u0434\u0430\u043d\u043d\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e \u043f\u0430\u043a\u0435\u0442\u0430, \u0443\u043f\u0430\u0434\u0451\u0442. \u0410 \u0435\u0441\u043b\u0438 \u043a\u043e\u043d\u0444\u043b\u0438\u043a\u0442\u043d\u044b\u0439 \u043d\u043e\u043c\u0435\u0440 \u0432\u0435\u0440\u0441\u0438\u0438 \u0443\u0436\u0435 \u0432 \u0440\u0435\u043b\u0438\u0437\u0435, \u0442\u043e \u0443\u043f\u0430\u0434\u0443\u0442 \u0432\u043e\u043e\u0431\u0449\u0435 \u0432\u0441\u0435 \u0441\u0431\u043e\u0440\u043a\u0438, \u0442.\u043a. \u043e\u043d\u0438 \u043e\u043f\u0435\u0440\u0435\u0436\u0430\u044e\u0442 \u0440\u0435\u043b\u0438\u0437. \u0420\u0430\u0431\u043e\u0442\u0430 \u0441\u0442\u043e\u0438\u0442, \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0441\u0442\u044b \u043c\u043e\u0434\u0443\u043b\u044f \u0437\u0430\u043d\u044f\u0442\u044b \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0435\u0439 \u043d\u043e\u0432\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0435\u0439, \u0430 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0441\u0442\u044b \u041b\u041a2 \u0437\u0430\u043d\u044f\u0442\u044b \u043d\u043e\u0432\u044b\u043c \u0440\u0435\u043b\u0438\u0437\u043e\u043c \u0438 \u0430\u043a\u0442\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0435\u0439 \u0432\u0435\u0440\u0441\u0438\u0439. \u0417\u0432\u0443\u0447\u0438\u0442 \u043d\u0435\u043f\u0440\u0438\u044f\u0442\u043d\u043e \u0438 \u0433\u043b\u0443\u043f\u043e, \u043d\u043e \u044d\u0442\u043e \u0447\u0435\u043b\u043e\u0432\u0435\u0447\u0435\u0441\u043a\u0438\u0439 \u0444\u0430\u043a\u0442\u043e\u0440 \u0438 \u043f\u0430\u0440\u0443 \u0440\u0430\u0437 \u0442\u0430\u043a\u0430\u044f \u0441\u0438\u0442\u0443\u0430\u0446\u0438\u044f \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u043b\u0430.<\/p>\n<p><strong>\u041a\u043e\u0434 \u043c\u043e\u0434\u0443\u043b\u044f \u0432 \u043a\u043e\u043d\u0435\u0447\u043d\u043e\u043c \u0441\u0447\u0435\u0442\u0435 \u043f\u043e\u043f\u0430\u0434\u0430\u0435\u0442 \u0432 \u043e\u0431\u0449\u0443\u044e \u0441\u0431\u043e\u0440\u043a\u0443 \u0441 \u041b\u041a2.<\/strong><\/p>\n<p>\u0415\u0441\u0442\u044c \u0432\u0435\u0440\u043e\u044f\u0442\u043d\u043e\u0441\u0442\u044c, \u0447\u0442\u043e \u043e\u0448\u0438\u0431\u043a\u0430 \u0432 \u043c\u043e\u0434\u0443\u043b\u0435 \u043f\u043e\u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u0432\u0435\u0441\u044c \u043f\u0440\u043e\u0435\u043a\u0442. \u041d\u043e \u044f \u0431\u044b \u043d\u0435 \u0441\u043a\u0430\u0437\u0430\u043b, \u0447\u0442\u043e \u044d\u0442\u043e \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043e\u043a. \u041f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u0442\u0435\u043e\u0440\u0435\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442, \u043d\u043e \u043c\u044b \u0441 \u043d\u0435\u0439 \u043d\u0438 \u0440\u0430\u0437\u0443 \u043d\u0435 \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0438\u0441\u044c. \u0412\u0441\u0451-\u0442\u0430\u043a\u0438 \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u0438\u0437\u043c \u043a\u043e\u043c\u0430\u043d\u0434, \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0449\u0438\u0445 \u043c\u043e\u0434\u0443\u043b\u0438, \u0430 \u0442\u0430\u043a\u0436\u0435 Error Boundary \u0434\u0435\u043b\u0430\u044e\u0442 \u0441\u0432\u043e\u0451 \u0434\u0435\u043b\u043e.<\/p>\n<h4>\u0418\u0442\u043e\u0433\u0438 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u0447\u0435\u0440\u0435\u0437 NPM-\u043f\u0430\u043a\u0435\u0442\u044b<\/h4>\n<p>\u0421 \u0442\u0435\u0445\u043d\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0442\u043e\u0447\u043a\u0438 \u0437\u0440\u0435\u043d\u0438\u044f \u044d\u0442\u043e\u0442 \u043f\u043e\u0434\u0445\u043e\u0434 \u043e\u0447\u0435\u043d\u044c \u0445\u043e\u0440\u043e\u0448: \u043e\u043d \u0443\u0434\u043e\u0431\u0435\u043d \u0438 \u043d\u0430\u0434\u0451\u0436\u0435\u043d \u0438 \u0434\u043b\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438, \u0438 \u0434\u043b\u044f \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043d\u0438\u044f. \u041a\u043b\u044e\u0447\u0435\u0432\u044b\u043c \u0435\u0433\u043e \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u043e\u043c \u043e\u043a\u0430\u0437\u0430\u043b\u043e\u0441\u044c \u0441\u0438\u043b\u044c\u043d\u043e\u0435 \u0440\u0430\u0441\u0442\u044f\u0433\u0438\u0432\u0430\u043d\u0438\u0435 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432 \u0432\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438. \u0414\u043b\u044f \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0442\u0440\u0430\u0442\u0438\u0442\u044c \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u043a\u043e\u043c\u0430\u043d\u0434\u044b \u041b\u041a2, \u043e\u0442 \u0447\u0435\u0433\u043e \u0441\u0442\u0440\u0430\u0434\u0430\u0435\u0442 \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c \u043d\u0430\u0448\u0435\u0439 \u0440\u0430\u0431\u043e\u0442\u044b.<\/p>\n<p><strong>\u041f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430:<\/strong><\/p>\n<ul>\n<li>\n<p>\u041f\u0440\u043e\u0441\u0442\u043e\u0442\u0430 \u043f\u0435\u0440\u0432\u043e\u0439 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438;<\/p>\n<\/li>\n<li>\n<p>\u041d\u0435 \u043d\u0443\u0436\u043d\u044b \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 DevOps-\u0440\u0435\u0441\u0443\u0440\u0441\u044b;<\/p>\n<\/li>\n<li>\n<p>\u041d\u0435 \u0434\u0443\u0431\u043b\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043a\u043e\u0434 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a;<\/p>\n<\/li>\n<li>\n<p>\u0412\u0435\u0440\u0441\u0438\u0438 <code>@five\/core<\/code> \u0438 <code>@five\/uikit<\/code> \u0432\u0441\u0435\u0433\u0434\u0430 \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u044b;<\/p>\n<\/li>\n<li>\n<p>\u0418\u0437 \u043c\u043e\u0434\u0443\u043b\u044f \u043b\u0435\u0433\u043a\u043e \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c  \u0441\u0440\u0430\u0437\u0443 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432;<\/p>\n<\/li>\n<li>\n<p>\u0423\u0434\u043e\u0431\u043d\u043e\u0435 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u043c\u043e\u0434\u0443\u043b\u044f \u0441 \u041b\u041a2.<\/p>\n<\/li>\n<\/ul>\n<p><strong>\u041d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0438:<\/strong><\/p>\n<ul>\n<li>\n<p>\u0414\u043b\u0438\u043d\u043d\u0430\u044f \u0446\u0435\u043f\u043e\u0447\u043a\u0430 \u043f\u043e\u043f\u0430\u0434\u0430\u043d\u0438\u044f \u043c\u043e\u0434\u0443\u043b\u044f \u0432 \u043f\u0440\u043e\u0434\u0430\u043a\u0448\u0435\u043d;<\/p>\n<\/li>\n<li>\n<p>yarn integrity check failed;<\/p>\n<\/li>\n<li>\n<p>\u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u0432\u043b\u0438\u044f\u043d\u0438\u0435 \u043c\u043e\u0434\u0443\u043b\u044f \u043d\u0430 \u041b\u041a2 \u0438 \u0435\u0433\u043e \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435.<\/p>\n<\/li>\n<\/ul>\n<p>\u0414\u0430\u043b\u044c\u0448\u0435 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u0435\u0439! \u0421\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u0441\u043f\u043e\u0441\u043e\u0431, \u043d\u0430 \u043c\u043e\u0439 \u0432\u0437\u0433\u043b\u044f\u0434, \u043e\u0431\u043b\u0430\u0434\u0430\u0435\u0442 \u0431\u043e\u043b\u044c\u0448\u0435\u0439 \u0447\u0430\u0441\u0442\u044c\u044e \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e NPM-\u043f\u0430\u043a\u0435\u0442\u043e\u0432, \u0438 \u043f\u0440\u0438 \u044d\u0442\u043e\u043c \u043e\u043d \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0431\u043d\u043e\u0432\u043b\u044f\u0442\u044c \u043c\u043e\u0434\u0443\u043b\u0438 \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442 \u043a\u043e\u043c\u0430\u043d\u0434\u044b \u041b\u041a2 \u043a\u0430\u043a \u0441 <code>iframe<\/code>.<\/p>\n<p><a class=\"anchor\" name=\"wmf\" id=\"wmf\"><\/a><\/p>\n<h3>Webpack Module Federation<\/h3>\n<p>\u042d\u0442\u043e \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u044b\u0439 \u043c\u0435\u0442\u043e\u0434, \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u043c\u044b \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u044b.<\/p>\n<p>\u0422\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u044f \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043c\u043e\u0434\u0443\u043b\u0438 \u043d\u0435 \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u0441\u0431\u043e\u0440\u043a\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0430, \u0430 \u043f\u043e\u0434\u0442\u044f\u0433\u0438\u0432\u0430\u0442\u044c \u0438\u0445 \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438, \u043a\u043e\u0433\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043e\u0442\u043a\u0440\u044b\u043b \u0432\u043a\u043b\u0430\u0434\u043a\u0443 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430. \u042d\u0442\u0438 \u043c\u043e\u0434\u0443\u043b\u0438 \u0445\u0440\u0430\u043d\u044f\u0442\u0441\u044f \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u043c \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0438, \u0441\u043e\u0431\u0438\u0440\u0430\u044e\u0442\u0441\u044f \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e, \u0438\u0445 \u0441\u0442\u0430\u0442\u0438\u043a\u0430 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u043e \u0444\u0438\u043a\u0441\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u043c\u0443 URL.<\/p>\n<p>\u0414\u0430\u043d\u043d\u044b\u0439 \u0441\u043f\u043e\u0441\u043e\u0431 \u043f\u043e\u044f\u0432\u0438\u043b\u0441\u044f \u043d\u0435\u0434\u0430\u0432\u043d\u043e \u0432 \u043f\u044f\u0442\u043e\u043c \u0412\u0435\u0431\u043f\u0430\u043a\u0435. \u041d\u0438\u0436\u0435 \u043e\u043f\u0438\u0448\u0443 \u0435\u0433\u043e \u043f\u0440\u0438\u043d\u0446\u0438\u043f. \u0415\u0441\u043b\u0438 \u0432\u044b \u0443\u0436\u0435 \u0437\u043d\u0430\u043a\u043e\u043c\u044b \u0441 Module Federation, \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u0440\u043e\u043f\u0443\u0441\u0442\u0438\u0442\u044c \u043f\u043e\u044f\u0441\u043d\u0435\u043d\u0438\u0435.<\/p>\n<details class=\"spoiler\">\n<summary>\u041f\u043e\u044f\u0441\u043d\u0435\u043d\u0438\u0435: \u043a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 Module Federation<\/summary>\n<div class=\"spoiler__content\">\n<p>\u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u043c, \u0447\u0442\u043e \u0435\u0441\u0442\u044c React-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 <code>ChildComponent<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u044b \u0445\u043e\u0442\u0438\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0443 \u0441\u0435\u0431\u044f \u0432 \u043f\u0440\u043e\u0435\u043a\u0442\u0435. \u041a\u043e\u0434 \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u043c React-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 <code>child_project<\/code> \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u043c \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0438 <code>child_repo<\/code>.<\/p>\n<p>\u041f\u0440\u043e\u0435\u043a\u0442 \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u0442\u0441\u044f \u0438 \u0435\u0433\u043e \u0438\u043d\u0434\u0435\u043a\u0441-\u0444\u0430\u0439\u043b \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043f\u043e \u0444\u0438\u043a\u0441\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u043c\u0443 \u043f\u0443\u0442\u0438:<\/p>\n<p><code>https:\/\/modules.x5.ru\/static\/child_project\/child_project.js<\/code><\/p>\n<p>\u0427\u0442\u043e\u0431\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 <code>ChildComponent<\/code> \u0432 \u043f\u0440\u043e\u0435\u043a\u0442\u0435 <code>lk2<\/code> , \u043d\u0443\u0436\u043d\u043e \u0441\u043d\u0430\u0447\u0430\u043b\u0430 \u0434\u043e\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0439 \u043f\u0440\u043e\u0435\u043a\u0442. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u043c Webpack-\u043f\u043b\u0430\u0433\u0438\u043d \u0441\u043e \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c\u0438 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430\u043c\u0438:<\/p>\n<pre><code class=\"javascript\">\/\/ child_project\/wepback.config.babel.ts  new ModuleFederationPlugin({   \/\/ \u0431\u0435\u0440\u0451\u043c \u0438\u043c\u044f \u0438\u0437 package.json \"child_project\"   name,    \/\/ \u0434\u0430\u043d\u043d\u044b\u0439 \u0431\u0430\u043d\u0434\u043b \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u0442\u0441\u044f \u043a\u0430\u043a \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 \u0441 \u0438\u043c\u0435\u043d\u0435\u043c \"child_project\".   \/\/ \u043d\u0430\u0440\u0443\u0436\u0443 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0430\u044f, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c type: 'var'   library: { type: 'var', name },    \/\/ \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 index-\u0444\u0430\u0439\u043b\u0430: 'child_project.js'   filename: `${name}.js`,    exposes: {     \/\/ \u0423\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c, \u0447\u0442\u043e \u043a\u0430\u043a\u043e\u0439 \u0444\u0430\u0439\u043b \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0438\u0437 \u043c\u043e\u0434\u0443\u043b\u044f \u043f\u043e \u043f\u0443\u0442\u0438     \/\/ .\/ChildComponent     '.\/ChildComponent': '.\/src\/ChildComponent'   },    \/\/ \u0417\u0434\u0435\u0441\u044c \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0440\u0430\u0437\u0434\u0435\u043b\u044f\u0435\u043c\u044b\u0435 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043c\u0435\u0436\u0434\u0443 \u0442\u0435\u043a\u0443\u0449\u0438\u043c \u043c\u043e\u0434\u0443\u043b\u0435\u043c   \/\/ \u0438 \u0442\u0435\u043c, \u0432 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u0443\u0434\u0435\u0442 \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u0434\u0430\u043d\u043d\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442.   \/\/ \u0410\u043d\u0430\u043b\u043e\u0433 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u0443\u043a\u0430\u0437\u0430\u043d\u043e \u0432 peerDependecies \u0432 \u0441\u043b\u0443\u0447\u0430\u0435 \u0441 NPM-\u043f\u0430\u043a\u0435\u0442\u043e\u043c   shared: { \/* ... *\/ } })<\/code><\/pre>\n<p>\u0414\u043e\u0447\u0435\u0440\u043d\u0438\u0439 \u043f\u0440\u043e\u0435\u043a\u0442 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043d! \u0422\u0435\u043f\u0435\u0440\u044c \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0442\u0430\u043a\u043e\u0439 \u0436\u0435 \u043f\u043b\u0430\u0433\u0438\u043d \u0432 <code>lk2<\/code> , \u043d\u043e \u0443\u0436\u0435 \u0441 \u0434\u0440\u0443\u0433\u0438\u043c\u0438 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430\u043c\u0438:<\/p>\n<pre><code class=\"javascript\">\/\/ five\/packages\/lk2\/webpack.babel.config.ts  new ModuleFederationPlugin({   name: '@five\/lk2',    remotes: {     \/\/ \u043a\u043b\u044e\u0447 \u2014 \u044d\u0442\u043e \u0430\u043b\u0438\u0430\u0441, \u043f\u043e \u043a\u043e\u0442\u043e\u0440\u043e\u043c\u0443 \u0431\u0443\u0434\u0435\u043c \u0438\u043c\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043c\u043e\u0434\u0443\u043b\u044c     '@five\/childModule':       \/\/ \u0444\u043e\u0440\u043c\u0430\u0442: &lt;name>@&lt;url>       'child_module@https:\/\/modules.x5.ru\/static\/child_project\/child_project.js'   },    shared: { \/* \u0422\u043e \u0436\u0435, \u0447\u0442\u043e \u0438 \u0432 child_project *\/} })<\/code><\/pre>\n<p>\u0414\u0430\u043b\u0435\u0435 \u043d\u0443\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0441\u043a\u0440\u0438\u043f\u0442 \u0441\u043e \u0441\u0441\u044b\u043b\u043a\u043e\u0439 \u043d\u0430 \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0439 \u043c\u043e\u0434\u0443\u043b\u044c \u0432 \u0448\u0430\u0431\u043b\u043e\u043d \u0431\u0443\u0434\u0443\u0449\u0435\u0433\u043e <code>index.html<\/code> \u041b\u041a2<\/p>\n<pre><code class=\"xml\">&lt;!-- five\/packages\/lk2\/src\/index.ejs -->  &lt;script src=\"https:\/\/modules.x5.ru\/static\/child_project\/child_project.js>\">&lt;\/script><\/code><\/pre>\n<p>\u0418 \u043f\u043e\u0441\u043b\u0435 \u044d\u0442\u043e\u0433\u043e \u043c\u043e\u0436\u0435\u043c \u0438\u043c\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0432\u043d\u0443\u0442\u0440\u0438 <code>lk2<\/code>, \u043a\u0430\u043a \u043e\u0431\u044b\u0447\u043d\u044b\u0439 React-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442:<\/p>\n<pre><code class=\"javascript\">\/\/ five\/packages\/lk2\/src\/modules\/ChildComponentWrapper.tsx  import { Loader } from '@five\/uikit'; import * as React from 'react'; import SentryErrorBoundary from 'components\/SentryErrorBoundary';  \/\/ \u0418\u043c\u043f\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e React.lazy const LazyComponent = React.lazy('@five\/childModule\/ChildComponent');  type Props = {\/* ... *\/};  \/\/ \u041e\u0431\u043e\u0440\u0430\u0447\u0432\u0430\u0435\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0432 Error Boundary const WrappedComponent: React.FC&lt;Props> = (props: Props) => (   &lt;SentryErrorBoundary>     &lt;React.Suspense fallback={&lt;Loader \/>}>       &lt;LazyComponent {...props} \/>     &lt;\/React.Suspense>   &lt;\/SentryErrorBoundary> );  \/\/ \u042d\u043a\u0441\u043f\u043e\u0442\u0440\u0438\u0440\u0443\u0435\u043c \u0444\u0438\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 export default WrappedComponent;<\/code><\/pre>\n<p>\u0413\u043e\u0442\u043e\u0432\u043e! \u041a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0432 \u0443\u0434\u0430\u043b\u0451\u043d\u043d\u043e\u043c \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0438, \u0445\u0440\u0430\u043d\u0438\u0442\u0441\u044f \u0442\u0430\u043a \u0436\u0435 \u0443\u0434\u0430\u043b\u0435\u043d\u043d\u043e, \u0430 \u043c\u044b \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0443\u0435\u0442 \u0441 \u043d\u0438\u043c \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u043d\u0430\u0442\u0438\u0432\u043d\u043e!<\/p>\n<p>\u0411\u0435\u0437\u0443\u0441\u043b\u043e\u0432\u043d\u043e, \u044d\u0442\u043e \u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u043f\u043e\u0432\u0435\u0440\u0445\u043d\u043e\u0441\u0442\u043d\u044b\u0439 \u043f\u0440\u0438\u043c\u0435\u0440, \u043d\u043e \u043e\u043d \u043d\u0430\u0433\u043b\u044f\u0434\u043d\u043e \u0434\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0438\u0440\u0443\u0435\u0442, \u0447\u0442\u043e \u0442\u0430\u043a\u043e\u0435 \u0444\u0435\u0434\u0435\u0440\u0430\u0446\u0438\u044f \u043c\u043e\u0434\u0443\u043b\u0435\u0439, \u0438 \u043a\u0430\u043a \u0435\u0451 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c. \u0412 \u043e\u0434\u043d\u043e\u0439 \u0438\u0437 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0445 \u0441\u0442\u0430\u0442\u0435\u0439 \u044f \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443, \u043a\u0430\u043a \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c Module Federation, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043a\u0430\u043a\u0438\u0435 \u043f\u043e\u0434\u0432\u043e\u0434\u043d\u044b\u0435 \u043a\u0430\u043c\u043d\u0438 \u0438 \u0442\u043e\u043d\u043a\u043e\u0441\u0442\u0438 \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u0432 \u0434\u0430\u043d\u043d\u043e\u043c \u043c\u0435\u0442\u043e\u0434\u0435. \u042d\u0442\u0430 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u044f \u043e\u0447\u0435\u043d\u044c \u0441\u0432\u0435\u0436\u0430, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0435\u0441\u0442\u044c \u043c\u043d\u043e\u0433\u043e \u043c\u043e\u043c\u0435\u043d\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043b\u0438\u0431\u043e \u043f\u0440\u043e\u0442\u0438\u0432\u043e\u0440\u0435\u0447\u0430\u0442 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438, \u043b\u0438\u0431\u043e \u0432\u044b\u044f\u0441\u043d\u044f\u044e\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u043c \u043f\u0443\u0442\u0451\u043c.<\/p>\n<\/div>\n<\/details>\n<h4>\u0427\u0442\u043e \u043d\u0430\u043c \u0434\u0430\u043b\u043e \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0447\u0435\u0440\u0435\u0437 Module Federation<\/h4>\n<p>\u042d\u0442\u043e\u0442 \u043f\u043e\u0434\u0445\u043e\u0434 \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u044f\u0435\u0442 \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430 \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043d\u0438\u044f \u0447\u0435\u0440\u0435\u0437 iframe \u0438 \u0447\u0435\u0440\u0435\u0437 NPM-\u043f\u0430\u043a\u0435\u0442\u044b.<\/p>\n<p><strong>\u041d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u044c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f.<\/strong><\/p>\n<p>\u0414\u043b\u044f \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u043c\u043e\u0434\u0443\u043b\u044f \u043a\u043e\u043c\u0430\u043d\u0434\u0430 \u0434\u043e\u043b\u0436\u043d\u0430 \u0441\u043e\u0431\u0440\u0430\u0442\u044c \u043f\u0440\u043e\u0435\u043a\u0442 \u0438 \u0440\u0430\u0437\u043b\u043e\u0436\u0438\u0442\u044c \u0441\u0442\u0430\u0442\u0438\u043a\u0443 \u0442\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u0447\u0442\u043e\u0431\u044b \u043e\u043d\u0430 \u0431\u044b\u043b\u0430 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u0430 \u043f\u043e \u0437\u0430\u0440\u0430\u043d\u0435\u0435 \u0437\u0430\u0444\u0438\u043a\u0441\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u043c\u0443 \u043f\u0443\u0442\u0438. \u041f\u0440\u0438 \u044d\u0442\u043e\u043c \u043a\u043e\u043c\u0430\u043d\u0434\u0430 \u041b\u041a2 \u0434\u0435\u043b\u0430\u0442\u044c \u043d\u0438\u0447\u0435\u0433\u043e \u043d\u0435 \u0434\u043e\u043b\u0436\u043d\u0430.<\/p>\n<p>\u0412\u043e\u0437\u043d\u0438\u043a\u0430\u0435\u0442 \u0434\u0432\u0430 \u0432\u043e\u043f\u0440\u043e\u0441\u0430:<\/p>\n<ol>\n<li>\n<p><strong>\u041a\u0443\u0434\u0430 \u0441\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0442\u044c \u0441\u0442\u0430\u0442\u0438\u043a\u0443 \u043c\u043e\u0434\u0443\u043b\u044f?<\/strong> \u041b\u0438\u0447\u043d\u044b\u0439 \u043a\u0430\u0431\u0438\u043d\u0435\u0442 \u0440\u0430\u043d\u0435\u0435 \u0443\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0435 S3 \u0434\u043b\u044f \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0441\u0442\u0430\u0442\u0438\u043a\u0438. \u041e\u043a\u0430\u0437\u0430\u043b\u043e\u0441\u044c, \u0447\u0442\u043e S3 \u0442\u0430\u043a\u0436\u0435 \u043e\u0447\u0435\u043d\u044c \u0443\u0434\u043e\u0431\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0438 \u0434\u043b\u044f \u0445\u0440\u0430\u043d\u0435\u043d\u0438\u044f \u0441\u0442\u0430\u0442\u0438\u043a\u0438 \u043c\u043e\u0434\u0443\u043b\u0435\u0439. \u0422\u043e\u0433\u0434\u0430 \u0432 \u043f\u0430\u0439\u043f\u043b\u0430\u0439\u043d\u0435 \u0441\u0431\u043e\u0440\u043a\u0438 \u043c\u043e\u0434\u0443\u043b\u044f \u0435\u0433\u043e \u0434\u0435\u043f\u043b\u043e\u0439 \u0437\u0430\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u0432 \u043f\u0440\u043e\u0441\u0442\u043e\u043c \u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438 \u0444\u0430\u0439\u043b\u043e\u0432 \u043f\u043e \u0444\u0438\u043a\u0441\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u043c\u0443 \u043f\u0443\u0442\u0438 S3:<\/p>\n<pre><code class=\"bash\">aws s3 cp \/dist s3:\/\/$BUCKET_NAME\/$PACKAGE_NAME \\   --recursive \\   --endpoint-url $ENDPOINT_URL \\   --acl public-read<\/code><\/pre>\n<p>\u041e\u0431\u0440\u0430\u0442\u0438\u0442\u0435 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435, \u0447\u0442\u043e \u043f\u0440\u0438 \u0444\u043e\u0440\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438 \u043f\u0443\u0442\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f <code>$PACKAGE_NAME<\/code>\u00a0\u2014\u00a0\u044d\u0442\u043e \u0438\u043c\u044f \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0438\u0437 <code>package.json<\/code>. \u0424\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438, \u044d\u0442\u043e \u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 \u0443\u043d\u0438\u043a\u0430\u043b\u044c\u043d\u044b\u0439 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0439 \u043f\u0440\u0438 \u0441\u0431\u043e\u0440\u043a\u0435 \u043c\u043e\u0434\u0443\u043b\u044f.<\/p>\n<p>\u042d\u0442\u043e \u0443\u0434\u043e\u0431\u043d\u043e \u043f\u043e \u0434\u0432\u0443\u043c \u043f\u0440\u0438\u0447\u0438\u043d\u0430\u043c:<\/p>\n<ul>\n<li>\n<p>\u0414\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u0432\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u043d\u043e\u0432\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c \u0432 <code>lk2<\/code>, \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0437\u043d\u0430\u0442\u044c \u043b\u0438\u0448\u044c <code>name<\/code> \u0438\u0437 <code>package.json<\/code> \u0438 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u043c\u043e\u0433\u043e React-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430. \u0412\u0435\u0441\u044c \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u043e\u0439 \u043f\u0443\u0442\u044c \u043a \u043c\u043e\u0434\u0443\u043b\u044e \u0444\u0438\u043a\u0441\u0438\u0440\u043e\u0432\u0430\u043d.<\/p>\n<\/li>\n<li>\n<p>\u041a\u043e\u043c\u0430\u043d\u0434\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442 \u043c\u043e\u0434\u0443\u043b\u044c, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u0448\u0430\u0431\u043b\u043e\u043d\u043d\u044b\u0439 \u043f\u0440\u043e\u0435\u043a\u0442. \u0424\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0435\u0439 \u0432\u043e\u043e\u0431\u0449\u0435 \u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u043d\u0438\u0447\u0435\u0433\u043e \u0434\u0435\u043b\u0430\u0442\u044c \u0434\u043b\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0434\u0435\u043f\u043b\u043e\u044f.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>\u0427\u0442\u043e \u0434\u0435\u043b\u0430\u0442\u044c \u0441 <\/strong><a href=\"https:\/\/webpack.js.org\/guides\/caching\/\"><strong>\u043a\u0435\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435\u043c<\/strong><\/a><strong> \u043c\u043e\u0434\u0443\u043b\u044f?<\/strong><\/p>\n<p>\u041a\u0435\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u043d\u0443\u0436\u043d\u043e, \u0447\u0442\u043e\u0431\u044b \u043a\u043b\u0438\u0435\u043d\u0442 \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u043b \u0441\u0442\u0430\u0442\u0438\u043a\u0443 (js, \u0441\u0442\u0438\u043b\u0438 \u0438 \u0442.\u0434.) \u043d\u0435 \u043f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0438 \u0441\u0430\u0439\u0442\u0430, \u0430 \u0442\u043e\u043b\u044c\u043a\u043e \u0435\u0441\u043b\u0438 \u044d\u0442\u0430 \u0441\u0442\u0430\u0442\u0438\u043a\u0430 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f, \u0442.\u0435. \u0435\u0441\u043b\u0438 \u0441\u0434\u0435\u043b\u0430\u043b\u0438 \u043d\u043e\u0432\u044b\u0439 \u0440\u0435\u043b\u0438\u0437. \u041e\u0431\u044b\u0447\u043d\u043e \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c \u043a\u0435\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0442\u0430\u043a:<\/p>\n<ul>\n<li>\n<p>\u0412 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0444\u0430\u0439\u043b\u043e\u0432 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0445\u0435\u0448 \u043e\u0442 \u0438\u0445 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e: <code>main.js<\/code> \u2192 <code>main.[contenthash].js<\/code><\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0441\u0442\u0430\u0442\u0438\u043a\u0435 HTTP-\u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a <code>cache-control<\/code> \u0441 \u0434\u043e\u043b\u0433\u0438\u043c \u0432\u0440\u0435\u043c\u0435\u043d\u0435\u043c \u0436\u0438\u0437\u043d\u0438.<\/p>\n<\/li>\n<\/ul>\n<p>\u041a\u043b\u0438\u0435\u043d\u0442 \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442 \u0444\u0430\u0439\u043b \u043e\u0434\u0438\u043d \u0440\u0430\u0437 \u0438 \u0434\u0430\u043b\u0435\u0435 \u0431\u0443\u0434\u0435\u0442 \u0431\u0440\u0430\u0442\u044c \u0435\u0433\u043e \u0438\u0437 \u043a\u0435\u0448\u0430, \u043f\u043e\u043a\u0430 \u043d\u0435 \u043f\u043e\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043d\u0435\u0433\u043e, \u0442.\u0435. \u043f\u043e\u043a\u0430 \u043d\u0435 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u0441\u044f \u0435\u0433\u043e \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435, \u0430 \u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e, \u0438 \u0445\u044d\u0448 \u0432 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0438.<\/p>\n<p>\u0412 \u0441\u043b\u0443\u0447\u0430\u0435 \u0441 \u0444\u0435\u0434\u0435\u0440\u0430\u0446\u0438\u0435\u0439 \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u043f\u043e\u0434\u0445\u043e\u0434 \u0441 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435\u043c \u0445\u044d\u0448\u0430 \u043d\u0435 \u0441\u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442, \u0442.\u043a. \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u0444\u0430\u0439\u043b \u0437\u0430\u0444\u0438\u043a\u0441\u0438\u0440\u043e\u0432\u0430\u043d\u0430. \u042d\u0442\u0430 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u0431\u044b\u043b\u0430 \u043e\u043f\u0438\u0441\u0430\u043d\u0430 \u0435\u0449\u0451 \u0432 <a href=\"https:\/\/github.com\/webpack\/webpack\/issues\/10352\">feature request<\/a> \u0441 Module Federation. \u0420\u0435\u0448\u0430\u0435\u0442\u0441\u044f \u043e\u043d\u0430 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435\u043c \u043a\u0435\u0448\u0438\u0440\u0443\u044e\u0449\u0435\u0433\u043e HTTP-\u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430 ETag \u2014 \u044d\u0442\u043e \u0442\u0430\u043a\u043e\u0439 \u0436\u0435 \u0445\u044d\u0448, \u043d\u043e \u043e\u043d \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043d\u0435 \u0441\u0431\u043e\u0440\u0449\u0438\u043a\u043e\u043c \u0432 \u0438\u043c\u044f \u0444\u0430\u0439\u043b\u0430, \u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c \u0441\u0442\u0430\u0442\u0438\u043a\u0438 \u0432 \u043c\u043e\u043c\u0435\u043d\u0442 \u043e\u0442\u0434\u0430\u0447\u0438 \u0444\u0430\u0439\u043b\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0443. \u0412 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043d\u0438\u0447\u0435\u0433\u043e \u043d\u0435 \u043f\u0440\u0438\u0448\u043b\u043e\u0441\u044c \u0434\u043e\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u0434\u0430\u043d\u043d\u044b\u0439 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0440\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c S3, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043c\u044b \u0445\u0440\u0430\u043d\u0438\u043c \u0432\u0441\u044e \u0441\u0442\u0430\u0442\u0438\u043a\u0443 \u043c\u043e\u0434\u0443\u043b\u0435\u0439.<\/p>\n<\/li>\n<\/ol>\n<p><strong>\u0423\u0434\u043e\u0431\u043d\u043e \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u0440\u0430\u0437\u0443 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432<\/strong>.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0432 \u0441\u0435\u043a\u0446\u0438\u0438 <code>exposes<\/code> \u043f\u0440\u043e\u0441\u0442\u043e \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u043b\u0435\u0439:<\/p>\n<pre><code class=\"javascript\">\/\/ child_module\/webpack.config.babel.ts  exposes: {   '.\/Page': '.\/src\/Page',   '.\/Wiget': '.\/src\/Widget' },<\/code><\/pre>\n<p><strong>\u041c\u043e\u0434\u0443\u043b\u0438 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u044e\u0442\u0441\u044f \u043a\u0430\u043a \u043e\u0431\u044b\u0447\u043d\u044b\u0435 React-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b<\/strong>.<\/p>\n<ul>\n<li>\n<p>\u041c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u043f\u0440\u043e\u043f\u0441\u044b<\/p>\n<\/li>\n<li>\n<p>\u0415\u0441\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u043e\u0431\u0449\u0435\u043c\u0443 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/p>\n<\/li>\n<\/ul>\n<p><strong>\u041a\u043e\u0434 \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u043f\u043e\u0434\u0433\u0440\u0443\u0436\u0430\u0435\u0442\u0441\u044f \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438.<\/strong><\/p>\n<p>\u042d\u0442\u043e \u043f\u043e\u043b\u043e\u0436\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u0440\u0430\u0437\u043c\u0435\u0440 \u0431\u0430\u043d\u0434\u043b\u0430 \u0438, \u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e, \u043d\u0430 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u043f\u0435\u0440\u0432\u043e\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0439 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438.<\/p>\n<p><strong>\u041c\u043e\u0434\u0443\u043b\u0438 \u0441\u043e\u0431\u0438\u0440\u0430\u044e\u0442\u0441\u044f \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f\u0445.<\/strong><\/p>\n<p><code>lk2<\/code> \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u0442\u0441\u044f \u0431\u044b\u0441\u0442\u0440\u0435\u0435, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0441\u0431\u043e\u0440\u0449\u0438\u043a\u0443 \u043d\u0435 \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u043a\u043e\u0434 \u043c\u043e\u0434\u0443\u043b\u0435\u0439. \u0421\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u0438 \u043f\u0430\u0439\u043f\u043b\u0430\u0439\u043d\u044b \u043f\u0440\u043e\u0445\u043e\u0434\u044f\u0442 \u0431\u044b\u0441\u0442\u0440\u0435\u0435.<\/p>\n<p><strong>\u041b\u0435\u0433\u043a\u043e<\/strong> <strong>\u0437\u0430\u0441\u0435\u0442\u0430\u043f\u0438\u0442\u044c \u043d\u043e\u0432\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u0448\u0430\u0431\u043b\u043e\u043d\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430.<\/strong><\/p>\n<p>\u0421\u0435\u0439\u0447\u0430\u0441 \u0434\u043b\u044f \u0441\u0435\u0442\u0430\u043f\u0430 \u043d\u043e\u0432\u043e\u0433\u043e \u043c\u043e\u0434\u0443\u043b\u044f \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c fork \u043e\u0442 \u0448\u0430\u0431\u043b\u043e\u043d\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u041d\u0443\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043f\u0440\u0438\u043c\u0435\u0440\u043d\u043e 0 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a. \u041a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437 \u0434\u0435\u043b\u0430\u0442\u044c fork \u043d\u0435\u043c\u043d\u043e\u0433\u043e \u043a\u043e\u0441\u0442\u044b\u043b\u044c\u043d\u043e: \u043f\u043e\u0441\u043b\u0435 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0448\u0430\u0431\u043b\u043e\u043d\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u043d\u0443\u0436\u043d\u043e \u0432\u0440\u0443\u0447\u043d\u0443\u044e \u043e\u0431\u043d\u043e\u0432\u043b\u044f\u0442\u044c \u043a\u0430\u0436\u0434\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432 \u043f\u043b\u0430\u043d\u0430\u0445 \u0432\u043d\u0435\u0441\u0442\u0438 \u0448\u0430\u0431\u043b\u043e\u043d\u043d\u044b\u0439 \u043f\u0440\u043e\u0435\u043a\u0442 \u0432 \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439 \u0438 \u043e\u0444\u043e\u0440\u043c\u0438\u0442\u044c \u0435\u0433\u043e \u0432 \u0432\u0438\u0434\u0435 NPM-\u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438. \u041f\u043e\u043b\u0443\u0447\u0438\u0442\u0441\u044f \u0447\u0442\u043e-\u0442\u043e \u0432\u0440\u043e\u0434\u0435 <code>create-react-app<\/code>, \u0442\u043e\u043b\u044c\u043a\u043e <code>create-x5-app<\/code>.<\/p>\n<p><strong>\u0412 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u043e\u0431\u0449\u0438\u0435 \u043c\u043e\u0434\u0443\u043b\u0438 \u0433\u0440\u0443\u0437\u044f\u0442\u0441\u044f \u043e\u0434\u0438\u043d \u0440\u0430\u0437<\/strong>.<\/p>\n<p><code>ModuleFederationPlugin<\/code> \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u0432 <code>shared<\/code> \u043e\u0431\u0449\u0438\u0435 \u043f\u0430\u043a\u0435\u0442\u044b \u0434\u043b\u044f \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u043c\u043e\u0434\u0443\u043b\u0435\u0439. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 <strong>\u043c\u043e\u0434\u0443\u043b\u0435 A<\/strong> React \u0432\u0435\u0440\u0441\u0438\u0438 17.0.1, \u0430 \u0432 <strong>\u043c\u043e\u0434\u0443\u043b\u0435 B<\/strong> \u2014 17.0.2.<\/p>\n<p>\u041f\u0440\u0438 \u0441\u0431\u043e\u0440\u043a\u0435 <strong>\u043c\u043e\u0434\u0443\u043b\u044f A<\/strong> <code>react<\/code> \u043f\u043e\u043f\u0430\u0434\u0430\u0435\u0442 \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u0447\u0430\u043d\u043a. \u0410\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u043e \u043f\u0440\u0438 \u0441\u0431\u043e\u0440\u043a\u0435 <strong>\u043c\u043e\u0434\u0443\u043b\u044f B<\/strong> <code>react<\/code> \u0442\u043e\u0436\u0435 \u043f\u043e\u043f\u0430\u0434\u0430\u0435\u0442 \u0432 \u043e\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u0447\u0430\u043d\u043a.<\/p>\n<p>\u0414\u0430\u043b\u0435\u0435 \u0443\u0436\u0435 \u043a\u043e\u0433\u0434\u0430 \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0432\u043a\u043b\u0430\u0434\u043a\u0430 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435, \u043f\u043b\u0430\u0433\u0438\u043d \u0412\u0435\u0431\u043f\u0430\u043a\u0430 \u0432\u0438\u0434\u0438\u0442, \u0447\u0442\u043e \u043d\u0430 \u0442\u0435\u043a\u0443\u0449\u0435\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043e\u0434\u0438\u043d \u0438 \u0442\u043e\u0442 \u0436\u0435 \u043f\u0430\u043a\u0435\u0442 \u0440\u0430\u0437\u043d\u044b\u0445 \u0432\u0435\u0440\u0441\u0438\u0439 \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u043c\u043e\u0434\u0443\u043b\u044f\u0445. \u0417\u0430\u0433\u0440\u0443\u0436\u0435\u043d \u0431\u0443\u0434\u0435\u0442 \u0447\u0430\u043d\u043a \u0438\u0437 \u0442\u043e\u0433\u043e \u043c\u043e\u0434\u0443\u043b\u044f, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0432\u0435\u0440\u0441\u0438\u044f \u043f\u0430\u043a\u0435\u0442\u0430 \u0432\u044b\u0448\u0435.<\/p>\n<p>\u041e\u0431\u0440\u0430\u0442\u0438\u0442\u0435 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435, \u0447\u0442\u043e \u0432 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043d\u0435 \u0432\u0430\u0436\u043d\u043e, \u043a\u0430\u043a\u043e\u0439 \u0438\u0437 \u043c\u043e\u0434\u0443\u043b\u0435\u0439 A \u0438\u043b\u0438 B \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u043c, \u0430 \u043a\u0430\u043a\u043e\u0439 \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u043c. \u0422\u0430\u043a\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043c\u043e\u0436\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c, \u0441 \u0447\u0435\u043c \u0441\u0432\u044f\u0437\u0430\u043d\u043e \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0445 \u043c\u043e\u043c\u0435\u043d\u0442\u043e\u0432, \u043e \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443 \u0432 \u0441\u0442\u0430\u0442\u044c\u0435 \u043f\u0440\u043e Module Federation. \u041d\u043e \u0432 \u043e\u0431\u0449\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u0440\u0430\u0437\u0434\u0435\u043b\u044f\u0435\u043c\u044b\u0435 \u043f\u0430\u043a\u0435\u0442\u044b \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u0443\u043c\u0435\u043d\u044c\u0448\u0438\u0442\u044c \u0440\u0430\u0437\u043c\u0435\u0440 \u0447\u0430\u043d\u043a\u043e\u0432 \u0438 \u0433\u0440\u0443\u0437\u0438\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0443\u0436\u043d\u043e\u0435.<\/p>\n<h4>\u041a\u043e\u043d\u0435\u0447\u043d\u043e, \u0443 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e Module Federation \u0435\u0441\u0442\u044c \u0438 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0438:<\/h4>\n<p>\u041e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043e\u043a \u0432\u044b\u0442\u0435\u043a\u0430\u0435\u0442 \u0438\u0437 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u044d\u0442\u043e \u0441\u0432\u0435\u0436\u0430\u044f \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u044f. <strong>\u041f\u0435\u0440\u0432\u0430\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430 \u0437\u0430\u043d\u044f\u043b\u0430 \u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438<\/strong>. \u0412 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u043c \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0432\u043e\u0437\u043d\u0438\u043a\u0430\u043b\u0438 \u0438\u0437-\u0437\u0430 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f \u043c\u0435\u0441\u0442\u0430\u043c\u0438 \u043d\u0435 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u043e\u0432\u0430\u043b\u0430 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u0438, \u043c\u0435\u0441\u0442\u0430\u043c\u0438 \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u043b\u043e\u0441\u044c \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0442\u044c \u043d\u0430 \u0413\u0438\u0442\u0445\u0430\u0431\u0435 \u0442\u0430\u0439\u043f\u0438\u043d\u0433\u0438 \u0412\u0435\u0431\u043f\u0430\u043a-\u043f\u043b\u0430\u0433\u0438\u043d\u043e\u0432, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043d\u044f\u0442\u044c, \u0447\u0442\u043e \u0436\u0435 \u043d\u0430 \u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435 \u0442\u0443\u0434\u0430 \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c. \u041c\u043d\u043e\u0433\u0438\u0435 \u0442\u043e\u043d\u043a\u043e\u0441\u0442\u0438 \u0432\u044b\u044f\u0441\u043d\u044f\u043b\u0438\u0441\u044c \u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u043e.<\/p>\n<p><strong>\u041d\u0443\u0436\u043d\u043e \u0433\u0434\u0435-\u0442\u043e \u0445\u0440\u0430\u043d\u0438\u0442\u044c \u0441\u0442\u0430\u0442\u0438\u043a\u0443.<\/strong><\/p>\n<p>\u041a\u0430\u043a \u0438 \u043f\u0438\u0441\u0430\u043b \u0432\u044b\u0448\u0435, \u0432 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u043e\u043a\u0430\u0437\u0430\u043b\u0430\u0441\u044c \u043d\u0435\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0439, \u043d\u043e \u0437\u0430\u0431\u044b\u0432\u0430\u0442\u044c \u043e \u043d\u0435\u0439 \u043d\u0435 \u0441\u0442\u043e\u0438\u0442. \u041d\u0430 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\u0445 \u043e\u043d\u0430 \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0438\u0432\u0435\u0441\u0442\u0438 \u043a \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u043c \u0440\u0430\u0431\u043e\u0442\u0430\u043c, \u0430 \u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e, \u0438 \u0437\u0430\u0442\u0440\u0430\u0442\u0430\u043c.<\/p>\n<p><strong>\u041e\u0448\u0438\u0431\u043a\u0430 \u0432 \u043c\u043e\u0434\u0443\u043b\u0435 \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0432\u043b\u0438\u044f\u0442\u044c \u043d\u0430 \u0432\u0435\u0441\u044c \u043f\u0440\u043e\u0435\u043a\u0442.<\/strong><\/p>\n<p>\u041a\u043e\u043d\u0435\u0447\u043d\u043e, \u043a\u0430\u0436\u0434\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c \u043e\u0431\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432 Error Boundary, \u043e\u043d \u043f\u043e\u043c\u043e\u0436\u0435\u0442 \u043e\u0442\u043b\u043e\u0432\u0438\u0442\u044c \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f, \u043d\u043e \u0435\u0441\u0442\u044c \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b, \u043e\u0442 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442-\u043f\u0440\u0435\u0434\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u0435\u043b\u044c \u043e\u0431\u0435\u0437\u043e\u043f\u0430\u0441\u0438\u0442\u044c \u043d\u0435 \u0441\u043c\u043e\u0436\u0435\u0442.<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440: \u0432\u0430\u0448 \u043f\u0440\u043e\u0435\u043a\u0442 \u0434\u043e\u043b\u0436\u0435\u043d \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u0432 IE11. \u0412 \u043a\u043e\u043d\u0444\u0438\u0433\u0435 Babel \u0434\u043e\u043f\u0443\u0449\u0435\u043d\u0430 \u043e\u0448\u0438\u0431\u043a\u0430 \u0438 \u043f\u0440\u043e\u0435\u043a\u0442 \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u0442\u0441\u044f \u0432 ES6. \u041e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0441\u0430\u0439\u0442 \u041b\u041a2, \u043f\u043e\u0434\u0433\u0440\u0443\u0436\u0430\u0435\u0442\u0441\u044f \u043c\u043e\u0434\u0443\u043b\u044c, \u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u043f\u0430\u0434\u0430\u0435\u0442: \u0432 \u043a\u043e\u0434 \u043f\u043e\u043f\u0430\u043b\u0430 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f, \u0430 \u0434\u043b\u044f IE \u044d\u0442\u043e \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u043e\u0448\u0438\u0431\u043a\u0430. \u041f\u043e\u0434\u043e\u0431\u043d\u044b\u0435 \u043e\u0448\u0438\u0431\u043a\u0438 \u043d\u0435 \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u043d\u044b Error Boundary.<\/p>\n<p>\u0412 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u0440\u0435\u0448\u0430\u0435\u0442\u0441\u044f \u0442\u0435\u043c, \u0447\u0442\u043e \u0432 \u0448\u0430\u0431\u043b\u043e\u043d\u043d\u043e\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u0432\u0441\u0435 \u044d\u0442\u0438 \u0442\u043e\u043d\u043a\u043e\u0441\u0442\u0438 \u0443\u0447\u0442\u0435\u043d\u044b, \u0430 \u043f\u043e\u0441\u043b\u0435 \u043e\u0444\u043e\u0440\u043c\u043b\u0435\u043d\u0438\u044f \u0448\u0430\u0431\u043b\u043e\u043d\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0432 \u0432\u0438\u0434\u0435 NPM-\u043f\u0430\u043a\u0435\u0442\u0430 \u0432\u0435\u0440\u043e\u044f\u0442\u043d\u043e\u0441\u0442\u044c \u0442\u0430\u043a\u043e\u0439 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0441\u0442\u0430\u043d\u0435\u0442 \u0435\u0449\u0451 \u043d\u0438\u0436\u0435. \u0422\u043e\u0433\u0434\u0430 \u0436\u0435 \u043c\u043e\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u044d\u0442\u0430\u043f\u044b \u043f\u0430\u0439\u043f\u043b\u0430\u0439\u043d\u0430 \u0441 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430\u043c\u0438, \u043d\u043e \u0432 \u043b\u044e\u0431\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u044d\u0442\u043e \u0432\u0435\u0434\u0435\u0442 \u043a \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u043c \u0440\u0430\u0431\u043e\u0442\u0430\u043c.<\/p>\n<p>\u0422\u0430\u043a \u0436\u0435, \u043a\u0430\u043a \u0438 \u0432 \u0441\u043b\u0443\u0447\u0430\u0435 \u0441 NPM-\u043f\u0430\u043a\u0435\u0442\u043e\u043c, \u043c\u043e\u0434\u0443\u043b\u044c \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0432\u043b\u0438\u044f\u0442\u044c \u043d\u0430 \u0434\u0430\u043d\u043d\u044b\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<p><strong>\u0421\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u0441 \u0442\u0438\u043f\u0438\u0437\u0430\u0446\u0438\u0435\u0439.<\/strong><\/p>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438 NPM-\u043f\u0430\u043a\u0435\u0442\u0430 \u0432 <code>node_modules\/some-package<\/code> \u043e\u043a\u0430\u0437\u044b\u0432\u0430\u044e\u0442\u0441\u044f <code>*.d.ts<\/code> \u0444\u0430\u0439\u043b\u044b, \u0432 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043e\u043f\u0438\u0441\u0430\u043d\u044b \u0442\u0438\u043f\u044b \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043f\u0430\u043a\u0435\u0442\u0430. \u0412 \u0441\u043b\u0443\u0447\u0430\u0435 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u0447\u0435\u0440\u0435\u0437 Module Federation \u0432 \u043d\u0430\u0448\u0435\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u043d\u0435\u0442 \u0444\u0430\u0439\u043b\u043e\u0432, \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u044e\u0449\u0438\u0445 \u0442\u0438\u043f\u044b \u043c\u043e\u0434\u0443\u043b\u044f: \u0435\u0441\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043c\u043e\u0434\u0443\u043b\u044c. \u0412 \u0441\u043b\u0443\u0447\u0430\u0435 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u0432 \u043f\u0440\u043e\u0435\u043a\u0442 \u044d\u0442\u043e \u043d\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u0442.\u043a. \u043c\u043e\u0434\u0443\u043b\u044c \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0443\u0435\u0442 \u0441 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435\u043c \u0447\u0435\u0440\u0435\u0437 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u044b \u0438\u0437 \u043f\u0430\u043a\u0435\u0442\u0430 <code>@five\/core<\/code>, \u0430 \u0432 \u041b\u041a2 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u043a\u0430\u043a React-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0441 \u043f\u0430\u0440\u043e\u0439 \u043f\u0440\u043e\u043f\u0441\u043e\u0432:<\/p>\n<ul>\n<li>\n<p><code>baseRoute<\/code> \u2014 \u0431\u0430\u0437\u043e\u0432\u044b\u0439 \u043f\u0443\u0442\u044c \u0434\u043b\u044f \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0433\u043e React-\u0440\u043e\u0443\u0442\u0438\u043d\u0433\u0430<\/p>\n<\/li>\n<li>\n<p><code>user<\/code> \u2014\u00a0\u043e\u0431\u044a\u0435\u043a\u0442 \u0441 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0435\u0439 \u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435.<\/p>\n<\/li>\n<\/ul>\n<p>\u042d\u0442\u0430 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u0441\u0442\u0430\u043d\u0435\u0442 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0439 \u0432 \u0441\u043b\u0443\u0447\u0430\u0435, \u0435\u0441\u043b\u0438 \u0432\u044b \u0440\u0435\u0448\u0438\u0442\u0435, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0447\u0435\u0440\u0435\u0437 Module Federation \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443 UI-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432. UI-\u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u0443\u044e\u0442 \u043c\u043d\u043e\u0433\u043e &#171;\u0433\u043b\u0443\u043f\u044b\u0445&#187; \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432, \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0437\u0430\u0440\u0430\u043d\u0435\u0435 \u0438\u0437\u0432\u0435\u0441\u0442\u0435\u043d, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0431\u0435\u0437 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e\u0439 \u0434\u0435\u043a\u043b\u0430\u0440\u0430\u0446\u0438\u0438 \u0442\u0438\u043f\u043e\u0432 \u043d\u0435 \u043e\u0431\u043e\u0439\u0442\u0438\u0441\u044c. \u041d\u0430 \u043c\u043e\u0439 \u0432\u0437\u0433\u043b\u044f\u0434, \u043f\u043e \u044d\u0442\u043e\u0439 \u043f\u0440\u0438\u0447\u0438\u043d\u0435 Module Federation \u043f\u043e\u043a\u0430 \u043d\u0435 \u043e\u0447\u0435\u043d\u044c \u0445\u043e\u0440\u043e\u0448\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u0438\u0442 \u0434\u043b\u044f \u0442\u0430\u043a\u0438\u0445 \u0446\u0435\u043b\u0435\u0439.<\/p>\n<h4>\u0412\u044b\u0432\u043e\u0434\u044b \u043f\u043e Module Federation<\/h4>\n<p>\u041a\u043e\u0440\u043e\u0442\u043a\u043e: \u043f\u0440\u043e\u0434\u043e\u043b\u0436\u0430\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c.<\/p>\n<p>\u0423 \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u0430 \u0435\u0441\u0442\u044c \u0438 \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430, \u0438 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0438, \u043d\u043e \u043d\u0430 \u0434\u0430\u043d\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u043e\u043d \u043a\u0430\u0436\u0435\u0442\u0441\u044f \u0441\u0430\u043c\u044b\u043c \u0443\u0434\u043e\u0431\u043d\u044b\u043c \u0438 \u043e\u043f\u0442\u0438\u043c\u0430\u043b\u044c\u043d\u044b\u043c. \u041d\u0430 \u043c\u043e\u0439 \u0432\u0437\u0433\u043b\u044f\u0434, \u0442\u0435\u043a\u0443\u0449\u0438\u0435 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0440\u0435\u0448\u0430\u044e\u0442\u0441\u044f \u0443\u0441\u043e\u0432\u0435\u0440\u0448\u0435\u043d\u0441\u0442\u0432\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c\u0430 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u0438 \u043d\u0435 \u0442\u0440\u0435\u0431\u0443\u044e\u0442 \u0447\u0435\u0433\u043e-\u0442\u043e \u043f\u0440\u0438\u043d\u0446\u0438\u043f\u0438\u0430\u043b\u044c\u043d\u043e \u043d\u043e\u0432\u043e\u0433\u043e. \u0417\u0430 \u043f\u043e\u043b\u0433\u043e\u0434\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f Module Federation \u0441\u044d\u043a\u043e\u043d\u043e\u043c\u0438\u043b \u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432 \u0438 \u043c\u0435\u043d\u0435\u0434\u0436\u0435\u0440\u043e\u0432, \u0430 \u044d\u0442\u043e \u0437\u043d\u0430\u0447\u0438\u0442, \u0447\u0442\u043e \u043a\u0440\u0430\u0439\u043d\u0435 \u043c\u0430\u043b\u0430 \u0432\u0435\u0440\u043e\u044f\u0442\u043d\u043e\u0441\u0442\u044c \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u0432 \u0441\u043a\u043e\u0440\u043e\u043c \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043c\u044b \u043e\u0442 \u043d\u0435\u0433\u043e \u043e\u0442\u043a\u0430\u0436\u0435\u043c\u0441\u044f.<\/p>\n<p><strong>\u041f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430:<\/strong><\/p>\n<ul>\n<li>\n<p>\u0423\u0434\u043e\u0431\u043d\u043e \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u0440\u0430\u0437\u0443 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432;<\/p>\n<\/li>\n<li>\n<p>\u041c\u043e\u0434\u0443\u043b\u0438 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u044e\u0442\u0441\u044f \u043a\u0430\u043a \u043e\u0431\u044b\u0447\u043d\u044b\u0435 React-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b;<\/p>\n<\/li>\n<li>\n<p>\u041b\u0435\u0433\u043a\u043e \u0437\u0430\u0441\u0435\u0442\u0430\u043f\u0438\u0442\u044c \u043d\u043e\u0432\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u0448\u0430\u0431\u043b\u043e\u043d\u0430;<\/p>\n<\/li>\n<li>\n<p>\u0412 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u043e\u0431\u0449\u0438\u0435 \u043c\u043e\u0434\u0443\u043b\u0438 \u0433\u0440\u0443\u0437\u044f\u0442\u0441\u044f \u043e\u0434\u0438\u043d \u0440\u0430\u0437.<\/p>\n<\/li>\n<\/ul>\n<p><strong>\u041d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0438:<\/strong><\/p>\n<ul>\n<li>\n<p>\u041e\u0447\u0435\u043d\u044c \u0441\u0432\u0435\u0436\u0430\u044f \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u044f;<\/p>\n<\/li>\n<li>\n<p>\u041d\u0443\u0436\u043d\u043e \u0433\u0434\u0435-\u0442\u043e \u0445\u0440\u0430\u043d\u0438\u0442\u044c \u0441\u0442\u0430\u0442\u0438\u043a\u0443;<\/p>\n<\/li>\n<li>\n<p>\u041e\u0448\u0438\u0431\u043a\u0430 \u0432 \u043c\u043e\u0434\u0443\u043b\u0435 \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0432\u043b\u0438\u044f\u0442\u044c \u043d\u0430 \u0432\u0435\u0441\u044c \u043f\u0440\u043e\u0435\u043a\u0442 \u0438 \u043d\u0430 \u0435\u0433\u043e \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435;<\/p>\n<\/li>\n<li>\n<p>\u0421\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u0441 \u0442\u0438\u043f\u0438\u0437\u0430\u0446\u0438\u0435\u0439.<\/p>\n<\/li>\n<\/ul>\n<p><a class=\"anchor\" name=\"mobile\" id=\"mobile\"><\/a><\/p>\n<h2>\u0412\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u043d\u0430\u0441, \u043d\u043e \u0438 \u043c\u044b!<\/h2>\n<p>\u041d\u0430 \u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435, \u041b\u041a2 \u2014 \u043d\u0435 \u0441\u0430\u043c\u044b\u0439 \u0432\u0435\u0440\u0445\u043d\u0438\u0439 \u0441\u043b\u043e\u0439 \u0432 \u044d\u0442\u043e\u0439 \u043c\u0430\u0442\u0440\u0451\u0448\u043a\u0435. \u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u043e\u0432 \u041f\u044f\u0442\u0451\u0440\u043e\u0447\u043a\u0438. \u041c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u0442 \u043b\u043e\u0433\u0438\u043a\u0443 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u0438 \u0438 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u0447\u043d\u044b\u0445 \u0444\u0443\u043d\u043a\u0446\u0438\u0439. \u041f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u0442 WebView, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0441\u0430\u0439\u0442 \u041b\u041a2. \u0412\u0441\u0435 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0431\u0438\u0437\u043d\u0435\u0441-\u043f\u0440\u043e\u0446\u0435\u0441\u0441\u044b \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d\u044b \u043d\u0430 \u043d\u0430\u0448\u0435\u0439 \u0441\u0442\u043e\u0440\u043e\u043d\u0435.<\/p>\n<p>\u0412\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u041b\u041a2 \u0441 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c \u0431\u0430\u0437\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043d\u0430 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0445 \u043c\u043e\u043c\u0435\u043d\u0442\u0430\u0445:<\/p>\n<ul>\n<li>\n<p>\u041f\u0440\u0438 \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043d\u0438\u0438 \u0447\u0435\u0440\u0435\u0437 WebView \u0432 <code>window<\/code> \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442 <code>MobileApp<\/code>. \u0427\u0435\u0440\u0435\u0437 \u043d\u0435\u0433\u043e <code>@five\/core<\/code> (\u0430 \u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e, \u0438 <code>lk2<\/code>) \u0443\u0437\u043d\u0430\u0435\u0442, \u0447\u0442\u043e \u0441\u0430\u0439\u0442 \u043e\u0442\u043a\u0440\u044b\u0442 \u0432 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0438 \u0430\u043a\u0442\u0438\u0432\u0438\u0440\u0443\u0435\u0442 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u0447\u043d\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0432\u043d\u0435\u0448\u043d\u0438\u0439 \u0432\u0438\u0434 \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u0438. \u0422\u0430\u043a\u0436\u0435 \u043e\u0431\u044a\u0435\u043a\u0442 <code>MobileApp<\/code> \u043d\u0443\u0436\u0435\u043d \u0434\u043b\u044f \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0438 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u043c\u0435\u0436\u0434\u0443 \u041b\u041a2 \u0438 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c.<\/p>\n<\/li>\n<li>\n<p><a href=\"#navigation_store\">\u0412\u044b\u0448\u0435<\/a> \u043f\u0438\u0441\u0430\u043b \u043f\u0440\u043e <code>navigationStore<\/code>. \u041f\u043e\u0432\u0442\u043e\u0440\u044e: \u044d\u0442\u043e\u0442 \u0441\u0442\u043e\u0440 \u0445\u0440\u0430\u043d\u0438\u0442 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043e \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0434\u043e\u0441\u0442\u0443\u043f\u0430\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432, \u0441 \u043a\u043e\u0442\u043e\u0440\u044b\u043c\u0438 \u043e\u0442\u043a\u0440\u044b\u0442 \u041b\u041a2. \u041f\u043b\u0430\u0442\u0444\u043e\u0440\u043c\u0430 \u2014\u00a0\u043e\u0434\u0438\u043d \u0438\u0437 \u0442\u0430\u043a\u0438\u0445 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432. \u041e\u043d \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0442\u044c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f:<\/p>\n<ul>\n<li>\n<p><code>web<\/code> \u2014\u00a0\u041b\u041a2 \u043e\u0442\u043a\u0440\u044b\u0442 \u0432 \u0434\u0435\u0441\u043a\u0442\u043e\u043f\u043d\u043e\u043c \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435;<\/p>\n<\/li>\n<li>\n<p><code>mobile<\/code> \u2014 \u041b\u041a2 \u043e\u0442\u043a\u0440\u044b\u0442 \u0432 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u043c \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435;<\/p>\n<\/li>\n<li>\n<p><code>android<\/code> \u2014 \u041b\u041a2 \u043e\u0442\u043a\u0440\u044b\u0442 \u0432 Android-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438;<\/p>\n<\/li>\n<li>\n<p><code>ios<\/code> \u2014\u00a0\u041b\u041a2 \u043e\u0442\u043a\u0440\u044b\u0442 \u0432 iOS-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438.<\/p>\n<\/li>\n<\/ul>\n<p>\u0412\u0438\u0434 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0442\u043e\u0436\u0435 \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u0442\u043e, \u043a\u0430\u043a\u0438\u0435 \u0440\u0430\u0437\u0434\u0435\u043b\u044b \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e.<\/p>\n<\/li>\n<\/ul>\n<h2>\u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435<\/h2>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/04a\/e62\/6d3\/04ae626d3ef89726458c5cb23d844f3e.png\" alt=\"\u0418\u0442\u043e\u0433\u043e\u0432\u0430\u044f \u0441\u0445\u0435\u043c\u0430 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430 \u041b\u041a2\" title=\"\u0418\u0442\u043e\u0433\u043e\u0432\u0430\u044f \u0441\u0445\u0435\u043c\u0430 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430 \u041b\u041a2\" width=\"2944\" height=\"1510\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/04a\/e62\/6d3\/04ae626d3ef89726458c5cb23d844f3e.png\"\/><\/p>\n<div><figcaption>\u0418\u0442\u043e\u0433\u043e\u0432\u0430\u044f \u0441\u0445\u0435\u043c\u0430 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430 \u041b\u041a2<\/figcaption><\/div>\n<\/figure>\n<p>\u0412 \u0438\u0442\u043e\u0433\u0435 \u0438\u043c\u0435\u0435\u043c \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0443 \u043a\u0430\u043a \u043d\u0430 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0435:<\/p>\n<ul>\n<li>\n<p>\u041c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u0442 <code>lk2<\/code> \u0432 WebView;<\/p>\n<\/li>\n<li>\n<p><code>lk2<\/code> \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 <code>@five\/core<\/code> \u0438 <code>@five\/uikit<\/code>, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u044b;<\/p>\n<\/li>\n<li>\n<p>\u041a\u0430\u0436\u0434\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0448\u0430\u0431\u043b\u043e\u043d\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0438 \u0442\u0430\u043a\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 <code>@five\/core<\/code> \u0438 <code>@five\/uikit<\/code>.<\/p>\n<\/li>\n<\/ul>\n<p>\u041d\u0430\u0434\u0435\u044e\u0441\u044c, \u0432\u044b \u0443\u0437\u043d\u0430\u043b\u0438 \u0447\u0442\u043e-\u0442\u043e \u043d\u043e\u0432\u043e\u0435, \u0438 \u044d\u0442\u0430 \u0441\u0442\u0430\u0442\u044c\u044f \u043f\u043e\u043c\u043e\u0436\u0435\u0442 \u0432\u0430\u043c \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u0435\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u043e\u0434\u043e\u0431\u043d\u044b\u0435 \u0441\u0438\u0441\u0442\u0435\u043c\u044b.<\/p>\n<p>\u041f\u043e\u0436\u0430\u043b\u0443\u0439\u0441\u0442\u0430, \u0434\u0435\u043b\u0438\u0442\u0435\u0441\u044c \u0432 \u043a\u043e\u043c\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u044f\u0445, \u043a\u0430\u043a\u0438\u043c\u0438 \u0441\u043f\u043e\u0441\u043e\u0431\u0430\u043c\u0438 \u0432\u044b \u0440\u0435\u0448\u0430\u043b\u0438 \u043f\u043e\u0445\u043e\u0436\u0438\u0435 \u0437\u0430\u0434\u0430\u0447\u0438, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0439\u0442\u0435 \u0443\u043b\u0443\u0447\u0448\u0435\u043d\u0438\u044f, \u0435\u0441\u043b\u0438 \u0432\u044b \u0437\u0430\u043c\u0435\u0442\u0438\u043b\u0438 \u043f\u0440\u043e\u0431\u0435\u043b\u044b \u0438\u043b\u0438 \u043d\u0435\u0442\u043e\u0447\u043d\u043e\u0441\u0442\u0438 \u0432 \u043c\u043e\u0451\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0435. \u0421\u043f\u0430\u0441\u0438\u0431\u043e)<\/p>\n<p>\u0412 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0445 \u0441\u0442\u0430\u0442\u044c\u044f\u0445 \u0443\u0436\u0435 \u0441 \u0442\u0435\u0445\u043d\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0442\u043e\u0447\u043a\u0438 \u0437\u0440\u0435\u043d\u0438\u044f \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u044e:<\/p>\n<ul>\n<li>\n<p>\u041f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 UI-\u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438;<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 <code>@five\/core<\/code>;<\/p>\n<\/li>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0448\u0430\u0431\u043b\u043e\u043d\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u043d\u0430\u043f\u043e\u0434\u043e\u0431\u0438\u0435 create-react-app;<\/p>\n<\/li>\n<li>\n<p>\u0422\u043e\u043d\u043a\u043e\u0441\u0442\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f Webpack Module Federation.<\/p>\n<\/li>\n<\/ul>\n<hr\/>\n<p><strong>\u0414\u0440\u0443\u0433\u0438\u0435 \u0441\u0442\u0430\u0442\u044c\u0438 \u043f\u0440\u043e frontend \u0434\u043b\u044f \u043d\u0430\u0447\u0438\u043d\u0430\u044e\u0449\u0438\u0445:<\/strong><\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/habr.com\/ru\/companies\/kts\/articles\/775948\/\">\u0420\u043e\u0430\u0434\u043c\u044d\u043f \u043f\u043e \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u043c\u0443 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0443 <\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/habr.com\/ru\/company\/kts\/blog\/576682\/\">\u041a\u0430\u043a \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0441\u0432\u043e\u0439 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0439 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440 \u043d\u0430 React.js<\/a><\/p>\n<\/li>\n<li>\n<p>\u041a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u044b:\u00a0<a href=\"https:\/\/habr.com\/ru\/company\/kts\/blog\/669784\/\">\u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044f \u0438 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0445<\/a>,\u00a0<a href=\"https:\/\/habr.com\/ru\/company\/kts\/blog\/678034\/\">\u043f\u0430\u0440\u0441\u0438\u043d\u0433 \u0438 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435 JS<\/a>,\u00a0<a href=\"https:\/\/habr.com\/ru\/company\/kts\/blog\/683240\/\">\u0434\u0435\u0440\u0435\u0432\u044c\u044f \u0441\u043f\u0435\u0446 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0435\u0439 \u0438 \u0440\u0435\u043d\u0434\u0435\u0440\u0438\u043d\u0433\u0430<\/a><\/p>\n<\/li>\n<\/ul>\n<p><strong>\u0414\u0440\u0443\u0433\u0438\u0435 \u0441\u0442\u0430\u0442\u044c\u0438 \u043f\u0440\u043e frontend \u0434\u043b\u044f \u043f\u0440\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u044b\u0445:<\/strong><\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/habr.com\/ru\/company\/kts\/blog\/560058\/\">\u041a\u0430\u043a \u043c\u044b \u0441\u0435\u0442\u0430\u043f\u0438\u043b\u0438 \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439 \u0441 SSR \u0438 SPA \u0434\u043b\u044f Otus.ru<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/habr.com\/ru\/company\/kts\/blog\/566176\/\">\u041a\u0430\u043a \u0441\u043e\u0431\u0440\u0430\u0442\u044c \u0441\u0432\u043e\u044e \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443 \u0434\u043b\u044f SSR \u043d\u0430 React<\/a><\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<\/div>\n<p><!----><!----><\/div>\n<p><!----><!----><br \/> \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 <a href=\"https:\/\/habr.com\/ru\/articles\/569448\/\"> https:\/\/habr.com\/ru\/articles\/569448\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<div><!--[--><!--]--><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<figure class=\"full-width\"><\/figure>\n<p>\u0412\u0441\u0435\u043c \u043f\u0440\u0438\u0432\u0435\u0442! \u041c\u0435\u043d\u044f \u0437\u043e\u0432\u0443\u0442 \u0412\u0438\u0442\u0430\u043b\u0438\u0439, \u044f \u0432\u0435\u0434\u0443\u0449\u0438\u0439 frontend-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0432 KTS.<\/p>\n<p>\u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u044f \u0434\u0435\u043b\u044e\u0441\u044c \u043e\u043f\u044b\u0442\u043e\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u044b frontend-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0443\u0435\u0442 \u0441 \u0431\u043e\u043b\u044c\u0448\u0438\u043c \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e\u043c \u0432\u043d\u0435\u0448\u043d\u0438\u0445 \u0441\u0438\u0441\u0442\u0435\u043c. \u0424\u0440\u043e\u043d\u0442\u0435\u043d\u0434 \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u0433\u043b\u0430\u0432\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0438 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u2014\u00a0\u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u043e\u0432. \u0413\u043b\u0430\u0432\u043d\u044b\u0439 \u043f\u0440\u043e\u0435\u043a\u0442 \u0434\u0435\u043b\u0430\u0435\u043c \u043c\u044b \u0432 KTS, \u0430 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0442 \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u0435 \u043a\u043e\u043c\u0430\u043d\u0434\u044b.<\/p>\n<p>\u0412 \u0441\u0442\u0430\u0442\u044c\u0435 \u043c\u044b \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0430\u0441\u043f\u0435\u043a\u0442\u044b:<\/p>\n<ul>\n<li>\n<p><a href=\"#architecture_lk2\">\u0410\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0430 \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#uikit\">\u0427\u0442\u043e \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432 UI-\u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0435<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#core\">\u0421\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u044f\u0434\u0440\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#microfrontends\">\u041c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u044b<\/a>. \u041c\u044b \u043f\u043e\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u043b\u0438 \u0442\u0440\u0438 \u043f\u043e\u0434\u0445\u043e\u0434\u0430 \u043a\u043e \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043d\u0438\u044e \u043c\u043e\u0434\u0443\u043b\u0435\u0439. \u0412 \u0441\u0442\u0430\u0442\u044c\u0435 \u043f\u0440\u043e\u0430\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u0435\u043c \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430 \u0438 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0438 \u043a\u0430\u0436\u0434\u043e\u0433\u043e. \u041f\u043e\u0434\u0435\u043b\u044e\u0441\u044c, \u043f\u043e\u0447\u0435\u043c\u0443 \u043c\u044b \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043b\u0438 \u043e\u0442 \u043e\u0434\u043d\u043e\u0433\u043e \u0441\u043f\u043e\u0441\u043e\u0431\u0430 \u043a \u0434\u0440\u0443\u0433\u043e\u043c\u0443.<\/p>\n<ul>\n<li>\n<p><a href=\"#iframe\">iframe<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#npm\">NPM-\u043f\u0430\u043a\u0435\u0442\u044b<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#wmf\">Webpack Module Federation<\/a><\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><a href=\"#mobile\">\u041a\u0430\u043a \u043c\u044b \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043b\u0438 \u0441\u0432\u043e\u0439 \u0441\u0435\u0440\u0432\u0438\u0441 \u0432 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435<\/a><\/p>\n<\/li>\n<\/ul>\n<h2>\u041f\u044f\u0442\u0451\u0440\u043e\u0447\u043a\u0430, \u0447\u0442\u043e \u0442\u044b?<\/h2>\n<p>\u0414\u0432\u0430 \u0433\u043e\u0434\u0430 \u043d\u0430\u0437\u0430\u0434 \u0432 KTS \u043f\u0440\u0438\u0448\u0435\u043b X5 Retail Group \u0441 \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u043c \u043d\u043e\u0432\u043e\u0433\u043e \u043b\u0438\u0447\u043d\u043e\u0433\u043e \u043a\u0430\u0431\u0438\u043d\u0435\u0442\u0430 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430 \u041f\u044f\u0442\u0451\u0440\u043e\u0447\u043a\u0438 \u2014\u00a0\u041b\u041a2. \u0427\u0435\u0440\u0435\u0437 \u043b\u0438\u0447\u043d\u044b\u0439 \u043a\u0430\u0431\u0438\u043d\u0435\u0442 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0437\u0430\u0440\u043f\u043b\u0430\u0442\u0443 \u0438 \u0440\u0430\u0431\u043e\u0447\u0435\u0435 \u0440\u0430\u0441\u043f\u0438\u0441\u0430\u043d\u0438\u0435, \u0437\u0430\u043f\u043b\u0430\u043d\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0438 \u0441\u043e\u0433\u043b\u0430\u0441\u043e\u0432\u0430\u0442\u044c \u043e\u0442\u043f\u0443\u0441\u043a, \u0437\u0430\u043f\u0440\u043e\u0441\u0438\u0442\u044c \u0441\u043f\u0440\u0430\u0432\u043a\u0438 \u0441 \u043c\u0435\u0441\u0442\u0430 \u0440\u0430\u0431\u043e\u0442\u044b, \u043f\u043e\u0434\u043f\u0438\u0441\u0430\u0442\u044c \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u044b \u044d\u043b\u0435\u043a\u0442\u0440\u043e\u043d\u043d\u043e\u0439 \u043f\u043e\u0434\u043f\u0438\u0441\u044c\u044e \u0438 \u0442.\u0434. \u0420\u0443\u043a\u043e\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c \u043d\u0430\u043d\u0438\u043c\u0430\u0435\u0442, \u0443\u0432\u043e\u043b\u044c\u043d\u044f\u0435\u0442 \u0438\u043b\u0438 \u043f\u0435\u0440\u0435\u0432\u043e\u0434\u0438\u0442 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430, \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 \u043a\u043e\u043c\u0430\u043d\u0434\u043e\u0439&#8230; \u0412 \u043e\u0431\u0449\u0435\u043c, \u044d\u0442\u043e \u043f\u0440\u043e\u0434\u0443\u043a\u0442 \u0441 \u043e\u0433\u0440\u043e\u043c\u043d\u044b\u043c \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e\u043c \u0431\u0438\u0437\u043d\u0435\u0441-\u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432, \u0440\u043e\u043b\u0435\u0439 \u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u043e\u0432.<\/p>\n<p>\u041c\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432 \u0443\u0436\u0435 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043b\u043e\u0441\u044c \u0432 \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u044b\u0445 \u0441\u0435\u0440\u0432\u0438\u0441\u0430\u0445, \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u044b \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u043b\u0438\u0441\u044c \u0432\u0440\u0443\u0447\u043d\u0443\u044e. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u043e\u0434\u0443\u043a\u0442 \u043e\u043f\u0440\u0430\u0432\u0434\u044b\u0432\u0430\u043b \u043e\u0436\u0438\u0434\u0430\u043d\u0438\u044f, \u0440\u0430\u0431\u043e\u0442\u0430 \u0434\u043e\u043b\u0436\u043d\u0430 \u0438\u0434\u0442\u0438 \u0431\u044b\u0441\u0442\u0440\u043e. \u041a\u043e\u043d\u0435\u0447\u043d\u0430\u044f \u0446\u0435\u043b\u044c \u2014 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u043f\u0440\u043e\u0434\u0443\u043a\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u044f\u0435\u0442 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0432\u0441\u0435\u0445 \u0441\u0438\u0441\u0442\u0435\u043c \u0432 \u043e\u0434\u043d\u043e\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438.<\/p>\n<p>\u0427\u0430\u0441\u0442\u043e \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u044b \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u044b \u2014 \u043e\u043d\u0438 \u043d\u0435 \u0432\u043b\u0438\u044f\u044e\u0442 \u0434\u0440\u0443\u0433 \u043d\u0430 \u0434\u0440\u0443\u0433\u0430, \u0438 \u0438\u0445 \u043c\u043e\u0436\u043d\u043e \u0440\u0430\u0437\u0432\u0438\u0432\u0430\u0442\u044c \u043f\u0430\u0440\u0430\u043b\u043b\u0435\u043b\u044c\u043d\u043e. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0440\u0430\u0437\u0434\u0435\u043b \u0440\u0430\u0441\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430 \u043c\u043e\u0436\u043d\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u0441 \u0440\u0430\u0437\u0434\u0435\u043b\u043e\u043c \u0432\u044b\u043f\u043b\u0430\u0442. \u042d\u0442\u043e \u0437\u043d\u0430\u0447\u0438\u0442, \u0447\u0442\u043e \u043f\u0440\u043e\u0435\u043a\u0442 \u043c\u043e\u0436\u043d\u043e \u0440\u0430\u0437\u0434\u0435\u043b\u0438\u0442\u044c \u043c\u0435\u0436\u0434\u0443 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c\u0438 \u043a\u043e\u043c\u0430\u043d\u0434\u0430\u043c\u0438 \u0438 \u0437\u0430 \u0441\u0447\u0435\u0442 \u044d\u0442\u043e\u0433\u043e \u0443\u0432\u0435\u043b\u0438\u0447\u0438\u0442\u044c \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0430 \u043d\u0430 \u043d\u043e\u0432\u044b\u0439 \u043f\u043e\u0440\u0442\u0430\u043b.<\/p>\n<p>\u0421\u043f\u0443\u0441\u0442\u044f \u043f\u043e\u043b\u0433\u043e\u0434\u0430 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 MVP \u0441\u0444\u043e\u0440\u043c\u0438\u0440\u043e\u0432\u0430\u043b\u043e\u0441\u044c \u044f\u0434\u0440\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0438 \u043f\u043e\u044f\u0432\u0438\u043b\u0430\u0441\u044c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0440\u0430\u0441\u043f\u0430\u0440\u0430\u043b\u043b\u0435\u043b\u0438\u0442\u044c \u0440\u0430\u0431\u043e\u0442\u044b. \u0417\u0434\u0435\u0441\u044c \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442\u0441\u044f \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e\u0435: \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u044c \u043f\u0430\u0440\u0430\u043b\u043b\u0435\u043b\u044c\u043d\u043e\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u041b\u041a2 \u0437\u0430\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u043f\u0440\u043e\u0434\u0443\u043a\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043d\u0435 \u0435\u0434\u0438\u043d\u043e\u0439 \u043a\u043e\u043c\u0430\u043d\u0434\u043e\u0439 \u0438 \u0434\u0430\u0436\u0435 \u043d\u0435 \u043e\u0434\u043d\u043e\u0439 \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u0435\u0439, \u0430 \u043c\u043d\u043e\u0433\u0438\u043c\u0438 \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u044b\u043c\u0438 \u043a\u043e\u043c\u0430\u043d\u0434\u0430\u043c\u0438 \u0438 \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u044f\u043c\u0438. \u0412 \u0442\u0430\u043a\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435 \u043d\u0435\u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0432 \u043e\u0434\u043d\u043e\u043c \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0438, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u044d\u0442\u043e \u0441\u0440\u0430\u0437\u0443 \u0436\u0435 \u043f\u0440\u0438\u0432\u0435\u043b\u043e \u0431\u044b \u043a \u0445\u0430\u043e\u0441\u0443. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u043d\u0443\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u043f\u0440\u0438\u0434\u0443\u043c\u0430\u0442\u044c \u0443\u0434\u043e\u0431\u043d\u044b\u0439 \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u043c\u043d\u043e\u0433\u0438\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u0432 \u0438 \u0438\u0445 \u0438\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u0438 \u0432 \u0431\u0430\u0437\u043e\u0432\u044b\u0439 \u043f\u0440\u043e\u0435\u043a\u0442.<\/p>\n<p><a class=\"anchor\" name=\"architecture_lk2\" id=\"architecture_lk2\"><\/a><\/p>\n<h2>\u0410\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0430 \u041b\u041a2<\/h2>\n<p>\u0411\u0430\u0437\u043e\u0432\u044b\u0439 \u043f\u0440\u043e\u0435\u043a\u0442 \u041b\u041a2 \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u043c \u043c\u044b \u0432 KTS. \u0412 \u041b\u041a2 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442\u0441\u044f \u043a\u043e\u0440\u043d\u0435\u0432\u0430\u044f \u043b\u043e\u0433\u0438\u043a\u0430 \u0438 \u0431\u043e\u043b\u044c\u0448\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0431\u0438\u0437\u043d\u0435\u0441-\u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432. \u0418 \u043c\u044b \u0436\u0435 \u0437\u0430\u043d\u0438\u043c\u0430\u0435\u043c\u0441\u044f \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435\u043c \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u0434\u0440\u0443\u0433\u0438\u0445 \u043a\u043e\u043c\u0430\u043d\u0434.<\/p>\n<p>\u0417\u0430\u0444\u0438\u043a\u0441\u0438\u0440\u0443\u0435\u043c \u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043d\u0438\u044f \u0438 \u043f\u0440\u0438\u043d\u0446\u0438\u043f\u044b, \u0438\u0441\u0445\u043e\u0434\u044f \u0438\u0437 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043c\u044b \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043b\u0438 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0443:<\/p>\n<ul>\n<li>\n<p>\u041f\u0440\u043e\u0435\u043a\u0442 \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0432 \u043e\u0434\u043d\u043e\u043c \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u043c \u0441\u0442\u0438\u043b\u0435;<\/p>\n<\/li>\n<li>\n<p>\u0414\u043b\u044f \u0443\u0434\u043e\u0431\u0441\u0442\u0432\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043f\u0440\u043e\u0435\u043a\u0442 \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c SPA;<\/p>\n<\/li>\n<li>\n<p>\u0410\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u044f, \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044f \u0438 \u0434\u0440. \u2014\u00a0\u044d\u0442\u043e \u0431\u0430\u0437\u043e\u0432\u0430\u044f \u043b\u043e\u0433\u0438\u043a\u0430\u00a0\u044f\u0434\u0440\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u0412\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u044f\u0434\u0440\u043e\u043c \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c \u043f\u0440\u0435\u0434\u0441\u043a\u0430\u0437\u0443\u0435\u043c\u044b\u043c, \u0435\u0434\u0438\u043d\u043e\u043e\u0431\u0440\u0430\u0437\u043d\u044b\u043c \u0438 \u043b\u0435\u0433\u043a\u0438\u043c \u0434\u043b\u044f \u0432\u0441\u0435\u0445 \u043a\u043e\u043c\u0430\u043d\u0434;<\/p>\n<\/li>\n<li>\n<p>\u0421\u0442\u043e\u0440\u043e\u043d\u043d\u044f\u044f \u043a\u043e\u043c\u0430\u043d\u0434\u0430 \u0434\u043e\u043b\u0436\u043d\u0430 \u0437\u0430\u0442\u0440\u0430\u0442\u0438\u0442\u044c \u043c\u0438\u043d\u0438\u043c\u0443\u043c \u0443\u0441\u0438\u043b\u0438\u0439, \u0447\u0442\u043e\u0431\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u043c\u043e\u0434\u0443\u043b\u044c \u0438 \u0432\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0435\u0433\u043e \u0432 \u041b\u041a2.<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u0440\u043e\u0435\u043a\u0442 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0438\u0437 \u0441\u0435\u0431\u044f <a href=\"https:\/\/ru.wikipedia.org\/wiki\/%D0%9C%D0%BE%D0%BD%D0%BE%D1%80%D0%B5%D0%BF%D0%BE%D0%B7%D0%B8%D1%82%D0%BE%D1%80%D0%B8%D0%B9\">\u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439<\/a>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0442\u0440\u0438 \u043f\u0430\u043a\u0435\u0442\u0430:<\/p>\n<ul>\n<li>\n<p><code>lk2<\/code> \u2014\u00a0\u0433\u043b\u0430\u0432\u043d\u044b\u0439 \u043f\u0430\u043a\u0435\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u0442 \u0432\u0441\u044e \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0443. <code>lk2<\/code> \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u043f\u0430\u043a\u0435\u0442\u044b \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0438\u043c\u0435\u043d\u043d\u043e \u0432 \u043d\u0435\u0433\u043e \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u044e\u0442\u0441\u044f \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u0435 \u043c\u043e\u0434\u0443\u043b\u0438.<\/p>\n<\/li>\n<\/ul>\n<p>\u0421\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0434\u0432\u0430 \u043f\u0430\u043a\u0435\u0442\u0430 \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442 \u0432\u0441\u0435 \u043a\u043e\u043c\u0430\u043d\u0434\u044b, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043c\u044b \u043f\u0443\u0431\u043b\u0438\u043a\u0443\u0435\u043c \u0438\u0445 \u0432 \u043f\u0440\u0438\u0432\u0430\u0442\u043d\u043e\u043c NPM-registry.<\/p>\n<ul>\n<li>\n<p><code>@five\/uikit<\/code> \u2014 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 UI-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432;<\/p>\n<\/li>\n<li>\n<p><code>@five\/core<\/code> \u2014\u00a0\u044f\u0434\u0440\u043e \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0441\u0442\u043e\u0440\u044b, React-\u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u044b \u0438 \u0447\u0430\u0441\u0442\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043e \u0442\u043e\u043c, \u043a\u0430\u043a \u0437\u0430\u0441\u0435\u0442\u0430\u043f\u0438\u0442\u044c \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439, \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u0432 <a href=\"https:\/\/habr.com\/ru\/company\/kts\/blog\/553806\/\">\u043d\u0430\u0448\u0435\u0439 \u0441\u0442\u0430\u0442\u044c\u0435<\/a>.<\/p>\n<p>\u041d\u0430 \u0440\u0438\u0441\u0443\u043d\u043a\u0435 \u043d\u0438\u0436\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0430 \u043f\u043e\u043b\u0443\u0447\u0438\u0432\u0448\u0430\u044f\u0441\u044f \u0441\u0445\u0435\u043c\u0430.<\/p>\n<figure class=\"full-width\">\n<div><figcaption>\u0422\u0435\u043a\u0443\u0449\u0430\u044f \u0441\u0445\u0435\u043c\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430<\/figcaption><\/div>\n<\/figure>\n<p>\u041f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430 \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f \u0441\u043b\u0435\u0434\u0443\u044e\u0442 \u0438\u0437 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u043f\u0440\u043e\u0435\u043a\u0442 \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u0435\u0434\u0438\u043d\u043e\u0439 \u043a\u043e\u0434\u043e\u0432\u043e\u0439 \u0431\u0430\u0437\u044b:<\/p>\n<ul>\n<li>\n<p><code>@five\/uikit<\/code> \u0438 <code>@five\/core<\/code> \u0447\u0430\u0441\u0442\u043e \u0434\u043e\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0442\u0441\u044f. \u042d\u0442\u0438 \u043f\u0430\u043a\u0435\u0442\u044b \u0432\u0445\u043e\u0434\u044f\u0442 \u0432 \u043c\u043e\u043d\u043e\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043f\u043e\u0441\u043b\u0435 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0438\u0445 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u0442\u044c \u043d\u043e\u0432\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e. \u0412\u043e \u0432\u0440\u0435\u043c\u044f \u0441\u0431\u043e\u0440\u043a\u0438 <code>lk2<\/code> \u0431\u0443\u0434\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d \u043a\u043e\u0434 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a \u043d\u0435 \u0438\u0437 registry, \u0430 \u0438\u0437 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043e\u043d \u0432\u0441\u0435\u0433\u0434\u0430 \u0430\u043a\u0442\u0443\u0430\u043b\u0435\u043d. \u041d\u043e\u0432\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e \u043f\u0443\u0431\u043b\u0438\u043a\u0443\u0435\u043c \u0442\u043e\u043b\u044c\u043a\u043e \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u043c \u043a\u043e\u043c\u0430\u043d\u0434\u0430\u043c.<\/p>\n<\/li>\n<li>\n<p>\u0423\u0434\u043e\u0431\u043d\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u0435\u043a\u0442 \u043f\u043e \u0432\u0435\u0442\u043a\u0430\u043c: \u0438 \u0432 <code>@five\/uikit<\/code> \u0438 \u0432 <code>@five\/core<\/code> \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u0447\u043d\u044b\u0435 \u0434\u043b\u044f \u0432\u0435\u0442\u043a\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p>\u041e\u0440\u0438\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0432 \u043e\u0434\u043d\u043e\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u0433\u043e\u0440\u0430\u0437\u0434\u043e \u043f\u0440\u043e\u0449\u0435, \u0447\u0435\u043c \u0432 \u0442\u0440\u0451\u0445 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\u0445.<\/p>\n<\/li>\n<\/ul>\n<p><a class=\"anchor\" name=\"uikit\" id=\"uikit\"><\/a><\/p>\n<h2>UI-\u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 @five\/uikit<\/h2>\n<p><code>@five\/uikit<\/code>\u00a0\u2014\u00a0\u044d\u0442\u043e \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 UI-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432. \u0412 \u043d\u0435\u0451 \u043c\u044b \u0432\u044b\u043d\u043e\u0441\u0438\u043c \u0432\u0441\u0435 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b: \u043a\u043d\u043e\u043f\u043a\u0438, \u043f\u0430\u043d\u0435\u043b\u0438, \u043a\u0430\u043b\u0435\u043d\u0434\u0430\u0440\u0438 \u0438 \u0442.\u0434. \u041a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0438\u0437 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0432\u043e \u0432\u0441\u0435\u0445 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430\u0445 \u0438 \u043d\u0435 \u0437\u0430\u0432\u044f\u0437\u0430\u043d\u044b \u043d\u0430 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0435.<\/p>\n<figure class=\"full-width\">\n<div><figcaption>\u041f\u0440\u0438\u043c\u0435\u0440 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u0438\u0437 @five\/uikit<\/figcaption><\/div>\n<\/figure>\n<p>NPM-\u043f\u0430\u043a\u0435\u0442\u044b \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u043c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e Rollup. \u042d\u0442\u043e\u0442 \u0441\u0431\u043e\u0440\u0449\u0438\u043a, \u0432 \u043e\u0442\u043b\u0438\u0447\u0438\u0435 \u043e\u0442 Webpack, \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u0442 ES-\u043c\u043e\u0434\u0443\u043b\u0438 \u0438 \u043b\u0443\u0447\u0448\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u0438\u0442 \u0434\u043b\u044f \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a. \u041d\u0430 \u043c\u043e\u043c\u0435\u043d\u0442 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u0441\u0442\u0430\u0442\u044c\u0438 \u0432 \u043f\u044f\u0442\u043e\u043c \u0412\u0435\u0431\u043f\u0430\u043a\u0435 \u0443\u0436\u0435 \u043f\u043e\u044f\u0432\u0438\u043b\u0430\u0441\u044c \u0441\u0431\u043e\u0440\u043a\u0430 ES-\u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u0432 \u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435. \u041a\u043e\u0433\u0434\u0430 \u044d\u0442\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0441\u0442\u0430\u043d\u0435\u0442 \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u043e\u0439, \u043c\u044b \u043e\u0442\u043a\u0430\u0436\u0435\u043c\u0441\u044f \u043e\u0442 Rollup \u0432 \u043f\u043e\u043b\u044c\u0437\u0443 Webpack, \u0447\u0442\u043e\u0431\u044b \u0441\u0431\u043e\u0440\u043a\u0438 \u043d\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u043b\u0438\u0441\u044c \u043e\u0434\u043d\u0438\u043c \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u043c.<\/p>\n<p>\u0414\u043b\u044f \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c <a href=\"https:\/\/storybook.js.org\/\">Storybook<\/a>.<\/p>\n<p>\u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043e \u0442\u043e\u043c, \u043a\u0430\u043a \u0441\u043e\u0431\u0440\u0430\u0442\u044c \u0441\u0432\u043e\u044e UI-\u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443, \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443 \u0432 \u043e\u0434\u043d\u043e\u0439 \u0438\u0437 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0445 \u0441\u0442\u0430\u0442\u0435\u0439. \u200b<\/p>\n<p><a class=\"anchor\" name=\"core\" id=\"core\"><\/a><\/p>\n<h2>\u042f\u0434\u0440\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 @five\/core<\/h2>\n<p><code>@five\/core<\/code> \u2014\u00a0\u044d\u0442\u043e \u044f\u0434\u0440\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u0415\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 <code>lk2<\/code> \u0438 \u043a\u0430\u0436\u0434\u044b\u0439 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434.<\/p>\n<h3>\u0421\u0442\u043e\u0440\u044b<\/h3>\n<p>\u0412 \u043f\u0435\u0440\u0432\u0443\u044e \u043e\u0447\u0435\u0440\u0435\u0434\u044c <code>core<\/code> \u043d\u0443\u0436\u0435\u043d \u0434\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u0443 \u0432\u0441\u0435\u0445 \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c\u044b\u0445 \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u0431\u044b\u043b \u043e\u0431\u0449\u0438\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e \u0441\u0435\u0441\u0441\u0438\u0438 \u0438 \u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 <code>core<\/code> \u0432\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u0432 \u0441\u0435\u0431\u044f \u0431\u0430\u0437\u043e\u0432\u044b\u0435 Redux-\u0441\u0442\u043e\u0440\u044b.<\/p>\n<ul>\n<li>\n<p><code>userStore<\/code> \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0434\u0430\u043d\u043d\u044b\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u042d\u0442\u043e\u0442 \u0441\u0442\u043e\u0440 \u0438\u0441\u043f\u0443\u0441\u043a\u0430\u0435\u0442 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0435 Redux-\u044d\u043a\u0448\u0435\u043d\u044b. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u044d\u043a\u0448\u0435\u043d <code>USER_NOT_AUTHORIZED<\/code> \u0441\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442, \u043a\u043e\u0433\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0440\u0430\u0437\u043b\u043e\u0433\u0438\u043d\u0438\u043b\u0441\u044f \u0438\u043b\u0438 \u0437\u0430\u043f\u0440\u043e\u0441 \u043a api \u0437\u0430\u0432\u0435\u0440\u0448\u0438\u043b\u0441\u044f \u0441\u043e \u0441\u0442\u0430\u0442\u0443\u0441\u043e\u043c 401. \u041d\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u044d\u0442\u0438 \u044d\u043a\u0448\u0435\u043d\u044b \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u043c\u0438, \u0442.\u043a. \u043e\u043d\u0438 \u043f\u0440\u0435\u0434\u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u044b \u0432\u0441\u0435\u043c\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044e, \u0438 \u0438\u0445 \u0434\u043e\u043b\u0436\u0435\u043d \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u043a\u0430\u0436\u0434\u044b\u0439 \u0441\u0442\u043e\u0440. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0435\u0440\u0435\u0442\u0435\u0440\u0435\u0442\u044c \u0438\u043b\u0438 \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435.<\/p>\n<\/li>\n<li>\n<p>\u0412\u0441\u0435 \u0437\u0430\u043f\u0440\u043e\u0441\u044b \u043a API \u043f\u0440\u043e\u0445\u043e\u0434\u044f\u0442 \u0447\u0435\u0440\u0435\u0437 <code>apiStore<\/code>. \u0412 \u043d\u0451\u043c \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0442\u0441\u044f \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0435 \u043e\u0448\u0438\u0431\u043a\u0438:<\/p>\n<ul>\n<li>\n<p>\u0432 \u0441\u043b\u0443\u0447\u0430\u0435 \u043e\u0442\u0432\u0435\u0442\u0430 \u0441\u043e \u0441\u0442\u0430\u0442\u0443\u0441\u043e\u043c 401 \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u044d\u043a\u0440\u0430\u043d \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u0438;<\/p>\n<\/li>\n<li>\n<p>\u0432 \u0441\u043b\u0443\u0447\u0430\u0435 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0438\u0445 \u043e\u0448\u0438\u0431\u043e\u043a \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435.<\/p>\n<\/li>\n<\/ul>\n<p>\u0418\u043c\u0435\u043d\u043d\u043e \u0431\u043b\u0430\u0433\u043e\u0434\u0430\u0440\u044f \u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u0432\u0441\u0435 \u0437\u0430\u043f\u0440\u043e\u0441\u044b \u043f\u0440\u043e\u0445\u043e\u0434\u044f\u0442 \u0447\u0435\u0440\u0435\u0437 <code>apiStore<\/code>, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0438 \u043d\u0430 \u043b\u044e\u0431\u043e\u0439 \u0437\u0430\u043f\u0440\u043e\u0441 \u0438 \u0438\u043d\u0438\u0446\u0438\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0435 \u044d\u043a\u0448\u0435\u043d\u044b, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, <code>USER_NOT_AUTHORIZED<\/code>. \u0412 <code>apiStore<\/code> \u043d\u0435\u0442 \u0441\u0432\u043e\u0435\u0433\u043e Redux-\u0441\u0442\u0435\u0439\u0442\u0430, \u043e\u043d \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0442\u043e\u043b\u044c\u043a\u043e <a href=\"https:\/\/github.com\/reduxjs\/redux-thunk\">thunk<\/a>-\u044d\u043a\u0448\u0435\u043d\u044b \u0438 \u0432\u0441\u043f\u043e\u043c\u043e\u0433\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0443\u0442\u0438\u043b\u0438\u0442\u044b.<\/p>\n<\/li>\n<\/ul>\n<p><a class=\"anchor\" name=\"navigation_store\" id=\"navigation_store\"><\/a><\/p>\n<ul>\n<li>\n<p><code>navigationStore<\/code>. \u041a\u0430\u043a \u043f\u0438\u0441\u0430\u043b \u0432\u044b\u0448\u0435, \u043b\u0438\u0447\u043d\u044b\u043c \u043a\u0430\u0431\u0438\u043d\u0435\u0442\u043e\u043c \u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0438 \u0441 \u0440\u0430\u0437\u043d\u044b\u043c\u0438 \u0440\u043e\u043b\u044f\u043c\u0438. \u0420\u043e\u043b\u044c \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e\u0441\u0442\u044c \u0440\u0430\u0437\u0434\u0435\u043b\u0430. \u0423 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430 \u043c\u0430\u0433\u0430\u0437\u0438\u043d\u0430 \u0435\u0441\u0442\u044c \u0440\u0430\u0437\u0434\u0435\u043b \u0441 \u0433\u0440\u0430\u0444\u0438\u043a\u043e\u043c \u0440\u0430\u0431\u043e\u0442\u044b, \u0430 \u0443 \u043e\u0444\u0438\u0441\u043d\u043e\u0433\u043e \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430 \u044d\u0442\u043e\u0433\u043e \u0440\u0430\u0437\u0434\u0435\u043b\u0430 \u043d\u0435\u0442, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043e\u0444\u0438\u0441\u043d\u044b\u0439 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0441 \u043f\u043e\u043d\u0435\u0434\u0435\u043b\u044c\u043d\u0438\u043a\u0430 \u043f\u043e \u043f\u044f\u0442\u043d\u0438\u0446\u0443. \u0418\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043e \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0445 \u0440\u0430\u0437\u0434\u0435\u043b\u0430\u0445 \u0437\u0430\u043f\u043e\u043b\u043d\u044f\u0435\u0442 \u043d\u0430\u0448 \u043c\u0435\u043d\u0435\u0434\u0436\u0435\u0440 \u0432 \u043f\u0430\u043d\u0435\u043b\u0438 \u0430\u0434\u043c\u0438\u043d\u0438\u0441\u0442\u0440\u0430\u0442\u043e\u0440\u0430.<\/p>\n<p>\u0412 <code>navigationStore<\/code> \u0445\u0440\u0430\u043d\u0438\u0442\u0441\u044f \u043a\u043e\u043d\u0444\u0438\u0433 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u044b\u0447\u0438\u0441\u043b\u044f\u0435\u0442\u0441\u044f \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0435\u0433\u043e \u0434\u0430\u043d\u043d\u044b\u0445. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043c\u043e\u0436\u0435\u043c \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u0431\u0430\u043d\u043d\u0435\u0440 \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u043c \u0440\u0435\u0433\u0438\u043e\u043d\u0435 \u0438\u043b\u0438 \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u043a\u043d\u043e\u043f\u043a\u0443 \u0434\u043b\u044f \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u043e\u0432 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u0439 \u0434\u043e\u043b\u0436\u043d\u043e\u0441\u0442\u0438.<\/p>\n<p>\u0418\u0442\u043e\u0433\u043e: <code>navigationStore<\/code> \u0445\u0440\u0430\u043d\u0438\u0442 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043e \u0434\u043e\u0441\u0442\u0443\u043f\u0430\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432, \u0441 \u043a\u043e\u0442\u043e\u0440\u044b\u043c\u0438 \u043e\u0442\u043a\u0440\u044b\u0442 \u041b\u041a2:<\/p>\n<ul>\n<li>\n<p>\u0441\u0435\u0441\u0441\u0438\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f;<\/p>\n<\/li>\n<li>\n<p>\u043f\u043b\u0430\u0442\u0444\u043e\u0440\u043c\u0430, \u0441 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043e\u0442\u043a\u0440\u044b\u0442 \u041b\u041a2 (\u0434\u0435\u0441\u043a\u0442\u043e\u043f\u043d\u044b\u0439 \u0431\u0440\u0430\u0443\u0437\u0435\u0440, \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u0439 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0438\u043b\u0438 WebView \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f).<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h3>\u041a\u043e\u0440\u043d\u0435\u0432\u043e\u0439 React-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 X5LkApp<\/h3>\n<p><code>@five\/core<\/code> \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u0442 React-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 <code>X5LkApp<\/code>. \u0418 <code>lk2<\/code>, \u0438 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u044b \u0434\u043e\u043b\u0436\u043d\u044b \u0438\u043c\u0435\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0434\u0430\u043d\u043d\u044b\u043c \u0438\u0437 \u044f\u0434\u0440\u0430. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0438\u0445 \u043d\u0443\u0436\u043d\u043e \u043e\u0431\u0435\u0440\u043d\u0443\u0442\u044c \u0432 <code>X5LkApp<\/code>. <code>X5LkApp<\/code> \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u0447\u0430\u0441\u0442\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<h4>\u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442<\/h4>\n<p>\u0414\u043b\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u043e\u0432 \u0438 \u0433\u043b\u0430\u0432\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0443\u0436\u0435\u043d \u043e\u0431\u0449\u0438\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442. \u042d\u0442\u043e\u0442 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u0437\u0430\u0434\u0430\u0451\u0442\u0441\u044f \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c\u0438 React-\u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u0430\u043c\u0438. \u041f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u044b \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u0441\u044f \u0432 <code>@five\/core<\/code>, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0434\u0430\u043d\u043d\u044b\u0435 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430 \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u043e \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b \u0438 \u0432 <code>lk2<\/code> \u0438 \u0432\u043e \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c\u044b\u0445 \u043c\u043e\u0434\u0443\u043b\u044f\u0445. \u0420\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u044b:<\/p>\n<ul>\n<li>\n<p>\u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 Redux-\u0441\u0442\u043e\u0440. \u0415\u0441\u0442\u044c \u0434\u0432\u0430 \u0441\u043f\u043e\u0441\u043e\u0431\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u043c\u0438 \u043c\u043e\u0434\u0443\u043b\u044c \u043c\u043e\u0436\u0435\u0442 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0441 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u043c \u0441\u0442\u043e\u0440\u043e\u043c:<\/p>\n<ol>\n<li>\n<p>\u0427\u0435\u0440\u0435\u0437 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 <code>X5UserContext<\/code>. \u0412 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u043d\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u0434\u0430\u043d\u043d\u044b\u0445 \u0438 \u044d\u043a\u0448\u0435\u043d\u043e\u0432.<\/p>\n<\/li>\n<li>\n<p>\u0427\u0435\u0440\u0435\u0437 inject \u0432 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 \u0441\u0442\u043e\u0440. \u0422\u043e\u0433\u0434\u0430 \u043c\u043e\u0436\u043d\u043e \u043e\u0431\u0440\u0430\u0449\u0430\u0442\u044c\u0441\u044f \u043a\u043e \u0432\u0441\u0435\u043c Redux-\u0441\u0442\u043e\u0440\u0430\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0430.<\/p>\n<\/li>\n<\/ol>\n<p>\u0412\u0442\u043e\u0440\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u043c\u0435\u043d\u0435\u0435 \u0431\u0435\u0437\u043e\u043f\u0430\u0441\u0435\u043d \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432 \u0440\u0435\u0434\u043a\u0438\u0445 \u0441\u043b\u0443\u0447\u0430\u044f\u0445. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u043c\u044b \u0432 <code>lk2<\/code>, \u0442.\u043a. \u043d\u0430 \u043d\u0430\u0448\u0435\u0439 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u0434\u0430\u043d\u043d\u044b\u043c\u0438.<\/p>\n<\/li>\n<li>\n<p>React-\u0440\u043e\u0443\u0442\u0435\u0440.<\/p>\n<\/li>\n<li>\n<p><code>ConnectToMobX<\/code> \u2014\u00a0\u043a\u043e\u043d\u043d\u0435\u043a\u0442\u043e\u0440 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0445 \u0441\u0442\u043e\u0440\u043e\u0432 \u0438\u0437 Redux \u043a MobX. \u0414\u0430, \u043d\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u0435\u0441\u0442\u044c \u043e\u0431\u0430 \u0441\u0442\u0435\u0439\u0442-\u043c\u0435\u043d\u0435\u0434\u0436\u0435\u0440\u0430. \u0421\u043d\u0430\u0447\u0430\u043b\u0430 \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 \u0442\u043e\u043b\u044c\u043a\u043e Redux, \u043d\u043e \u0437\u0430\u0442\u0435\u043c \u043f\u043e\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u043b\u0438 MobX, \u0438 \u0436\u0438\u0442\u044c \u0441\u0442\u0430\u043b\u043e \u0432\u0435\u0441\u0435\u043b\u0435\u0435: \u043a\u043e\u0434\u0430 \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f \u043c\u0435\u043d\u044c\u0448\u0435, \u0430 \u0437\u0430\u0434\u0430\u0447\u0438 \u0437\u0430\u043a\u0440\u044b\u0432\u0430\u044e\u0442\u0441\u044f \u0431\u044b\u0441\u0442\u0440\u0435\u0435. \u0421\u0435\u0439\u0447\u0430\u0441 \u043c\u044b \u043f\u043e\u0441\u0442\u0435\u043f\u0435\u043d\u043d\u043e \u043f\u0435\u0440\u0435\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u043c \u0441\u0442\u043e\u0440\u044b c Redux \u043d\u0430 MobX.<\/p>\n<\/li>\n<li>\n<p><code>StatisticsProvider<\/code> \u2014\u00a0\u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430 \u0434\u043b\u044f \u0441\u0431\u043e\u0440\u0430 \u0441\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0438.<\/p>\n<\/li>\n<\/ul>\n<p>\u0412\u0441\u0435\u0433\u043e \u0435\u0441\u0442\u044c 7 \u0442\u0430\u043a\u0438\u0445 \u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u043e\u0432.<\/p>\n<p><a class=\"anchor\" name=\"main_screen\" id=\"main_screen\"><\/a><\/p>\n<h4>\u041f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 X5LkApp<\/h4>\n<ul>\n<li>\n<p>\u0421\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u0438.<\/p>\n<\/li>\n<li>\n<p>\u0420\u0430\u0437\u043c\u0435\u0442\u043a\u0430 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u041e\u043d\u0430 \u0432\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u0432 \u0441\u0435\u0431\u044f \u0431\u043e\u043a\u043e\u0432\u043e\u0435 \u043c\u0435\u043d\u044e \u0438 \u0448\u0430\u043f\u043a\u0443 \u0441 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0435\u0439 \u043e \u0442\u0435\u043a\u0443\u0449\u0435\u043c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435.<\/p>\n<figure class=\"full-width\">\n<div><figcaption>\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0441\u0435\u0440\u0432\u0438\u0441\u0430<\/figcaption><\/div>\n<\/figure>\n<\/li>\n<\/ul>\n<p>\u041e\u0431\u0451\u0440\u0442\u043a\u0430 <code>X5LkApp<\/code> \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0438 \u0432 <code>lk2<\/code> \u0438 \u0432 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430\u0445, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043d\u043e\u0432\u043e\u0433\u043e \u0440\u0430\u0437\u0434\u0435\u043b\u0430 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u043e \u0438 \u0434\u043b\u044f \u043d\u0430\u0441, \u0438 \u0434\u043b\u044f \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u0445 \u043a\u043e\u043c\u0430\u043d\u0434.<\/p>\n<p>\u0420\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 <code>X5LkApp<\/code> \u043d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0435.<\/p>\n<p><strong>\u0412 \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0435\u043c \u043c\u043e\u0434\u0443\u043b\u0435:<\/strong><\/p>\n<p>\u041a\u043e\u0440\u043d\u0435\u0432\u043e\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043c\u0438\u043a\u0440\u043e\u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430:<\/p>\n<pre><code class=\"javascript\">\/\/ externalModule\/src\/ExternalModuleApp.tsx import { X5LkApp } from '@five\/core'; import ExternalModuleContent from '.\/ExternalModuleContent';  const ExternalModuleApp = () => (   &lt;X5LkApp>     &lt;ExternalModuleContent \/>   &lt;\/X5LkApp> );  export default ExternalModuleApp;<\/code><\/pre>\n<p>\u041a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0441 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u043e\u0439:<\/p>\n<pre><code class=\"javascript\">\/\/ externalModule\/src\/ExternalModuleContent.tsx import { useX5Data } from '@five\/core';  \/\/ \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c UI-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0438\u0437 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 import { Typo, UserCard } from '@five\/uikit';  const ExternalModuleApp = () => {   \/\/ ExternalModuleApp \u043e\u0431\u0451\u0440\u043d\u0443\u0442 \u0432 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 X5LkApp,   \/\/ \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u043d\u0443\u0442\u0440\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442   const { user } = useX5Data();    return (     &lt;>       &lt;Typo>\u041f\u0440\u0438\u0432\u0435\u0442 \u0438\u0437 \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0435\u0433\u043e \u043c\u043e\u0434\u0443\u043b\u044f&lt;\/Typo>       &lt;UserCard user={user} \/>     &lt;\/>   ); }; export default ExternalModuleApp;<\/code><\/pre>\n<p><strong>\u0412 lk2:<\/strong><\/p>\n<pre><code class=\"javascript\">\/\/ five\/packages\/lk2\/src\/Root.tsx import { useX5Data } from '@five\/core';  import SomePage from '.\/pages\/Page';  \/\/ \u0412 \u044d\u0442\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435 \u0438\u043c\u043f\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043c\u043e\u0434\u0443\u043b\u044c import ExternalComponentPage from '.\/pages\/ExernalComponentPage';  export const Root = () => (   \/\/ \u041a\u043e\u043d\u0442\u0435\u043d\u0442 lk2 \u0442\u043e\u0436\u0435 \u043e\u0431\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0442\u0435\u0441\u044f \u0432 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u0438\u0437 @five\/core   &lt;X5LkApp>     &lt;Switch>       &lt;Route path=\"\/some-page\" component={SomePage} \/> <\/code><\/pre>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-393561","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/393561","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=393561"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/393561\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=393561"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=393561"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=393561"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}