{"id":393637,"date":"2024-06-29T11:08:00","date_gmt":"2024-06-29T11:08:00","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=393637"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=393637","title":{"rendered":"<span>\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438 \u043d\u0430 VuePress<\/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<h3>\u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0430<\/h3>\n<p><a href=\"https:\/\/vuepress.vuejs.org\/guide\/#how-it-works\" rel=\"noopener noreferrer nofollow\">VuePress<\/a>\u00a0\u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0431\u043e\u0439 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u0438\u0441\u0442\u0438\u0447\u043d\u044b\u0439 \u0433\u0435\u043d\u0435\u0440\u0430\u0442\u043e\u0440 \u0441\u0442\u0430\u0442\u0438\u0447\u043d\u044b\u0445 \u0441\u0430\u0439\u0442\u043e\u0432, \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u0434\u043b\u044f \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u0442\u0435\u0445\u043d\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438.<\/p>\n<p>\u0418\u0437\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0439 \u0446\u0435\u043b\u044c\u044e VuePress, \u0431\u044b\u043b\u0430 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0430 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430 Vue.js \u0438 \u0441\u043e\u043f\u0443\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0435\u0439 \u0438\u043d\u0444\u0440\u0430\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u044b. \u0414\u043b\u044f \u043f\u0440\u0438\u043c\u0435\u0440\u0430, \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043b\u044e\u0431\u0443\u044e \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044e \u043f\u043e Vue:\u00a0<a href=\"https:\/\/vuejs.org\/\" rel=\"noopener noreferrer nofollow\">Vue.js<\/a>,\u00a0<a href=\"https:\/\/router.vuejs.org\/\" rel=\"noopener noreferrer nofollow\">Vue Router<\/a>,\u00a0<a href=\"https:\/\/vuex.vuejs.org\/\" rel=\"noopener noreferrer nofollow\">Vuex<\/a>, \u0433\u0434\u0435 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0435\u0434\u0438\u043d\u044b\u0439 \u0441\u0442\u0438\u043b\u044c, \u0437\u0430\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0439 \u0432 \u043e\u0441\u043d\u043e\u0432\u0435 VuePress.<\/p>\n<p>\u0412 \u0445\u043e\u0434\u0435 \u0441\u0442\u0430\u0442\u044c\u0438 \u043c\u044b \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0443 VuePress, \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u0435\u043c \u0431\u0430\u0437\u043e\u0432\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438 \u0432\u044b\u043b\u043e\u0436\u0438\u043c \u043d\u0430\u00a0<a href=\"https:\/\/pages.github.com\/\" rel=\"noopener noreferrer nofollow\">GitHub Pages<\/a>.<\/p>\n<h3>\u041f\u0440\u0435\u0434\u0432\u0430\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043f\u043e\u0434\u0433\u043e\u0442\u043e\u0432\u043a\u0430<\/h3>\n<h4>1. \u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 Node.js \u0438 NPM<\/h4>\n<p>\u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u043c &#171;Current&#187; \u0432\u0435\u0440\u0441\u0438\u044e Node.js \u0441\u00a0<a href=\"https:\/\/nodejs.org\/en\/\" rel=\"noopener noreferrer nofollow\">\u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0441\u0430\u0439\u0442\u0430<\/a>. \u041f\u0440\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0435 \u043d\u0430 Windows, NPM \u0432\u0445\u043e\u0434\u0438\u0442 \u0432 \u0441\u043e\u0441\u0442\u0430\u0432 Node.js \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e. \u0414\u043b\u044f Linux \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c NPM \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e. <\/p>\n<h4>2. \u041f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u0441\u0442\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438<\/h4>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438, \u043e\u0442\u043a\u0440\u043e\u0435\u043c \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b \u0438 \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u043c \u0432\u0435\u0440\u0441\u0438\u0438 Node.js \u0438 NPM. \u0415\u0441\u043b\u0438 \u0432 \u043e\u0442\u0432\u0435\u0442 \u043f\u043e\u043b\u0443\u0447\u0438\u043c \u043d\u043e\u043c\u0435\u0440 \u0432\u0435\u0440\u0441\u0438\u0438 &#8212; \u0437\u043d\u0430\u0447\u0438\u0442 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043e \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e. <\/p>\n<pre><code class=\"bash\">node -v # \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u0432\u0435\u0440\u0441\u0438\u044e Node.js npm -v  # \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u0432\u0435\u0440\u0441\u0438\u044e NPM<\/code><\/pre>\n<h3>\u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 NPX-\u043f\u0430\u043a\u0435\u0442\u0430 \u0441 \u0433\u043e\u0442\u043e\u0432\u043e\u0439 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u043e\u0439<\/h3>\n<h4>1. \u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 create-vuepress-site<\/h4>\n<p>\u0421\u043e\u0437\u0434\u0430\u0435\u043c \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e \u0434\u043b\u044f \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0438 \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0432 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0435. \u0412\u044b\u0437\u044b\u0432\u0430\u0435\u043c \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b \u0438\u0437 \u0442\u0435\u043a\u0443\u0449\u0435\u0439 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438 \u0438 \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u043c \u043f\u0430\u043a\u0435\u0442\u044b:<\/p>\n<pre><code class=\"bash\">npx create-vuepress-site<\/code><\/pre>\n<p>\u041f\u043e\u0441\u043b\u0435 \u044d\u0442\u043e\u0433\u043e VuePress \u043f\u043e\u043f\u0440\u043e\u0441\u0438\u0442 \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0444\u0430\u0439\u043b\u0430\u00a0<code>\"package.json\"<\/code>: \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u0430, \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0438 \u043f\u0440\u043e\u0447\u0435\u0435. \u0424\u0430\u0439\u043b\u00a0<code>\"package.json\"<\/code>\u00a0\u043f\u043e\u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438 npm-\u043f\u0430\u043a\u0435\u0442\u043e\u0432 \u0438 \u0437\u0430\u043f\u0443\u0441\u043a\u0430 \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u0432.<\/p>\n<p>\u0412 \u0438\u0442\u043e\u0433\u0435, \u0431\u0443\u0434\u0435\u0442 \u0441\u043e\u0437\u0434\u0430\u043d\u0430 \u0431\u0430\u0437\u043e\u0432\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430:<\/p>\n<figure class=\"bordered full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/5be\/cdf\/e57\/5becdfe57aa823c82c5f77375a93d063.png\" width=\"597\" height=\"399\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/5be\/cdf\/e57\/5becdfe57aa823c82c5f77375a93d063.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041a\u043e\u0440\u043d\u0435\u0432\u0430\u044f \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f\u00a0<code>\"docs\"<\/code>\u00a0\u043f\u043e\u0434\u0440\u0430\u0437\u0443\u043c\u0435\u0432\u0430\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 VuePress \u0432\u043d\u0443\u0442\u0440\u0438 \u0440\u0430\u0431\u043e\u0447\u0435\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u041c\u044b \u0431\u0443\u0434\u0435\u043c \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044e, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0443\u0431\u0435\u0440\u0435\u043c \u043b\u0438\u0448\u043d\u0438\u0439 \u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0438: \u0443\u0434\u0430\u043b\u0438\u043c \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e\u00a0<code>\"docs\"<\/code>, \u0430 \u0432\u0441\u0451 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043f\u043e\u043c\u0435\u0441\u0442\u0438\u043c \u0432 \u043a\u043e\u0440\u0435\u043d\u044c \u043f\u0440\u043e\u0435\u043a\u0442\u0430.  <\/p>\n<h4>2. \u0417\u0430\u043f\u0443\u0441\u043a \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/h4>\n<p>\u041d\u0430\u0441\u0442\u0430\u043b\u043e \u0432\u0440\u0435\u043c\u044f \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c \u043f\u0440\u043e\u0435\u043a\u0442. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043f\u0435\u0440\u0435\u0439\u0434\u0451\u043c \u0432 \u0444\u0430\u0439\u043b\u00a0<code>\"package.json\"<\/code>\u00a0\u0438 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0430 \u0443\u0436\u0435 \u043f\u043e\u0434\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u0435 \u0441\u043a\u0440\u0438\u043f\u0442\u044b.<\/p>\n<pre><code class=\"json\">\"scripts\": {     \"dev\": \"vuepress dev src\",     \"build\": \"vuepress build src\" }<\/code><\/pre>\n<ul>\n<li>\n<p>\u0421\u043a\u0440\u0438\u043f\u0442\u00a0<code>\"dev\"<\/code>\u00a0\u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e\u043c \u0441\u0435\u0440\u0432\u0435\u0440\u0435<\/p>\n<\/li>\n<li>\n<p>\u0421\u043a\u0440\u0438\u043f\u0442\u00a0<code>\"build\"<\/code>\u00a0\u0441\u043e\u0431\u0435\u0440\u0435\u0442 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u043b\u044f production<\/p>\n<\/li>\n<\/ul>\n<p>\u0417\u0430\u043f\u0443\u0441\u043a \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u0432 \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0447\u0435\u0440\u0435\u0437 \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b:<\/p>\n<pre><code class=\"bash\">npm run dev npm run build<\/code><\/pre>\n<p>\u041f\u0440\u0438 \u0437\u0430\u043f\u0443\u0441\u043a\u0435 \u0441\u043a\u0440\u0438\u043f\u0442\u0430\u00a0<code>\"dev\"<\/code>, \u0432 \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b\u0435 \u0431\u0443\u0434\u0435\u0442 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435 \u043e\u0431 \u0443\u0441\u043f\u0435\u0448\u043d\u043e\u0439 \u0441\u0431\u043e\u0440\u043a\u0435 \u0438 \u0430\u0434\u0440\u0435\u0441 \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0441\u0435\u0440\u0432\u0435\u0440\u0430:\u00a0<a href=\"http:\/\/localhost:8080\/\" rel=\"noopener noreferrer nofollow\">http:\/\/localhost:8080\/<\/a>.<\/p>\n<pre><code class=\"bash\">success [11:09:20] Build 257d7d finished in 4856 ms! > VuePress dev server listening at http:\/\/localhost:8080\/<\/code><\/pre>\n<p>\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0441\u0442\u0430\u0440\u0442\u043e\u0432\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u043f\u043e\u0438\u0441\u043a\u0430 \u043f\u043e \u0440\u0430\u0437\u0434\u0435\u043b\u0430\u043c, \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b &#171;Guide&#187;, \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b &#171;Config&#187; \u0438 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430.<\/p>\n<figure class=\"bordered full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/8cb\/cb5\/c6b\/8cbcb5c6bd559e92a8d5118887e79795.png\" width=\"983\" height=\"681\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/8cb\/cb5\/c6b\/8cbcb5c6bd559e92a8d5118887e79795.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041e\u0442\u0440\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043c\u043e\u0436\u043d\u043e \u0432 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0445 \u0444\u0430\u0439\u043b\u0430\u0445:<\/p>\n<ul>\n<li>\n<p><code>\".\/src\/index.md\"<\/code>\u00a0&#8212; \u0433\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430<\/p>\n<\/li>\n<li>\n<p><code>\".\/src\/config\/README.md\"<\/code>\u00a0&#8212; \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 &#171;Config&#187;<\/p>\n<\/li>\n<li>\n<p><code>\".\/src\/guide\/README.md\"<\/code>\u00a0&#8212; \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 &#171;Guide&#187;<\/p>\n<\/li>\n<\/ul>\n<p>\u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 NPX-\u043f\u0430\u043a\u0435\u0442\u0430 \u0441 \u0433\u043e\u0442\u043e\u0432\u043e\u0439 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u043e\u0439 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0431\u044b\u0441\u0442\u0440\u043e \u0440\u0430\u0437\u0432\u0435\u0440\u043d\u0443\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0441 \u0431\u0430\u0437\u043e\u0432\u044b\u043c \u043d\u0430\u0431\u043e\u0440\u043e\u043c \u0441\u0442\u0440\u0430\u043d\u0438\u0446. \u041d\u043e \u0432\u043c\u0435\u0441\u0442\u043e \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u043e\u0432\u043e\u0434\u0438\u0442\u044c \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433 \u0438 \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u043d\u044b\u0439 \u0448\u0430\u0431\u043b\u043e\u043d \u043f\u043e\u0434 \u0441\u0435\u0431\u044f, \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u044e \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e \u0440\u0430\u0437\u0432\u0435\u0440\u043d\u0443\u0442\u044c \u043f\u0440\u043e\u0435\u043a\u0442 \u0438 \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c\u0441\u044f \u0441 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u043e\u043c VuePress.<\/p>\n<h3>\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0430 VuePress \u0441 \u043d\u0443\u043b\u044f<\/h3>\n<p>\u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043d\u043e\u0432\u044b\u0439 \u043f\u0440\u043e\u0435\u043a\u0442 \u0438 \u043e\u0442\u043a\u0440\u043e\u0435\u043c \u0435\u0433\u043e \u0432 \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b\u0435.<\/p>\n<h4>1. \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/h4>\n<pre><code class=\"bash\">npm init     # \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0441 \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u0435\u043c \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u043f\u0440\u043e\u0435\u043a\u0442\u0430 npm init -y  # \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0441 \u0434\u0435\u0444\u043e\u043b\u0442\u043d\u044b\u043c\u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u043c\u0438<\/code><\/pre>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u0444\u0430\u0439\u043b\u00a0<code>\"package.json\"<\/code>. \u041f\u0440\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0435 \u0441 \u0434\u0435\u0444\u043e\u043b\u0442\u043d\u044b\u043c\u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u043c\u0438 (<code>\"npm init -y\"<\/code>), \u0444\u0430\u0439\u043b \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<pre><code class=\"json\">{     \"name\": \"vue-press\",     \"version\": \"1.0.0\",     \"description\": \"\",     \"main\": \"index.js\",     \"scripts\": {         \"test\": \"echo \\\"Error: no test specified\\\" &amp;&amp; exit 1\"     },     \"keywords\": [],     \"author\": \"\",     \"license\": \"ISC\" }<\/code><\/pre>\n<p>\u0413\u0434\u0435\u00a0<code>\"vue-press\"<\/code>\u00a0\u0432 \u043f\u043e\u043b\u0435\u00a0<code>\"name\"<\/code>\u00a0&#8212; \u044d\u0442\u043e \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0430.<\/p>\n<h4>2. \u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 VuePress<\/h4>\n<p>\u0412\u044b\u043f\u043e\u043b\u043d\u0438\u043c \u043a\u043e\u043c\u0430\u043d\u0434\u0443 \u0432 \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b\u0435:<\/p>\n<pre><code class=\"bash\">npm i --save-dev vuepress<\/code><\/pre>\n<p>\u0412 \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u043f\u043e\u044f\u0432\u0438\u0442\u0441\u044f \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f\u00a0<code>\"node_modules\"<\/code>\u00a0\u0441 \u043f\u0430\u043a\u0435\u0442\u0430\u043c\u0438, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u043c\u0438 \u0434\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b VuePress. \u0412 \u0444\u0430\u0439\u043b\u00a0<code>\"package.json\"<\/code>\u00a0\u0434\u043e\u0431\u0430\u0432\u0438\u0442\u0441\u044f \u0441\u0435\u043a\u0446\u0438\u044f\u00a0<code>\"devDependencies\"<\/code>\u00a0\u0441 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u043c \u043f\u0430\u043a\u0435\u0442\u043e\u043c.<\/p>\n<pre><code class=\"json\">\"devDependencies\": {     \"vuepress\": \"^1.8.2\" }<\/code><\/pre>\n<p>\u0412 \u0440\u0430\u0437\u0434\u0435\u043b\u00a0<code>\"devDependencies\"<\/code>\u00a0\u043f\u043e\u043c\u0435\u0449\u0430\u044e\u0442\u0441\u044f \u043f\u0430\u043a\u0435\u0442\u044b, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0430 \u044d\u0442\u0430\u043f\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438.<\/p>\n<h4>3. \u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u0432<\/h4>\n<p>\u0421\u043a\u043e\u0440\u0440\u0435\u043a\u0442\u0438\u0440\u0443\u0435\u043c \u0441\u0435\u043a\u0446\u0438\u044e\u00a0<code>\"scripts\"<\/code>\u00a0\u0432 \u0444\u0430\u0439\u043b\u0435\u00a0<code>\"package.json\"<\/code>. \u0421\u043a\u0440\u0438\u043f\u0442\u00a0<code>\"test\"<\/code>\u00a0\u043d\u0435 \u043f\u0440\u0438\u0433\u043e\u0434\u0438\u0442\u0441\u044f &#8212; \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0435\u0433\u043e \u043c\u043e\u0436\u043d\u043e \u0443\u0434\u0430\u043b\u0438\u0442\u044c. \u0421\u043b\u0435\u0434\u0443\u044f\u00a0<a href=\"https:\/\/vuepress.vuejs.org\/guide\/getting-started.html#manual-installation\" rel=\"noopener noreferrer nofollow\">\u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438 VuePress<\/a>, \u0434\u043e\u0431\u0430\u0432\u0438\u043c 2 \u0441\u043a\u0440\u0438\u043f\u0442\u0430. \u0421\u0435\u043a\u0446\u0438\u044f\u00a0<code>\"scripts\"<\/code>\u00a0\u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n<pre><code class=\"json\">\"scripts\": {     \"start\": \"vuepress dev src\",     \"build\": \"vuepress build src\" }<\/code><\/pre>\n<ul>\n<li>\n<p>\u0421\u043a\u0440\u0438\u043f\u0442\u00a0<code>\"start\"<\/code>\u00a0\u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e\u043c \u0441\u0435\u0440\u0432\u0435\u0440\u0435<\/p>\n<\/li>\n<li>\n<p>\u0421\u043a\u0440\u0438\u043f\u0442\u00a0<code>\"build\"<\/code>\u00a0\u0441\u043e\u0431\u0435\u0440\u0435\u0442 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u043b\u044f production<\/p>\n<\/li>\n<\/ul>\n<p>\u0420\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0434\u043b\u044f \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u0432:<\/p>\n<ul>\n<li>\n<p><code>\"vuepress dev src\"<\/code>\u00a0\u0434\u043b\u044f \u0441\u043a\u0440\u0438\u043f\u0442\u0430\u00a0<code>\"start\"<\/code>, \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u00a0<code>\"vuepress\"<\/code>\u00a0\u0432 \u0440\u0435\u0436\u0438\u043c\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0438 \u0431\u0443\u0434\u0435\u0442 \u0438\u0441\u043a\u0430\u0442\u044c \u043d\u0443\u0436\u043d\u044b\u0435 \u0444\u0430\u0439\u043b\u044b \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438\u00a0<code>\"src\"<\/code><\/p>\n<\/li>\n<li>\n<p><code>\"vuepress build src\"<\/code>\u00a0\u0434\u043b\u044f \u0441\u043a\u0440\u0438\u043f\u0442\u0430\u00a0<code>\"build\"<\/code>, \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u00a0<code>\"vuepress\"<\/code>\u00a0\u0432 production-\u0440\u0435\u0436\u0438\u043c\u0435, \u0431\u0443\u0434\u0435\u0442 \u0438\u0441\u043a\u0430\u0442\u044c \u043d\u0443\u0436\u043d\u044b\u0435 \u0444\u0430\u0439\u043b\u044b \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438\u00a0<code>\"src\"<\/code>\u00a0\u0438 \u0441\u043e\u0431\u0435\u0440\u0435\u0442 \u043f\u0440\u043e\u0435\u043a\u0442 \u0434\u043b\u044f production<\/p>\n<\/li>\n<\/ul>\n<p>\u0414\u043b\u044f \u0437\u0430\u043f\u0443\u0441\u043a\u0430 \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u0432 \u0442\u0430\u043a\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c:<\/p>\n<pre><code class=\"bash\">npm run start npm run build<\/code><\/pre>\n<p>\u041d\u0430 \u0434\u0430\u043d\u043d\u043e\u043c \u044d\u0442\u0430\u043f\u0435 \u043d\u0435 \u0437\u0430\u043b\u043e\u0436\u0435\u043d\u0430 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0441\u043a\u0440\u0438\u043f\u0442\u044b \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0442\u044c\u0441\u044f \u043d\u0435 \u0431\u0443\u0434\u0443\u0442.<\/p>\n<h4>4. \u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/h4>\n<p>\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u0435\u043c \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043a\u0430\u043a \u043f\u043e\u043a\u0430\u0437\u0430\u043d\u043e \u043d\u0430 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0438:<\/p>\n<figure class=\"bordered\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/642\/93f\/7a5\/64293f7a575f2666479d64b754c16bf7.png\" width=\"270\" height=\"403\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/642\/93f\/7a5\/64293f7a575f2666479d64b754c16bf7.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438 \u0438 \u0444\u0430\u0439\u043b\u044b:<\/p>\n<ul>\n<li>\n<p><code>\".\/src\/index.md\"<\/code>\u00a0&#8212; \u0442\u043e\u0447\u043a\u0430 \u0432\u0445\u043e\u0434\u0430 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435<\/p>\n<\/li>\n<li>\n<p><code>\".\/src\/.vuepress\/\"<\/code>\u00a0&#8212; \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f \u0441 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u043c\u0438 VuePress<\/p>\n<\/li>\n<li>\n<p><code>\".\/src\/pages\"<\/code>\u00a0&#8212; \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f \u0441\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430\u043c\u0438<\/p>\n<\/li>\n<\/ul>\n<p>\u0420\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u0430\u043b\u0433\u043e\u0440\u0438\u0442\u043c \u0440\u0430\u0431\u043e\u0442\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u0435\u0433\u043e \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0443:<\/p>\n<ol>\n<li>\n<p>\u041f\u0440\u0438 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0438 \u0441\u043a\u0440\u0438\u043f\u0442\u0430\u00a0<code>\"start\": \"vuepress dev src\"<\/code>, VuePress \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u0442\u0441\u044f \u0432 \u0440\u0435\u0436\u0438\u043c\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0441 \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u0435\u043c \u0440\u0430\u0431\u043e\u0447\u0435\u0439 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438\u00a0<code>\"src\"<\/code><\/p>\n<\/li>\n<li>\n<p>\u0412\u00a0<code>\"src\"<\/code>\u00a0\u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0442\u043e\u0447\u043a\u0430 \u0432\u0445\u043e\u0434\u0430 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435: \u0444\u0430\u0439\u043b\u00a0<code>\"index.md\"<\/code>, \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u0440\u0435\u043d\u0434\u0435\u0440\u0438\u0442\u0441\u044f \u043d\u0430 \u0433\u043b\u0430\u0432\u043d\u0443\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443<\/p>\n<\/li>\n<li>\n<p>VuePress \u0438\u0449\u0435\u0442 \u0432\u00a0<code>\"src\"<\/code>\u00a0\u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e\u00a0<code>\".vuepress\"<\/code>\u00a0\u0434\u043b\u044f \u0447\u0442\u0435\u043d\u0438\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a (\u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f \u0434\u043e\u043b\u0436\u043d\u0430 \u043d\u0430\u0437\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u0438\u043c\u0435\u043d\u043d\u043e \u0442\u0430\u043a)<\/p>\n<\/li>\n<li>\n<p>\u0412 \u0444\u0430\u0439\u043b\u0435\u00a0<code>\".\/src\/.vuepress\/config.js\"<\/code>\u00a0\u043d\u0430\u0445\u043e\u0434\u044f\u0442\u0441\u044f \u0432\u0441\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043f\u043e \u0440\u0430\u0431\u043e\u0442\u0435 VuePress. \u041f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0441\u043e\u043f\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u0440\u043e\u0443\u0442\u043e\u0432: \u0437\u0434\u0435\u0441\u044c \u043c\u044b \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c, \u0447\u0442\u043e \u0438\u043c\u0435\u043d\u043d\u043e \u0432\u00a0<code>\"pages\"<\/code>\u00a0\u0445\u0440\u0430\u043d\u044f\u0442\u0441\u044f \u0432\u0441\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/p>\n<\/li>\n<li>\n<p>\u0414\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f\u00a0<code>\"pages\"<\/code>\u00a0\u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0432\u0441\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u0412 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u0438\u0445 \u0432\u0441\u0435\u0433\u043e \u0434\u0432\u0435: \u0441 \u0442\u0435\u043c\u0430\u043c\u0438 \u043f\u043e React.js (\u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f\u00a0<code>\"react\"<\/code>) \u0438 \u043f\u043e Vue.js (\u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f\u00a0<code>\"vue\"<\/code>). \u0421\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0431\u044b\u043b\u0438 \u043f\u0440\u0438\u0434\u0443\u043c\u0430\u043d\u044b \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u043e<\/p>\n<\/li>\n<li>\n<p>\u0414\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b (\u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f\u00a0<code>\"pages\"<\/code>) \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0444\u0430\u0439\u043b\u00a0<code>\"README.md\"<\/code>. \u041e\u043d \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u0443\u044e\u00a0<code>\".\/src\/index.md\"<\/code>. \u041a\u0440\u043e\u043c\u0435 \u044d\u0442\u043e\u0433\u043e, \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d \u0444\u0430\u0439\u043b\u044b\u00a0<code>\"info.md\"<\/code>\u00a0\u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0439 \u0442\u0435\u043c\u044b &#8212; \u044d\u0442\u043e \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u043b\u044c\u043d\u044b\u0435 \u043e\u043f\u0438\u0441\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/p>\n<\/li>\n<\/ol>\n<h4>5. Markdown-\u0444\u0430\u0439\u043b\u044b<\/h4>\n<p>\u0418\u0437 \u0444\u0430\u0439\u043b\u043e\u0432 \u0441 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435\u043c\u00a0<code>\".md\"<\/code>, \u043a\u043e\u0434 \u043a\u043e\u043c\u043f\u0438\u043b\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0432 HTML-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b.<\/p>\n<p>\u041a\u043e\u0434 \u0432 \u0444\u0430\u0439\u043b\u0430\u0445\u00a0<code>\".md\"<\/code>\u00a0\u043c\u043e\u0436\u043d\u043e \u043f\u0438\u0441\u0430\u0442\u044c:<\/p>\n<ul>\n<li>\n<p>\u041d\u0430 \u044f\u0437\u044b\u043a\u0435 Markdown<\/p>\n<\/li>\n<li>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f YAML Front Matter<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430 \u0447\u0438\u0441\u0442\u043e\u043c HTML<\/p>\n<\/li>\n<\/ul>\n<p>\u0412 \u0441\u0442\u0430\u0442\u044c\u0435 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c Markdown, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0449\u0438\u0439 \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u0431\u044b\u0441\u0442\u0440\u043e \u0440\u0430\u0437\u043c\u0435\u0442\u0438\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043d\u0442.<\/p>\n<p>\u041e\u0442\u043a\u0440\u043e\u0435\u043c \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0444\u0430\u0439\u043b\u044b\u00a0<code>\".md\"<\/code>\u00a0\u0438 \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043d\u0442. \u0421\u0438\u043c\u0432\u043e\u043b\u00a0<code>\"#\"<\/code>\u00a0\u0432 Markdown \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a \u043f\u0435\u0440\u0432\u043e\u0433\u043e \u0443\u0440\u043e\u0432\u043d\u044f.<\/p>\n<ul>\n<li>\n<p>.\/src\/index.md<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"markdown\"># \u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/code><\/pre>\n<ul>\n<li>\n<p>.\/src\/pages\/react\/README.md<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"markdown\"># \u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0441\u043f\u0440\u0430\u0432\u043e\u0447\u043d\u0438\u043a\u0430 \u043f\u043e React.js<\/code><\/pre>\n<ul>\n<li>\n<p>.\/src\/pages\/react\/info.md<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"markdown\"># \u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430 React.js<\/code><\/pre>\n<ul>\n<li>\n<p>.\/src\/pages\/vue\/README.md<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"markdown\"># \u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0441\u043f\u0440\u0430\u0432\u043e\u0447\u043d\u0438\u043a\u0430 \u043f\u043e Vue.js<\/code><\/pre>\n<ul>\n<li>\n<p>.\/src\/pages\/vue\/info.md<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"markdown\"># \u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430 Vue.js<\/code><\/pre>\n<h4>6. \u0424\u0430\u0439\u043b config.js<\/h4>\n<p>\u041e\u0441\u0442\u0430\u043b\u043e\u0441\u044c \u0443\u043a\u0430\u0437\u0430\u0442\u044c, \u0447\u0442\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0431\u0440\u0430\u0442\u044c \u0438\u0437 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438\u00a0<code>\"pages\"<\/code>.<\/p>\n<p>\u0411\u0430\u0437\u043e\u0432\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0438\u00a0<code>\".\/src\/.vuepress\/config.js\"<\/code>:<\/p>\n<pre><code class=\"javascript\">module.exports = {     themeConfig: {         \/\/ \u0421\u0441\u044b\u043b\u043a\u0438 \u043d\u0430 \u0440\u0430\u0437\u0434\u0435\u043b\u044b         nav: [             {                 text: '\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0440\u0430\u0437\u0434\u0435\u043b\u0430',                 link: '\u041f\u0443\u0442\u044c \u043a \u0440\u0430\u0437\u0434\u0435\u043b\u0443'             },         ],         \/\/ \u0421\u0441\u044b\u043b\u043a\u0438 \u0432\u043d\u0443\u0442\u0440\u0438 \u0440\u0430\u0437\u0434\u0435\u043b\u0430         sidebar: {             '\u041f\u0443\u0442\u044c \u043a \u0440\u0430\u0437\u0434\u0435\u043b\u0443': [                 {                     title: '\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u043f\u043e\u0434\u0440\u0430\u0437\u0434\u0435\u043b\u0430',  \/\/                      children: [                         ['\u041f\u0443\u0442\u044c \u043a \u0442\u0435\u043c\u0435', '\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0442\u0435\u043c\u044b'],                             ]                 }             ]         }     }, }<\/code><\/pre>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0438\u043c\u043f\u043e\u0440\u0442\u0430 \u0438 \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f CommonJS (\u043c\u043e\u0434\u0443\u043b\u044c\u043d\u0430\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u0430 Node.js), \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c\u00a0<code>\"module.exports\"<\/code>.<\/p>\n<p>\u041f\u0440\u043e\u0432\u0435\u0434\u0451\u043c \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u044e \u0438 \u0432\u044b\u043d\u0435\u0441\u0435\u043c \u0432 \u043a\u043e\u043d\u0441\u0442\u0430\u043d\u0442\u044b \u0440\u043e\u0443\u0442\u044b (\u0432 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u044d\u0442\u043e\u00a0<code>\"nav\"<\/code>\u00a0\u0438\u00a0<code>\"sidebar\"<\/code>).<\/p>\n<pre><code class=\"javascript\">\/\/ \u041a\u043e\u043d\u0441\u0442\u0430\u043d\u0442\u044b \u0441 \u0440\u043e\u0443\u0442\u0430\u043c\u0438 \u043a \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430\u043c const PAGE_VUE = '\/pages\/vue\/'; const PAGE_REACT = '\/pages\/react\/';  \/\/ \u0421\u0441\u044b\u043b\u043a\u0438 \u043d\u0430 \u0440\u0430\u0437\u0434\u0435\u043b\u044b const NAV = [     {         text: 'Vue.js',         link: PAGE_VUE     },     {         text: 'React.js',         link: PAGE_REACT     }, ]; \/\/ \u0421\u0441\u044b\u043b\u043a\u0438 \u0432\u043d\u0443\u0442\u0440\u0438 \u0440\u0430\u0437\u0434\u0435\u043b\u0430 const SIDEBAR = {     [PAGE_VUE]: [         {             title: '\u0418\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f',             children: [                 ['info', 'Vue.js'],             ]         }     ],     [PAGE_REACT]: [         {             title: '\u0418\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f',             children: [                 ['info', 'React.js'],             ]         }     ] }; module.exports = {     themeConfig: {         nav: NAV,         sidebar: SIDEBAR     }, }<\/code><\/pre>\n<h4>7. \u0417\u0430\u043f\u0443\u0441\u043a \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/h4>\n<p>\u0417\u0430\u043f\u0443\u0441\u0442\u0438\u043c \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b \u0438\u0437 \u0440\u0430\u0431\u043e\u0447\u0435\u0439 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438 \u0438 \u0432\u044b\u043f\u043e\u043b\u043d\u0438\u043c \u0441\u043a\u0440\u0438\u043f\u0442:<\/p>\n<pre><code class=\"bash\">npm run start<\/code><\/pre>\n<p>\u041f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u043f\u043e \u0430\u0434\u0440\u0435\u0441\u0443:\u00a0<a href=\"http:\/\/localhost:8080\/\" rel=\"noopener noreferrer nofollow\">http:\/\/localhost:8080\/<\/a>.<\/p>\n<p>\u041d\u0430 \u0433\u043b\u0430\u0432\u043d\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0432\u0438\u0434\u0438\u043c \u0442\u0435\u043a\u0441\u0442 \u0438\u0437\u00a0<code>\".\/src\/index.md\"<\/code>. \u0412 \u043c\u0435\u043d\u044e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u044e\u0442\u0441\u044f \u0434\u0432\u0435 \u0441\u0441\u044b\u043b\u043a\u0438: &#171;Vue.js&#187; \u0438 &#171;React.js&#187;.<\/p>\n<figure class=\"bordered full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/417\/bd0\/169\/417bd0169a5f529878993dee1a089729.png\" width=\"802\" height=\"311\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/417\/bd0\/169\/417bd0169a5f529878993dee1a089729.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041f\u0435\u0440\u0435\u0439\u0434\u0435\u043c \u043d\u0430 \u0432\u043a\u043b\u0430\u0434\u043a\u0443 &#171;Vue.js&#187;. URL \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u0441\u044f \u043d\u0430\u00a0<a href=\"http:\/\/localhost:8080\/pages\/vue\/\" rel=\"noopener noreferrer nofollow\">http:\/\/localhost:8080\/pages\/vue\/<\/a>. \u041d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0432\u0438\u0434\u0438\u043c \u0442\u0435\u043a\u0441\u0442 \u0438\u0437\u00a0<code>\".\/src\/pages\/vue\/README.md\"<\/code>.<\/p>\n<figure class=\"bordered full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/0ec\/2a1\/79b\/0ec2a179b75ec901f0414183f993cbc3.png\" width=\"802\" height=\"311\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/0ec\/2a1\/79b\/0ec2a179b75ec901f0414183f993cbc3.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412 \u0441\u0430\u0439\u0434\u0431\u0430\u0440\u0435 \u0432 \u0440\u0430\u0437\u0434\u0435\u043b\u0435 &#171;\u0418\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f&#187; \u0432\u044b\u0431\u0435\u0440\u0435\u043c &#171;Vue.js&#187;. URL \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u0441\u044f \u043d\u0430\u00a0<a href=\"http:\/\/localhost:8080\/pages\/vue\/info.html\" rel=\"noopener noreferrer nofollow\">http:\/\/localhost:8080\/pages\/vue\/info.html<\/a>. \u041d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0432\u0438\u0434\u0438\u043c \u0442\u0435\u043a\u0441\u0442 \u0438\u0437\u00a0<code>\".\/src\/pages\/vue\/info.md\"<\/code>.<\/p>\n<figure class=\"bordered full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/9ea\/ea6\/f7f\/9eaea6f7f840bbea2859cdc445418100.png\" width=\"802\" height=\"311\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/9ea\/ea6\/f7f\/9eaea6f7f840bbea2859cdc445418100.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041f\u043e\u0437\u0434\u0440\u0430\u0432\u043b\u044f\u044e! \u041c\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u043b\u0438 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 VuePress. \u0422\u0435\u043f\u0435\u0440\u044c \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0430 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b.  <\/p>\n<h4>8. \u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439<\/h4>\n<p>\u0414\u043e\u0431\u0430\u0432\u0438\u043c \u043d\u043e\u0432\u0443\u044e \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e\u00a0<code>\"img\"<\/code>\u00a0\u0432\u00a0<code>\".\/src\/pages\/vue\"<\/code>\u00a0(\u043f\u043e \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0438 \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0438 \u0434\u043b\u044f\u00a0<code>\".\/src\/pages\/react\"<\/code>). \u041f\u043e\u043c\u0435\u0441\u0442\u0438\u043c \u0432\u00a0<code>\"img\"<\/code>\u00a0\u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435\u00a0<code>\"vue-logo.jpg\"<\/code>.<\/p>\n<figure class=\"bordered\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/045\/fac\/709\/045fac709650237af2d332d5e99e23ca.png\" width=\"276\" height=\"354\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/045\/fac\/709\/045fac709650237af2d332d5e99e23ca.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u0438\u0437 \u0444\u0430\u0439\u043b\u0430\u00a0<code>\".\/src\/pages\/vue\/info.md\"<\/code>\u00a0\u043c\u043e\u0436\u043d\u043e \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044e.<\/p>\n<pre><code class=\"markdown\">&lt;!-- Markdown-\u0444\u043e\u0440\u043c\u0430\u0442 --> ![Alt for Image](.\/img\/vue-logo.jpg)<\/code><\/pre>\n<pre><code class=\"xml\">&lt;!-- HTML-\u0444\u043e\u0440\u043c\u0430\u0442 --> &lt;img src=\".\/img\/vue-logo.jpg\" width=\"200px\" alt=\"Alt for Image\" \/><\/code><\/pre>\n<p>\u041f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 HTML-\u0444\u043e\u0440\u043c\u0430\u0442\u0430 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u0448\u0438\u0440\u0438\u043d\u0443 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f, \u0447\u0442\u043e \u0432\u043e \u043c\u043d\u043e\u0433\u0438\u0445 \u0441\u0438\u0442\u0443\u0430\u0446\u0438\u044f\u0445, \u0431\u0443\u0434\u0435\u0442 \u0443\u0434\u043e\u0431\u043d\u0435\u0435 \u0440\u0430\u0437\u043c\u0435\u0442\u043a\u0438 Markdown.<\/p>\n<p>\u0414\u043b\u044f \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439 \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u0434\u0430\u0432\u0430\u0442\u044c \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0443\u0442\u044c, \u043d\u043e \u0438 \u0430\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u044b\u0435. \u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0434\u043e\u043b\u0436\u043d\u044b \u0431\u044b\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u0440\u0430\u043c\u043a\u0430\u0445 \u043e\u0434\u043d\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, \u0430 \u0432\u043e \u0432\u0441\u0451\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438. \u0422\u0430\u043a\u0438\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u0432\u00a0<code>\".\/src\/.vuepress\/public\"<\/code>. \u041e\u0431\u0440\u0430\u0442\u0438\u0442\u044c\u0441\u044f \u043a \u043d\u0438\u043c \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e, \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u044f\u00a0<code>\"\/\"<\/code>\u00a0\u0438\u043b\u0438 \u0447\u0435\u0440\u0435\u0437 Vue-\u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0443\u044e\u00a0<code>\"$withBase\"<\/code>.<\/p>\n<pre><code class=\"xml\">&lt;!-- \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043f\u0443\u0442\u0438 \"\/\" --> &lt;img src=\"\/vue-logo.jpg\" alt=\"Alt for Image\" \/>  &lt;!-- \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 Vue-\u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 --> &lt;img :src=\"$withBase('\/vue-logo.jpg')\" alt=\"Alt for Image\" \/><\/code><\/pre>\n<h4>9. \u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 favicon \u0438 meta-\u0434\u0430\u043d\u043d\u044b\u0445<\/h4>\n<p>Favicon \u0440\u0430\u0437\u043c\u0435\u0441\u0442\u0438\u043c \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438, \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0449\u0435\u0439 \u043e\u0431\u0449\u0438\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b:\u00a0<code>\"src\/.vuepress\/public\/favicon.svg\"<\/code><\/p>\n<p>\u041f\u043e\u0441\u043b\u0435 \u044d\u0442\u043e\u0433\u043e \u0432 \u043a\u043e\u043d\u0444\u0438\u0433\u0435\u00a0<code>\"src\/.vuepress\/config.js\"<\/code>\u00a0\u0443\u043a\u0430\u0436\u0435\u043c favicon \u0432 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u00a0<code>\"head\"<\/code>. \u041a\u0440\u043e\u043c\u0435 favicon, \u0432 \u0434\u0430\u043d\u043d\u043e\u043c \u0440\u0430\u0437\u0434\u0435\u043b\u0435 \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c meta-\u0434\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u043d\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f:<\/p>\n<pre><code class=\"javascript\">module.exports = {     themeConfig: {         \/\/     },     head: [         ['link', { rel: 'icon', href: '\/favicon.svg' }],         ['meta', { name: 'theme-color', content: '#3eaf7c' }],         ['meta', { name: 'apple-mobile-web-app-capable', content: 'yes' }],         ['meta', { name: 'apple-mobile-web-app-status-bar-style', content: 'black' }]     ] }<\/code><\/pre>\n<h4>10. \u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u043e\u0432\u043e\u0439 \u0441\u0445\u0435\u043c\u044b<\/h4>\n<p>\u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e, \u0434\u043b\u044f \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f VuePress \u0437\u0430\u0434\u0430\u043d\u0430 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u0430\u044f \u0446\u0432\u0435\u0442\u043e\u0432\u0430\u044f \u0441\u0445\u0435\u043c\u0430, \u043d\u043e \u0435\u0435 \u043c\u043e\u0436\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e\u00a0<code>\"styles\"<\/code>\u00a0\u0432\u00a0<code>\".\/src\/.vuepress\/\"<\/code>. \u0412\u00a0<code>\"styles\"<\/code>\u00a0\u0434\u043e\u0431\u0430\u0432\u0438\u043c \u0434\u0432\u0430 \u0444\u0430\u0439\u043b\u0430 \u043d\u0430 \u043f\u0440\u0435\u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0440\u0435\u00a0<code>\"Stylus\"<\/code>\u00a0(\u044d\u0442\u043e \u0434\u0435\u0444\u043e\u043b\u0442\u043d\u044b\u0439 \u043f\u0440\u0435\u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0440 \u0432 VuePress):<\/p>\n<ul>\n<li>\n<p><code>\"index.styl\"<\/code>\u00a0&#8212; \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u043e\u0431\u0449\u0438\u0435 \u0441\u0442\u0438\u043b\u0438 \u0434\u043b\u044f \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f (\u043d-\u0440: \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0441\u0442\u0438\u043b\u0438 \u043a\u043e \u0432\u0441\u0435\u043c \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f\u043c).<\/p>\n<\/li>\n<li>\n<p><code>\"palette.styl\"<\/code>\u00a0&#8212; \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u0446\u0432\u0435\u0442\u043e\u0432\u043e\u0439 \u0441\u0445\u0435\u043c\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"bordered\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/992\/a6a\/a54\/992a6aa547779ccb4f82c43b801561c0.png\" width=\"256\" height=\"295\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/992\/a6a\/a54\/992a6aa547779ccb4f82c43b801561c0.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0414\u043b\u044f \u0444\u0430\u0439\u043b\u0430\u00a0<code>\"palette.styl\"<\/code>\u00a0\u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435:<\/p>\n<pre><code class=\"css\">$accentColor = #3eaf7c $textColor = #2c3e50 $borderColor = #eaecef $codeBgColor = #282c34<\/code><\/pre>\n<p>\u041a\u043e\u0440\u0440\u0435\u043a\u0442\u0438\u0440\u0443\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u043c\u043e\u0436\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0446\u0432\u0435\u0442\u043e\u0432\u0443\u044e \u0441\u0445\u0435\u043c\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<h4>11. \u041f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043f\u043e\u0438\u0441\u043a\u0430<\/h4>\n<p>\u041f\u043e\u0438\u0441\u043a \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0438\u00a0<a href=\"https:\/\/www.algolia.com\/\" rel=\"noopener noreferrer nofollow\">Algolia<\/a>: \u0438\u043d\u0434\u0435\u043a\u0441\u0438\u0440\u0443\u044e\u0442\u0441\u044f \u0432\u0441\u0435 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0438 \u043f\u0435\u0440\u0432\u043e\u0433\u043e, \u0432\u0442\u043e\u0440\u043e\u0433\u043e \u0438 \u0442\u0440\u0435\u0442\u044c\u0435\u0433\u043e \u0443\u0440\u043e\u0432\u043d\u0435\u0439 (h1-h3), \u0438 \u0432 \u0434\u0430\u043b\u044c\u043d\u0435\u0439\u0448\u0435\u043c, \u043f\u043e\u0438\u0441\u043a \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0438\u043c\u0435\u043d\u043d\u043e \u043f\u043e \u043d\u0438\u043c.<\/p>\n<p>\u0414\u043b\u044f \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u043f\u043e\u0438\u0441\u043a\u0430, \u0432 \u043a\u043e\u043d\u0444\u0438\u0433\u0435\u00a0<code>\"src\/.vuepress\/config.js\"<\/code>\u00a0\u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0443\u043a\u0430\u0437\u0430\u0442\u044c\u00a0<code>\"search: true\"<\/code>:<\/p>\n<pre><code class=\"javascript\">module.exports = {     themeConfig: {         search: true,     }, }<\/code><\/pre>\n<p>\u041f\u0440\u043e\u0432\u0435\u0440\u0438\u043c \u0440\u0430\u0431\u043e\u0442\u0443 \u043f\u043e\u0438\u0441\u043a\u0430. \u041d\u0430 \u0434\u0430\u043d\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442, \u0443 \u043a\u0430\u0436\u0434\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a \u043f\u0435\u0440\u0432\u043e\u0433\u043e \u0443\u0440\u043e\u0432\u043d\u044f. \u0412\u0432\u043e\u0434\u0438\u043c \u0432 \u043f\u043e\u0438\u0441\u043a \u0447\u0430\u0441\u0442\u044c \u0441\u043b\u043e\u0432\u0430, \u0438 \u043f\u043e \u0438\u0442\u043e\u0433\u0443 \u043f\u043e\u043b\u0443\u0447\u0438\u043c \u0441\u0441\u044b\u043b\u043a\u0438 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0441 \u0441\u043e\u0432\u043f\u0430\u0434\u0435\u043d\u0438\u0435\u043c.<\/p>\n<figure class=\"bordered full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/30e\/6a2\/249\/30e6a2249b90f57cde1494f866d38a94.png\" width=\"539\" height=\"210\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/30e\/6a2\/249\/30e6a2249b90f57cde1494f866d38a94.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0414\u043e\u0431\u0430\u0432\u0438\u043c \u0435\u0449\u0435 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u043e\u0432 \u0432\u0442\u043e\u0440\u043e\u0433\u043e, \u0442\u0440\u0435\u0442\u044c\u0435\u0433\u043e \u0438 \u0447\u0435\u0442\u0432\u0435\u0440\u0442\u043e\u0433\u043e \u0443\u0440\u043e\u0432\u043d\u0435\u0439 \u0432 \u043b\u044e\u0431\u043e\u0439 \u0438\u0437 Markdown-\u0444\u0430\u0439\u043b\u043e\u0432. \u041f\u043e\u0441\u043b\u0435 \u044d\u0442\u043e\u0433\u043e \u043c\u043e\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c, \u0447\u0442\u043e \u0438\u043d\u0434\u0435\u043a\u0441\u0438\u0440\u0443\u044e\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0438 \u043f\u0435\u0440\u0432\u043e\u0433\u043e, \u0432\u0442\u043e\u0440\u043e\u0433\u043e \u0438 \u0442\u0440\u0435\u0442\u044c\u0435\u0433\u043e \u0443\u0440\u043e\u0432\u043d\u044f. \u041f\u043e\u0438\u0441\u043a \u043f\u043e \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0443 \u0447\u0435\u0442\u0432\u0435\u0440\u0442\u043e\u0433\u043e \u0443\u0440\u043e\u0432\u043d\u044f \u043d\u0435 \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0435\u0442\u0441\u044f.<\/p>\n<h4>12. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 Vue-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432<\/h4>\n<p>VuePress \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a Vue.js &#8212; \u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e, \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0435 Vue-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0432 \u043d\u0430\u0448\u0438 Markdown-\u0444\u0430\u0439\u043b\u044b.<\/p>\n<p>\u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e\u00a0<code>\"components\"<\/code>\u00a0\u0432\u00a0<code>\".\/src\/.vuepress\/\"<\/code>, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0431\u0443\u0434\u0443\u0442 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0435 vue-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b (\u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438 \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c \u0438\u043c\u0435\u043d\u043d\u043e \u0442\u0430\u043a\u0438\u043c):<\/p>\n<figure class=\"bordered\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/c9b\/09e\/58a\/c9b09e58a6b5b47ec96439b454e1418a.png\" width=\"249\" height=\"326\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/c9b\/09e\/58a\/c9b09e58a6b5b47ec96439b454e1418a.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043f\u0440\u043e\u0441\u0442\u043e\u0439 vue-\u043a\u043e\u043c\u043e\u043f\u043d\u0435\u043d\u0442 \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438\u00a0<code>\"components\"<\/code>. \u041d\u0430\u0437\u043e\u0432\u0451\u043c \u0435\u0433\u043e\u00a0<code>\"v-hello.vue\"<\/code>\u00a0&#8212; \u043e\u043d \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0432\u043e\u0434\u0438\u0442\u044c \u043f\u0440\u0438\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0435 \u0434\u043b\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0441 \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u044b\u043c \u0438\u043c\u0435\u043d\u0435\u043c.<\/p>\n<pre><code class=\"xml\">&lt;template>     &lt;div class=\"wrapper\">         Hello, {{name}}!     &lt;\/div> &lt;\/template>  &lt;script> export default {     props: ['name'] } &lt;\/script>  &lt;style scoped> .wrapper {     padding: 10px;     margin: 10px 0;     font-weight: 600;     background-color: #44e4d6; } &lt;\/style><\/code><\/pre>\n<p>\u0412\u044b\u0437\u044b\u0432\u0430\u0442\u044c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043c\u043e\u0436\u043d\u043e \u0438\u0437 \u043b\u044e\u0431\u043e\u0433\u043e Markdown-\u0444\u0430\u0439\u043b\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446. \u041f\u0440\u0438\u043c\u0435\u0440 \u0432\u044b\u0437\u043e\u0432\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430:<\/p>\n<pre><code class=\"xml\">&lt;v-hello name=\"Tony\" \/><\/code><\/pre>\n<p>\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432\u044b\u0437\u043e\u0432\u0430:<\/p>\n<figure class=\"bordered full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/d4b\/f3c\/c18\/d4bf3cc18e1a825792f467aacbae6b26.png\" width=\"588\" height=\"55\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d4b\/f3c\/c18\/d4bf3cc18e1a825792f467aacbae6b26.png\"\/><figcaption><\/figcaption><\/figure>\n<h4>13. \u0421\u0431\u043e\u0440\u043a\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/h4>\n<p>\u0414\u043b\u044f \u0441\u0431\u043e\u0440\u043a\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0441\u043a\u0440\u0438\u043f\u0442:<\/p>\n<pre><code>npm run build<\/code><\/pre>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0443\u0441\u043f\u0435\u0448\u043d\u043e\u0439 \u0441\u0431\u043e\u0440\u043a\u0438, \u0441\u043e\u0431\u0440\u0430\u043d\u043d\u044b\u0439 \u043f\u0440\u043e\u0435\u043a\u0442 \u0431\u0443\u0434\u0435\u0442 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0432\u00a0<code>\".\/src\/.vuepress\/dist\"<\/code>. \u041f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0430 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0443 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438\u00a0<code>\"dist\"<\/code>:<\/p>\n<figure class=\"bordered\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/6b7\/bdd\/2a9\/6b7bdd2a99cd8988b69492f250de9192.png\" alt=\"\" title=\"\" width=\"241\" height=\"433\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/6b7\/bdd\/2a9\/6b7bdd2a99cd8988b69492f250de9192.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0421\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438:<\/p>\n<ul>\n<li>\n<p>\u0414\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f\u00a0<code>\"assets\"<\/code>\u00a0&#8212; \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0434\u043b\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446<\/p>\n<\/li>\n<li>\n<p>\u0414\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f\u00a0<code>\"pages\"<\/code>\u00a0&#8212; \u0441\u0430\u043c\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b: &#171;react&#187; \u0438 &#171;vue&#187;<\/p>\n<\/li>\n<li>\n<p>\u0421\u0442\u0440\u0430\u043d\u0438\u0446\u0430 404 \u0441\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043b\u0430\u0441\u044c \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438<\/p>\n<\/li>\n<li>\n<p>\u041a\u043e\u0440\u043d\u0435\u0432\u044b\u0435 \u0444\u0430\u0439\u043b\u044b\u00a0<code>\"favicon.svg\"<\/code>\u00a0\u0438\u00a0<code>\"favicon.svg\"<\/code>\u00a0&#8212; \u0431\u044b\u043b\u0438 \u0432\u0437\u044f\u0442\u044b \u0438\u0437\u00a0<code>\".\/src\/.vuepress\/public\"<\/code>.<\/p>\n<\/li>\n<li>\n<p>\u0424\u0430\u0439\u043b\u00a0<code>\"index.html\"<\/code>\u00a0&#8212; \u0441\u0442\u0430\u0440\u0442\u043e\u0432\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430<\/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 \u0441\u043e\u0431\u043e\u0439 \u0441\u0442\u0430\u0442\u0438\u0447\u043d\u044b\u0435 \u0444\u0430\u0439\u043b\u044b, \u0433\u043e\u0442\u043e\u0432\u044b\u0435 \u043a \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0435 \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440.<\/p>\n<p>\u041e\u0431\u0440\u0430\u0442\u0438\u043c \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043d\u0430 \u0437\u0430\u0434\u0430\u043d\u0438\u0435 \u043f\u0443\u0442\u0435\u0439 \u0432 \u0444\u0430\u0439\u043b\u0430\u0445\u00a0<code>\".html\"<\/code>. \u0414\u043b\u044f \u043f\u0440\u0438\u043c\u0435\u0440\u0430, \u0432\u043e\u0437\u044c\u043c\u0435\u043c \u0444\u0430\u0439\u043b\u00a0<code>\".\/src\/.vuepress\/public\/index.html\"<\/code>. \u0412 \u044d\u0442\u043e\u043c \u0444\u0430\u0439\u043b\u0435 \u044f \u043e\u0441\u0442\u0430\u0432\u0438\u043b \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0443\u0442\u0438 \u0434\u043b\u044f \u0434\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0430\u0446\u0438\u0438:<\/p>\n<pre><code class=\"xml\">&lt;!DOCTYPE html> &lt;html>     &lt;head>         &lt;link rel=\"icon\" href=\"\/favicon.svg\">         &lt;link rel=\"preload\" href=\"\/assets\/css\/0.styles.96af6c87.css\">         ...     &lt;\/head>     &lt;body>         ...         &lt;script src=\"\/assets\/js\/app.b24ed5d1.js\" defer>&lt;\/script>         ...     &lt;\/body> &lt;\/html><\/code><\/pre>\n<p>\u041f\u0443\u0442\u0438 \u043d\u0430\u0447\u0438\u043d\u0430\u044e\u0442\u0441\u044f \u0441\u00a0<code>\"\/\"<\/code>\u00a0&#8212; \u044d\u0442\u043e \u0437\u043d\u0430\u0447\u0438\u0442, \u0447\u0442\u043e \u0444\u0430\u0439\u043b\u044b \u0431\u0443\u0434\u0443\u0442 \u0438\u0441\u043a\u0430\u0442\u044c\u0441\u044f \u0432 \u043a\u043e\u0440\u043d\u0435\u0432\u043e\u0439 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438. \u041a \u043f\u0440\u0438\u043c\u0435\u0440\u0443, \u0434\u043b\u044f \u0441\u0430\u0439\u0442\u0430\u00a0<code>\"https:\/\/mysite.ru\"<\/code>,\u00a0<code>\"favicon.svg\"<\/code>\u00a0\u0434\u043e\u043b\u0436\u0435\u043d \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0432 \u043a\u043e\u0440\u043d\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u0430.<\/p>\n<p>\u041d\u043e \u0447\u0442\u043e \u0435\u0441\u043b\u0438, \u043f\u0440\u043e\u0435\u043a\u0442 \u0440\u0430\u0441\u043f\u043e\u043b\u0430\u0433\u0430\u0435\u0442\u0441\u044f \u043f\u043e \u0430\u0434\u0440\u0435\u0441\u0443\u00a0<code>\"https:\/\/mysite.ru\/vue-press\"<\/code>\u00a0\u0438 \u0444\u0430\u0439\u043b\u00a0<code>\"favicon.svg\"<\/code>\u00a0\u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438\u00a0<code>\"vue-press-sample\"<\/code>? \u0412 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u043f\u0443\u0442\u044c \u043a\u00a0<code>\"favicon.svg\"<\/code>\u00a0\u0431\u0443\u0434\u0435\u0442 \u043d\u0435\u043a\u043e\u0440\u0440\u0435\u043a\u0442\u0435\u043d:<\/p>\n<pre><code class=\"xml\">&lt;!-- \u041d\u0435\u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e --> &lt;link rel=\"icon\" href=\"\/favicon.svg\">  &lt;!-- \u041a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e --> &lt;link rel=\"icon\" href=\"\/vue-press-sample\/favicon.svg\"><\/code><\/pre>\n<p>\u0414\u043b\u044f \u0437\u0430\u0434\u0430\u043d\u0438\u044f \u043a\u043e\u0440\u043d\u0435\u0432\u043e\u0433\u043e URL \u0441\u0431\u043e\u0440\u043a\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u043a\u043e\u043d\u0444\u0438\u0433 VuePress.<\/p>\n<h4>14. \u0417\u0430\u0434\u0430\u043d\u0438\u0435 \u043a\u043e\u0440\u043d\u0435\u0432\u043e\u0433\u043e URL<\/h4>\n<p>\u0415\u0441\u043b\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0431\u0443\u0434\u0435\u0442 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438, \u043e\u0442\u043b\u0438\u0447\u043d\u043e\u0439 \u043e\u0442 \u043a\u043e\u0440\u043d\u0435\u0432\u043e\u0439, \u0442\u043e \u0441\u043a\u043e\u0440\u0440\u0435\u043a\u0442\u0438\u0440\u0443\u0435\u043c \u0440\u0430\u0437\u0434\u0435\u043b\u00a0<code>\"base\"<\/code>\u00a0\u0432 \u0444\u0430\u0439\u043b\u0435\u00a0<code>\".\/src\/.vuepress\/config.js\"<\/code>:<\/p>\n<pre><code class=\"javascript\">module.exports = {     themeConfig: {},     base: '\/vue-press-sample\/', }<\/code><\/pre>\n<p>\u0412 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u00a0<code>\"base\"<\/code>\u00a0\u044f \u0443\u043a\u0430\u0437\u0430\u043b \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0441\u0432\u043e\u0435\u0433\u043e \u0431\u0443\u0434\u0443\u0449\u0435\u0433\u043e GitHub-\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f, \u0442.\u043a. \u043f\u0440\u0438 \u0434\u0435\u043f\u043b\u043e\u0435 \u043d\u0430 GitHub Pages, \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0430\u0434\u0440\u0435\u0441\u0430 \u0431\u0443\u0434\u0435\u0442 \u0431\u0440\u0430\u0442\u044c\u0441\u044f \u0435\u0433\u043e \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435.<\/p>\n<p>\u0417\u0430\u043f\u0443\u0441\u0442\u0438\u043c \u0441\u0431\u043e\u0440\u043a\u0443 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\u00a0<code>\"npm run build\"<\/code>\u00a0\u0438 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0430 \u0444\u0430\u0439\u043b\u00a0<code>\".\/src\/.vuepress\/public\/index.html\"<\/code>. \u041e\u043f\u044f\u0442\u044c \u0436\u0435, \u0434\u043b\u044f \u0434\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0430\u0446\u0438\u0438, \u044f \u043f\u0440\u0438\u0432\u0451\u043b \u0442\u043e\u043b\u044c\u043a\u043e \u0447\u0430\u0441\u0442\u044c \u0444\u0430\u0439\u043b\u0430:<\/p>\n<pre><code class=\"xml\">&lt;!DOCTYPE html> &lt;html>     &lt;head>         &lt;link rel=\"icon\" href=\"\/vue-press-sample\/favicon.svg\">         &lt;link rel=\"preload\" href=\"\/vue-press-sample\/assets\/css\/0.styles.96af6c87.css\">         ...     &lt;\/head>     &lt;body>         ...         &lt;script src=\"\/vue-press-sample\/assets\/js\/app.b24ed5d1.js\" defer>&lt;\/script>         ...     &lt;\/body> &lt;\/html><\/code><\/pre>\n<p>\u0412\u0438\u0434\u043d\u043e, \u0447\u0442\u043e \u0432 \u043f\u0443\u0442\u0438 \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0444\u0430\u0439\u043b\u0430 \u0434\u043e\u0431\u0430\u0432\u0438\u043b\u043e\u0441\u044c\u00a0<code>\"\/vue-press-sample\/\"<\/code>\u00a0&#8212; \u044d\u0442\u043e \u0442\u043e, \u0447\u0442\u043e \u043c\u044b \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u043b\u0438 \u0432 \u0444\u0430\u0439\u043b\u0435 \u043a\u043e\u043d\u0444\u0438\u0433\u0430 \u0432 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u00a0<code>\"base\"<\/code>.<\/p>\n<p>\u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u043b\u0438 \u0441\u0431\u043e\u0440\u043a\u0443 \u043d\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0433\u043e\u0442\u043e\u0432\u0443\u044e \u0434\u043b\u044f \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u043d\u0430 GitHub \u0438 GitHub Pages.<\/p>\n<h4>15. \u0414\u0435\u043f\u043b\u043e\u0439 \u043d\u0430 GitHub<\/h4>\n<p>\u0414\u043b\u044f \u043d\u0430\u0447\u0430\u043b\u0430 \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u0444\u0430\u0439\u043b\u00a0<code>\".gitignore\"<\/code>\u00a0\u0432 \u043a\u043e\u0440\u0435\u043d\u044c \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u0421\u0443\u0434\u044f \u0438\u0437 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u043e\u043f\u0438\u0441\u0430\u0442\u044c \u0432 \u043d\u0451\u043c \u0444\u0430\u0439\u043b\u044b \u0438\u043b\u0438 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0435 \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0442\u044c \u043d\u0430 GitHub.<\/p>\n<p>\u041d\u0430 GitHub \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0435\u043c \u0442\u043e\u043b\u044c\u043a\u043e \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u0435 \u0444\u0430\u0439\u043b\u044b. \u0412\u0441\u0451 \u0447\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0441\u043e\u0431\u0440\u0430\u0442\u044c \u0438\u043b\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c, \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0442\u044c \u043d\u0435 \u043d\u0443\u0436\u043d\u043e.<\/p>\n<p>\u0427\u0442\u043e \u0432\u044b\u043d\u0435\u0441\u0435\u043c \u0432 \u0438\u0433\u043d\u043e\u0440:<\/p>\n<ul>\n<li>\n<p><code>\"node_modules\"<\/code>\u00a0&#8212; \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u0435 npm-\u043f\u0430\u043a\u0435\u0442\u044b. \u041f\u0440\u0438 \u043a\u043b\u043e\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f, \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u043c \u043a\u043e\u043c\u0430\u043d\u0434\u0443\u00a0<code>\"npm i\"<\/code>\u00a0\u0438 \u0438\u0437 \u0444\u0430\u0439\u043b\u0430\u00a0<code>\"package.json\"<\/code>\u00a0\u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 \u0432\u0441\u0435\u0445 \u043f\u0430\u043a\u0435\u0442\u043e\u0432.<\/p>\n<\/li>\n<li>\n<p><code>\".\/src\/.vuepress\/dist\"<\/code>\u00a0&#8212; \u0441\u0431\u043e\u0440\u043a\u0430 \u043d\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041f\u0440\u0438 \u043a\u043b\u043e\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f, \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u043c \u043a\u043e\u043c\u0430\u043d\u0434\u0443\u00a0<code>\"npm run build\"<\/code>\u00a0\u0438 \u0441\u0431\u043e\u0440\u043a\u0430 \u0433\u043e\u0442\u043e\u0432\u0430.<\/p>\n<\/li>\n<\/ul>\n<p>\u0424\u0430\u0439\u043b\u00a0<code>\".gitignore\"<\/code>\u00a0\u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n<pre><code>node_modules src\/.vuepress\/dist<\/code><\/pre>\n<p>\u0417\u0430\u0433\u0440\u0443\u0437\u0438\u043c \u043f\u0440\u043e\u0435\u043a\u0442 \u043d\u0430 GitHub. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043c\u043e\u0436\u043d\u043e \u0432\u043e\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u043b\u044e\u0431\u0438\u043c\u044b\u043c\u0438 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0430\u043c\u0438: GitHub Desktop, \u043a\u043e\u043c\u0430\u043d\u0434\u043d\u043e\u0439 \u0441\u0442\u0440\u043e\u043a\u043e\u0439 \u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u0438\u043c\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u043c\u0438.<\/p>\n<p>\u041f\u043e \u0438\u0442\u043e\u0433\u0443, \u043f\u043e\u043b\u0443\u0447\u0438\u043c GitHub-\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439 \u0441 \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u043c:<\/p>\n<figure class=\"bordered full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/3da\/915\/aed\/3da915aed59f3cbc7ade6c75d1b10dcc.png\" width=\"891\" height=\"654\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/3da\/915\/aed\/3da915aed59f3cbc7ade6c75d1b10dcc.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041c\u043e\u0439 \u043f\u0440\u043e\u0435\u043a\u0442 \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043f\u043e\u00a0<a href=\"https:\/\/github.com\/dev-pandaren\/vue-press-sample\" rel=\"noopener noreferrer nofollow\">\u0441\u0441\u044b\u043b\u043a\u0435<\/a>.<\/p>\n<p>\u041f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u043a \u0434\u0435\u043f\u043b\u043e\u044e \u043d\u0430 GitHub Pages.<\/p>\n<h4>16. \u0414\u0435\u043f\u043b\u043e\u0439 \u043d\u0430 GitHub Pages<\/h4>\n<p>\u0414\u043b\u044f GitHub Pages \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432\u0435\u0442\u043a\u0430\u00a0<code>\"gh-pages\"<\/code>\u00a0\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f, \u043d\u043e \u043f\u0440\u0438 \u0436\u0435\u043b\u0430\u043d\u0438\u0438, \u0432 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u0445 \u0432 \u0441\u0435\u043a\u0446\u0438\u0438\u00a0<code>\"Pages\"<\/code>\u00a0\u043c\u043e\u0436\u043d\u043e \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u0438 \u0434\u0440\u0443\u0433\u0443\u044e:<\/p>\n<figure class=\"bordered full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/4d8\/662\/3d9\/4d86623d93a0a6a35880a8a4074fef83.png\" width=\"790\" height=\"728\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/4d8\/662\/3d9\/4d86623d93a0a6a35880a8a4074fef83.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0414\u043b\u044f \u0434\u0435\u043f\u043b\u043e\u044f, \u043c\u043e\u0436\u043d\u043e \u0432\u0440\u0443\u0447\u043d\u0443\u044e \u0432\u0440\u0443\u0447\u043d\u0443\u044e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0432\u0435\u0442\u043a\u0443\u00a0<code>\"gh-pages\"<\/code>\u00a0\u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044c \u0441\u0431\u043e\u0440\u043a\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f &#8212; \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e\u00a0<code>\"src\\.vuepress\\dist\"<\/code>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0441\u043e\u0437\u0434\u0430\u0451\u0442\u0441\u044f \u043f\u0440\u0438 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0438 \u043a\u043e\u043c\u0430\u043d\u0434\u044b\u00a0<code>\"npm run build\"<\/code>. \u041d\u043e \u044d\u0442\u043e \u043d\u0435 \u0441\u0442\u043e\u043b\u044c \u0443\u0434\u043e\u0431\u043d\u043e.<\/p>\n<p>\u0414\u043b\u044f \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0437\u0430\u0446\u0438\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u043c npm-\u043f\u0430\u043a\u0435\u0442\u00a0<code>\"gh-pages\"<\/code>. \u041f\u0440\u0438 \u044d\u0442\u043e\u043c, \u0431\u0443\u0434\u0435\u0442 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0442\u043e\u043b\u044c\u043a\u043e \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c npm-\u0441\u043a\u0440\u0438\u043f\u0442 \u0438 \u043f\u0430\u043a\u0435\u0442 \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e \u0441\u043e\u0437\u0434\u0430\u0441\u0442 \u0432\u0435\u0442\u043a\u0443\u00a0<code>\"gh-pages\"<\/code>\u00a0(\u0435\u0441\u043b\u0438 \u0435\u0435 \u0435\u0449\u0435 \u043d\u0435 \u0431\u044b\u043b\u043e) \u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442 \u0444\u0430\u043b\u044b \u0441\u0431\u043e\u0440\u043a\u0438.<\/p>\n<pre><code class=\"bash\">npm i gh-pages --save-dev<\/code><\/pre>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438, \u0432 \u0444\u0430\u0439\u043b\u0435\u00a0<code>\"package.json\"<\/code>\u00a0\u0434\u043e\u0431\u0430\u0432\u0438\u043c 2 \u0441\u043a\u0440\u0438\u043f\u0442\u0430:<\/p>\n<pre><code class=\"json\">\"scripts\": {     \"build-gh-pages\": \"gh-pages -d src\/.vuepress\/dist\",     \"deploy\": \"npm run build &amp;&amp; npm run build-gh-pages\" },<\/code><\/pre>\n<ul>\n<li>\n<p>\u0421\u043a\u0440\u0438\u043f\u0442\u00a0<code>\"build-gh-pages\"<\/code>\u00a0\u0432\u043e\u0437\u044c\u043c\u0451\u0442 \u0444\u0430\u0439\u043b\u044b \u0441\u0431\u043e\u0440\u043a\u0438 \u0438\u0437\u00a0<code>\"src\/.vuepress\/dist\"<\/code>\u00a0\u0438 \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442 \u043f\u0430\u043a\u0435\u0442\u00a0<code>\"gh-pages\"<\/code><\/p>\n<\/li>\n<li>\n<p>\u0421\u043a\u0440\u0438\u043f\u0442\u00a0<code>\"deploy\"<\/code>\u00a0&#8212; \u0433\u0440\u0443\u043f\u043f\u0438\u0440\u0443\u0435\u0442 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0435 \u0441\u043a\u0440\u0438\u043f\u0442\u044b \u0438 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442 \u0438\u0445 \u0432 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u043c \u043f\u043e\u0440\u044f\u0434\u043a\u0435: \u0434\u0435\u043b\u0430\u0435\u043c \u0441\u0431\u043e\u0440\u043a\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043f\u043e\u0442\u043e\u043c \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u043c \u0440\u0430\u0431\u043e\u0442\u0443 \u043f\u0430\u043a\u0435\u0442\u0430\u00a0<code>\"gh-pages\"<\/code><\/p>\n<\/li>\n<\/ul>\n<p>\u0422\u0430\u043a\u0436\u0435, \u0432 \u0441\u0435\u043a\u0446\u0438\u044e\u00a0<code>\"homepage\"<\/code>\u00a0\u043f\u0440\u043e\u043f\u0438\u0448\u0435\u043c \u0430\u0434\u0440\u0435\u0441 \u043d\u0430\u0448\u0435\u0433\u043e \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f (\u0434\u043b\u044f \u0432\u0430\u0441 \u0430\u0434\u0440\u0435\u0441 \u0431\u0443\u0434\u0435\u0442 \u0434\u0440\u0443\u0433\u0438\u043c):<\/p>\n<pre><code class=\"json\">{     \"homepage\": \"https:\/\/github.com\/dev-pandaren\/vue-press-sample\", }<\/code><\/pre>\n<ul>\n<li>\n<p><code>dev-pandaren<\/code>\u00a0&#8212; \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0430\u043a\u043a\u0430\u0443\u043d\u0442\u0430<\/p>\n<\/li>\n<li>\n<p><code>vue-press-sample<\/code>\u00a0&#8212; \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f<\/p>\n<\/li>\n<\/ul>\n<p>\u0418\u0442\u043e\u0433\u043e\u0432\u044b\u0439 \u0432\u0438\u0434 \u0444\u0430\u0439\u043b\u0430\u00a0<code>\"package.json\"<\/code>\u00a0\u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n<pre><code class=\"json\">{     \"name\": \"vue-press\",     \"version\": \"1.0.0\",     \"homepage\": \"https:\/\/github.com\/dev-pandaren\/vue-press-sample\",     \"main\": \"index.js\",     \"scripts\": {         \"start\": \"vuepress dev src\",         \"deploy\": \"npm run build &amp;&amp; npm run build-gh-pages\",         \"build\": \"vuepress build src\",         \"build-gh-pages\": \"gh-pages -d src\/.vuepress\/dist\"     },     \"devDependencies\": {         \"gh-pages\": \"^3.1.0\",         \"vuepress\": \"^1.5.3\"     } }<\/code><\/pre>\n<p>\u0417\u0430\u043f\u0443\u0441\u0442\u0438\u043c \u0441\u043a\u0440\u0438\u043f\u0442\u00a0<code>\"deploy\"<\/code>: \u043f\u0440\u043e\u0438\u0437\u043e\u0439\u0434\u0435\u0442 \u0441\u0431\u043e\u0440\u043a\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u0434\u0435\u043f\u043b\u043e\u0439 \u043d\u0430 GitHub Pages. \u0415\u0441\u043b\u0438 \u0432\u044b \u043d\u0435 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u043e\u0432\u0430\u043d\u044b \u043d\u0430 GitHub, \u0442\u043e \u043f\u043e\u044f\u0432\u0438\u0442\u0441\u044f \u043e\u043a\u043d\u043e, \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u044e\u0449\u0435\u0435 \u044d\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c.<\/p>\n<p>\u0421\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u0438 \u0431\u0443\u0434\u0443\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u043f\u043e\u0434\u043e\u0431\u043d\u044b\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n<figure class=\"bordered full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/c88\/871\/4d4\/c888714d4a2fb495bb4dc0926f83ebc4.png\" width=\"885\" height=\"410\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/c88\/871\/4d4\/c888714d4a2fb495bb4dc0926f83ebc4.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041f\u0435\u0440\u0435\u0439\u0434\u0435\u043c \u043d\u0430 GitHub \u0438 \u0443\u0432\u0438\u0434\u0438\u043c \u0435\u0449\u0435 \u043e\u0434\u043d\u0443 \u0432\u0435\u0442\u043a\u0443\u00a0<code>\"gh-pages\"<\/code>, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0431\u0443\u0434\u0435\u0442 \u0441\u0431\u043e\u0440\u043a\u0430 \u043d\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f:  <\/p>\n<figure class=\"bordered full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/54b\/4c1\/b6c\/54b4c1b6c1657c535ce0208e18e2bf48.png\" width=\"723\" height=\"698\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/54b\/4c1\/b6c\/54b4c1b6c1657c535ce0208e18e2bf48.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412\u043e\u0442 \u0438 \u0432\u0441\u0451! \u041f\u043e\u0441\u043b\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0432\u0435\u0442\u043a\u0438\u00a0<code>\"gh-pages\"<\/code>, GitHub \u0432\u043e\u0437\u044c\u043c\u0451\u0442 \u0444\u0430\u0439\u043b\u044b \u0441\u0431\u043e\u0440\u043a\u0438 \u0438 \u0441\u043e\u0437\u0434\u0430\u0441\u0442 GitHub Pages &#8212; \u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043f\u043e\u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0432\u0440\u0435\u043c\u044f (\u0434\u043e 24 \u0447\u0430\u0441\u043e\u0432).<\/p>\n<p>\u0415\u0441\u043b\u0438 \u043c\u044b \u043f\u0435\u0440\u0435\u0439\u0434\u0435\u043c \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u0432 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f \u0438 \u0432\u044b\u0431\u0435\u0440\u0435\u043c \u0441\u0435\u043a\u0446\u0438\u044e\u00a0<code>\"Pages\"<\/code>, \u0442\u043e \u0443\u0432\u0438\u0434\u0438\u043c \u0441\u0441\u044b\u043b\u043a\u0443 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 GitHub Pages. \u041f\u0440\u0438 \u044d\u0442\u043e\u043c, \u0432 \u0440\u0430\u0437\u0434\u0435\u043b\u0435 &#171;Source&#187;, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u0432\u0435\u0442\u043a\u0443\u00a0<code>\"gh-pages\"<\/code>, \u0435\u0441\u043b\u0438 \u043e\u043d\u0430 \u043d\u0435 \u0431\u044b\u043b\u0430 \u0432\u044b\u0431\u0440\u0430\u043d\u0430.<\/p>\n<figure class=\"bordered full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/70c\/b9b\/95c\/70cb9b95cddf8371c326b2e42cee29fa.png\" width=\"1080\" height=\"599\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/70c\/b9b\/95c\/70cb9b95cddf8371c326b2e42cee29fa.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412 \u043c\u043e\u0451\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u044d\u0442\u043e:\u00a0<a href=\"https:\/\/dev-pandaren.github.io\/vue-press-sample\/\" rel=\"noopener noreferrer nofollow\">https:\/\/dev-pandaren.github.io\/vue-press-sample\/<\/a><\/p>\n<p>\u0420\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u0430\u0434\u0440\u0435\u0441 \u043f\u043e \u0447\u0430\u0441\u0442\u044f\u043c:<\/p>\n<ul>\n<li>\n<p><code>dev-pandaren<\/code>\u00a0&#8212; \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0430\u043a\u043a\u0430\u0443\u043d\u0442\u0430<\/p>\n<\/li>\n<li>\n<p><code>.github.io<\/code>\u00a0&#8212; \u0434\u043e\u043c\u0435\u043d \u0434\u043b\u044f GitHub Pages<\/p>\n<\/li>\n<li>\n<p><code>vue-press-sample<\/code>\u00a0&#8212; \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u043f\u043e \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u043e\u043c\u0443 \u0430\u0434\u0440\u0435\u0441\u0443 GitHub Pages \u0438 \u0432\u0438\u0434\u0438\u043c \u043d\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435:<\/p>\n<figure class=\"bordered full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/1d7\/ff2\/09f\/1d7ff209f63319519f8322b7d20b234a.png\" width=\"1030\" height=\"392\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/1d7\/ff2\/09f\/1d7ff209f63319519f8322b7d20b234a.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041d\u0430 \u044d\u0442\u043e\u043c \u043c\u044b \u0437\u0430\u0432\u0435\u0440\u0448\u0438\u043b\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u0438 \u0434\u0435\u043f\u043b\u043e\u0439 \u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0430 VuePress. \u041d\u0438\u0436\u0435 \u043f\u0440\u0438\u0432\u043e\u0436\u0443 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0441\u0441\u044b\u043b\u043a\u0438.<\/p>\n<h3>\u0421\u0441\u044b\u043b\u043a\u0438<\/h3>\n<h4>\u0421\u0441\u044b\u043b\u043a\u0438 \u043d\u0430 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044e<\/h4>\n<ul>\n<li>\n<p><a href=\"https:\/\/vuepress.vuejs.org\/\" rel=\"noopener noreferrer nofollow\">https:\/\/vuepress.vuejs.org\/<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/vuejs.org\/\" rel=\"noopener noreferrer nofollow\">https:\/\/vuejs.org\/<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/www.algolia.com\/\" rel=\"noopener noreferrer nofollow\">https:\/\/www.algolia.com\/<\/a><\/p>\n<\/li>\n<\/ul>\n<h4>\u0421\u0441\u044b\u043b\u043a\u0438 \u043d\u0430 \u0433\u043e\u0442\u043e\u0432\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435<\/h4>\n<ul>\n<li>\n<p><a href=\"https:\/\/github.com\/dev-pandaren\/vue-press-sample\" rel=\"noopener noreferrer nofollow\">https:\/\/github.com\/dev-pandaren\/vue-press-sample<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/dev-pandaren.github.io\/vue-press-sample\/\" rel=\"noopener noreferrer nofollow\">https:\/\/dev-pandaren.github.io\/vue-press-sample\/<\/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\/580894\/\"> https:\/\/habr.com\/ru\/articles\/580894\/<\/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<h3>\u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0430<\/h3>\n<p><a href=\"https:\/\/vuepress.vuejs.org\/guide\/#how-it-works\" rel=\"noopener noreferrer nofollow\">VuePress<\/a>\u00a0\u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0431\u043e\u0439 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u0438\u0441\u0442\u0438\u0447\u043d\u044b\u0439 \u0433\u0435\u043d\u0435\u0440\u0430\u0442\u043e\u0440 \u0441\u0442\u0430\u0442\u0438\u0447\u043d\u044b\u0445 \u0441\u0430\u0439\u0442\u043e\u0432, \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u0434\u043b\u044f \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u0442\u0435\u0445\u043d\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438.<\/p>\n<p>\u0418\u0437\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0439 \u0446\u0435\u043b\u044c\u044e VuePress, \u0431\u044b\u043b\u0430 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0430 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430 Vue.js \u0438 \u0441\u043e\u043f\u0443\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0435\u0439 \u0438\u043d\u0444\u0440\u0430\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u044b. \u0414\u043b\u044f \u043f\u0440\u0438\u043c\u0435\u0440\u0430, \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043b\u044e\u0431\u0443\u044e \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044e \u043f\u043e Vue:\u00a0<a href=\"https:\/\/vuejs.org\/\" rel=\"noopener noreferrer nofollow\">Vue.js<\/a>,\u00a0<a href=\"https:\/\/router.vuejs.org\/\" rel=\"noopener noreferrer nofollow\">Vue Router<\/a>,\u00a0<a href=\"https:\/\/vuex.vuejs.org\/\" rel=\"noopener noreferrer nofollow\">Vuex<\/a>, \u0433\u0434\u0435 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0435\u0434\u0438\u043d\u044b\u0439 \u0441\u0442\u0438\u043b\u044c, \u0437\u0430\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0439 \u0432 \u043e\u0441\u043d\u043e\u0432\u0435 VuePress.<\/p>\n<p>\u0412 \u0445\u043e\u0434\u0435 \u0441\u0442\u0430\u0442\u044c\u0438 \u043c\u044b \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0443 VuePress, \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u0435\u043c \u0431\u0430\u0437\u043e\u0432\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438 \u0432\u044b\u043b\u043e\u0436\u0438\u043c \u043d\u0430\u00a0<a href=\"https:\/\/pages.github.com\/\" rel=\"noopener noreferrer nofollow\">GitHub Pages<\/a>.<\/p>\n<h3>\u041f\u0440\u0435\u0434\u0432\u0430\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043f\u043e\u0434\u0433\u043e\u0442\u043e\u0432\u043a\u0430<\/h3>\n<h4>1. \u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 Node.js \u0438 NPM<\/h4>\n<p>\u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u043c &#171;Current&#187; \u0432\u0435\u0440\u0441\u0438\u044e Node.js \u0441\u00a0<a href=\"https:\/\/nodejs.org\/en\/\" rel=\"noopener noreferrer nofollow\">\u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0441\u0430\u0439\u0442\u0430<\/a>. \u041f\u0440\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0435 \u043d\u0430 Windows, NPM \u0432\u0445\u043e\u0434\u0438\u0442 \u0432 \u0441\u043e\u0441\u0442\u0430\u0432 Node.js \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e. \u0414\u043b\u044f Linux \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c NPM \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e. <\/p>\n<h4>2. \u041f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u0441\u0442\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438<\/h4>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438, \u043e\u0442\u043a\u0440\u043e\u0435\u043c \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b \u0438 \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u043c \u0432\u0435\u0440\u0441\u0438\u0438 Node.js \u0438 NPM. \u0415\u0441\u043b\u0438 \u0432 \u043e\u0442\u0432\u0435\u0442 \u043f\u043e\u043b\u0443\u0447\u0438\u043c \u043d\u043e\u043c\u0435\u0440 \u0432\u0435\u0440\u0441\u0438\u0438 &#8212; \u0437\u043d\u0430\u0447\u0438\u0442 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043e \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e. <\/p>\n<pre><code class=\"bash\">node -v # \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u0432\u0435\u0440\u0441\u0438\u044e Node.js npm -v  # \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u0432\u0435\u0440\u0441\u0438\u044e NPM<\/code><\/pre>\n<h3>\u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 NPX-\u043f\u0430\u043a\u0435\u0442\u0430 \u0441 \u0433\u043e\u0442\u043e\u0432\u043e\u0439 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u043e\u0439<\/h3>\n<h4>1. \u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 create-vuepress-site<\/h4>\n<p>\u0421\u043e\u0437\u0434\u0430\u0435\u043c \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e \u0434\u043b\u044f \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0438 \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0432 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0435. \u0412\u044b\u0437\u044b\u0432\u0430\u0435\u043c \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b \u0438\u0437 \u0442\u0435\u043a\u0443\u0449\u0435\u0439 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438 \u0438 \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u043c \u043f\u0430\u043a\u0435\u0442\u044b:<\/p>\n<pre><code class=\"bash\">npx create-vuepress-site<\/code><\/pre>\n<p>\u041f\u043e\u0441\u043b\u0435 \u044d\u0442\u043e\u0433\u043e VuePress \u043f\u043e\u043f\u0440\u043e\u0441\u0438\u0442 \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0444\u0430\u0439\u043b\u0430\u00a0<code>\"package.json\"<\/code>: \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u0430, \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0438 \u043f\u0440\u043e\u0447\u0435\u0435. \u0424\u0430\u0439\u043b\u00a0<code>\"package.json\"<\/code>\u00a0\u043f\u043e\u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438 npm-\u043f\u0430\u043a\u0435\u0442\u043e\u0432 \u0438 \u0437\u0430\u043f\u0443\u0441\u043a\u0430 \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u0432.<\/p>\n<p>\u0412 \u0438\u0442\u043e\u0433\u0435, \u0431\u0443\u0434\u0435\u0442 \u0441\u043e\u0437\u0434\u0430\u043d\u0430 \u0431\u0430\u0437\u043e\u0432\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430:<\/p>\n<figure class=\"bordered full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u041a\u043e\u0440\u043d\u0435\u0432\u0430\u044f \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f\u00a0<code>\"docs\"<\/code>\u00a0\u043f\u043e\u0434\u0440\u0430\u0437\u0443\u043c\u0435\u0432\u0430\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 VuePress \u0432\u043d\u0443\u0442\u0440\u0438 \u0440\u0430\u0431\u043e\u0447\u0435\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u041c\u044b \u0431\u0443\u0434\u0435\u043c \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044e, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0443\u0431\u0435\u0440\u0435\u043c \u043b\u0438\u0448\u043d\u0438\u0439 \u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0438: \u0443\u0434\u0430\u043b\u0438\u043c \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e\u00a0<code>\"docs\"<\/code>, \u0430 \u0432\u0441\u0451 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043f\u043e\u043c\u0435\u0441\u0442\u0438\u043c \u0432 \u043a\u043e\u0440\u0435\u043d\u044c \u043f\u0440\u043e\u0435\u043a\u0442\u0430.  <\/p>\n<h4>2. \u0417\u0430\u043f\u0443\u0441\u043a \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/h4>\n<p>\u041d\u0430\u0441\u0442\u0430\u043b\u043e \u0432\u0440\u0435\u043c\u044f \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c \u043f\u0440\u043e\u0435\u043a\u0442. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043f\u0435\u0440\u0435\u0439\u0434\u0451\u043c \u0432 \u0444\u0430\u0439\u043b\u00a0<code>\"package.json\"<\/code>\u00a0\u0438 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0430 \u0443\u0436\u0435 \u043f\u043e\u0434\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u0435 \u0441\u043a\u0440\u0438\u043f\u0442\u044b.<\/p>\n<pre><code class=\"json\">\"scripts\": {     \"dev\": \"vuepress dev src\",     \"build\": \"vuepress build src\" }<\/code><\/pre>\n<ul>\n<li>\n<p>\u0421\u043a\u0440\u0438\u043f\u0442\u00a0<code>\"dev\"<\/code>\u00a0\u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e\u043c \u0441\u0435\u0440\u0432\u0435\u0440\u0435<\/p>\n<\/li>\n<li>\n<p>\u0421\u043a\u0440\u0438\u043f\u0442\u00a0<code>\"build\"<\/code>\u00a0\u0441\u043e\u0431\u0435\u0440\u0435\u0442 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u043b\u044f production<\/p>\n<\/li>\n<\/ul>\n<p>\u0417\u0430\u043f\u0443\u0441\u043a \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u0432 \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0447\u0435\u0440\u0435\u0437 \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b:<\/p>\n<pre><code class=\"bash\">npm run dev npm run build<\/code><\/pre>\n<p>\u041f\u0440\u0438 \u0437\u0430\u043f\u0443\u0441\u043a\u0435 \u0441\u043a\u0440\u0438\u043f\u0442\u0430\u00a0<code>\"dev\"<\/code>, \u0432 \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b\u0435 \u0431\u0443\u0434\u0435\u0442 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435 \u043e\u0431 \u0443\u0441\u043f\u0435\u0448\u043d\u043e\u0439 \u0441\u0431\u043e\u0440\u043a\u0435 \u0438 \u0430\u0434\u0440\u0435\u0441 \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0441\u0435\u0440\u0432\u0435\u0440\u0430:\u00a0<a href=\"http:\/\/localhost:8080\/\" rel=\"noopener noreferrer nofollow\">http:\/\/localhost:8080\/<\/a>.<\/p>\n<pre><code class=\"bash\">success [11:09:20] Build 257d7d finished in 4856 ms! > VuePress dev server listening at http:\/\/localhost:8080\/<\/code><\/pre>\n<p>\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0441\u0442\u0430\u0440\u0442\u043e\u0432\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u043f\u043e\u0438\u0441\u043a\u0430 \u043f\u043e \u0440\u0430\u0437\u0434\u0435\u043b\u0430\u043c, \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b &#171;Guide&#187;, \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b &#171;Config&#187; \u0438 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430.<\/p>\n<figure class=\"bordered full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u041e\u0442\u0440\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043c\u043e\u0436\u043d\u043e \u0432 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0445 \u0444\u0430\u0439\u043b\u0430\u0445:<\/p>\n<ul>\n<li>\n<p><code>\".\/src\/index.md\"<\/code>\u00a0&#8212; \u0433\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430<\/p>\n<\/li>\n<li>\n<p><code>\".\/src\/config\/README.md\"<\/code>\u00a0&#8212; \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 &#171;Config&#187;<\/p>\n<\/li>\n<li>\n<p><code>\".\/src\/guide\/README.md\"<\/code>\u00a0&#8212; \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 &#171;Guide&#187;<\/p>\n<\/li>\n<\/ul>\n<p>\u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 NPX-\u043f\u0430\u043a\u0435\u0442\u0430 \u0441 \u0433\u043e\u0442\u043e\u0432\u043e\u0439 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u043e\u0439 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0431\u044b\u0441\u0442\u0440\u043e \u0440\u0430\u0437\u0432\u0435\u0440\u043d\u0443\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0441 \u0431\u0430\u0437\u043e\u0432\u044b\u043c \u043d\u0430\u0431\u043e\u0440\u043e\u043c \u0441\u0442\u0440\u0430\u043d\u0438\u0446. \u041d\u043e \u0432\u043c\u0435\u0441\u0442\u043e \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u043e\u0432\u043e\u0434\u0438\u0442\u044c \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433 \u0438 \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u043d\u044b\u0439 \u0448\u0430\u0431\u043b\u043e\u043d \u043f\u043e\u0434 \u0441\u0435\u0431\u044f, \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u044e \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e \u0440\u0430\u0437\u0432\u0435\u0440\u043d\u0443\u0442\u044c \u043f\u0440\u043e\u0435\u043a\u0442 \u0438 \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c\u0441\u044f \u0441 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u043e\u043c VuePress.<\/p>\n<h3>\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0430 VuePress \u0441 \u043d\u0443\u043b\u044f<\/h3>\n<p>\u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043d\u043e\u0432\u044b\u0439 \u043f\u0440\u043e\u0435\u043a\u0442 \u0438 \u043e\u0442\u043a\u0440\u043e\u0435\u043c \u0435\u0433\u043e \u0432 \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b\u0435.<\/p>\n<h4>1. \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/h4>\n<pre><code class=\"bash\">npm init     # \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0441 \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u0435\u043c \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u043f\u0440\u043e\u0435\u043a\u0442\u0430 npm init -y  # \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0441 \u0434\u0435\u0444\u043e\u043b\u0442\u043d\u044b\u043c\u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u043c\u0438<\/code><\/pre>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u0444\u0430\u0439\u043b\u00a0<code>\"package.json\"<\/code>. \u041f\u0440\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0435 \u0441 \u0434\u0435\u0444\u043e\u043b\u0442\u043d\u044b\u043c\u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u043c\u0438 (<code>\"npm init -y\"<\/code>), \u0444\u0430\u0439\u043b \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<pre><code class=\"json\">{     \"name\": \"vue-press\",     \"version\": \"1.0.0\",     \"description\": \"\",     \"main\": \"index.js\",     \"scripts\": {         \"test\": \"echo \\\"Error: no test specified\\\" &amp;&amp; exit 1\"     },     \"keywords\": [],     \"author\": \"\",     \"license\": \"ISC\" }<\/code><\/pre>\n<p>\u0413\u0434\u0435\u00a0<code>\"vue-press\"<\/code>\u00a0\u0432 \u043f\u043e\u043b\u0435\u00a0<code>\"name\"<\/code>\u00a0&#8212; \u044d\u0442\u043e \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0430.<\/p>\n<h4>2. \u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 VuePress<\/h4>\n<p>\u0412\u044b\u043f\u043e\u043b\u043d\u0438\u043c \u043a\u043e\u043c\u0430\u043d\u0434\u0443 \u0432 \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b\u0435:<\/p>\n<pre><code class=\"bash\">npm i --save-dev vuepress<\/code><\/pre>\n<p>\u0412 \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u043f\u043e\u044f\u0432\u0438\u0442\u0441\u044f \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f\u00a0<code>\"node_modules\"<\/code>\u00a0\u0441 \u043f\u0430\u043a\u0435\u0442\u0430\u043c\u0438, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u043c\u0438 \u0434\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b VuePress. \u0412 \u0444\u0430\u0439\u043b\u00a0<code>\"package.json\"<\/code>\u00a0\u0434\u043e\u0431\u0430\u0432\u0438\u0442\u0441\u044f \u0441\u0435\u043a\u0446\u0438\u044f\u00a0<code>\"devDependencies\"<\/code>\u00a0\u0441 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u043c \u043f\u0430\u043a\u0435\u0442\u043e\u043c.<\/p>\n<pre><code class=\"json\">\"devDependencies\": {     \"vuepress\": \"^1.8.2\" }<\/code><\/pre>\n<p>\u0412 \u0440\u0430\u0437\u0434\u0435\u043b\u00a0<code>\"devDependencies\"<\/code>\u00a0\u043f\u043e\u043c\u0435\u0449\u0430\u044e\u0442\u0441\u044f \u043f\u0430\u043a\u0435\u0442\u044b, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0430 \u044d\u0442\u0430\u043f\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438.<\/p>\n<h4>3. \u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u0432<\/h4>\n<p>\u0421\u043a\u043e\u0440\u0440\u0435\u043a\u0442\u0438\u0440\u0443\u0435\u043c \u0441\u0435\u043a\u0446\u0438\u044e\u00a0<code>\"scripts\"<\/code>\u00a0\u0432 \u0444\u0430\u0439\u043b\u0435\u00a0<code>\"package.json\"<\/code>. \u0421\u043a\u0440\u0438\u043f\u0442\u00a0<code>\"test\"<\/code>\u00a0\u043d\u0435 \u043f\u0440\u0438\u0433\u043e\u0434\u0438\u0442\u0441\u044f &#8212; \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0435\u0433\u043e \u043c\u043e\u0436\u043d\u043e \u0443\u0434\u0430\u043b\u0438\u0442\u044c. \u0421\u043b\u0435\u0434\u0443\u044f\u00a0<a href=\"https:\/\/vuepress.vuejs.org\/guide\/getting-started.html#manual-installation\" rel=\"noopener noreferrer nofollow\">\u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438 VuePress<\/a>, \u0434\u043e\u0431\u0430\u0432\u0438\u043c 2 \u0441\u043a\u0440\u0438\u043f\u0442\u0430. \u0421\u0435\u043a\u0446\u0438\u044f\u00a0<code>\"scripts\"<\/code>\u00a0\u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n<pre><code class=\"json\">\"scripts\": {     \"start\": \"vuepress dev src\",     \"build\": \"vuepress build src\" }<\/code><\/pre>\n<ul>\n<li>\n<p>\u0421\u043a\u0440\u0438\u043f\u0442\u00a0<code>\"start\"<\/code>\u00a0\u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e\u043c \u0441\u0435\u0440\u0432\u0435\u0440\u0435<\/p>\n<\/li>\n<li>\n<p>\u0421\u043a\u0440\u0438\u043f\u0442\u00a0<code>\"build\"<\/code>\u00a0\u0441\u043e\u0431\u0435\u0440\u0435\u0442 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u043b\u044f production<\/p>\n<\/li>\n<\/ul>\n<p>\u0420\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0434\u043b\u044f \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u0432:<\/p>\n<ul>\n<li>\n<p><code>\"vuepress dev src\"<\/code>\u00a0\u0434\u043b\u044f \u0441\u043a\u0440\u0438\u043f\u0442\u0430\u00a0<code>\"start\"<\/code>, \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u00a0<code>\"vuepress\"<\/code>\u00a0\u0432 \u0440\u0435\u0436\u0438\u043c\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0438 \u0431\u0443\u0434\u0435\u0442 \u0438\u0441\u043a\u0430\u0442\u044c \u043d\u0443\u0436\u043d\u044b\u0435 \u0444\u0430\u0439\u043b\u044b \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438\u00a0<code>\"src\"<\/code><\/p>\n<\/li>\n<li>\n<p><code>\"vuepress build src\"<\/code>\u00a0\u0434\u043b\u044f \u0441\u043a\u0440\u0438\u043f\u0442\u0430\u00a0<code>\"build\"<\/code>, \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u00a0<code>\"vuepress\"<\/code>\u00a0\u0432 production-\u0440\u0435\u0436\u0438\u043c\u0435, \u0431\u0443\u0434\u0435\u0442 \u0438\u0441\u043a\u0430\u0442\u044c \u043d\u0443\u0436\u043d\u044b\u0435 \u0444\u0430\u0439\u043b\u044b \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438\u00a0<code>\"src\"<\/code>\u00a0\u0438 \u0441\u043e\u0431\u0435\u0440\u0435\u0442 \u043f\u0440\u043e\u0435\u043a\u0442 \u0434\u043b\u044f production<\/p>\n<\/li>\n<\/ul>\n<p>\u0414\u043b\u044f \u0437\u0430\u043f\u0443\u0441\u043a\u0430 \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u0432 \u0442\u0430\u043a\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c:<\/p>\n<pre><code class=\"bash\">npm run start npm run build<\/code><\/pre>\n<p>\u041d\u0430 \u0434\u0430\u043d\u043d\u043e\u043c \u044d\u0442\u0430\u043f\u0435 \u043d\u0435 \u0437\u0430\u043b\u043e\u0436\u0435\u043d\u0430 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0441\u043a\u0440\u0438\u043f\u0442\u044b \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0442\u044c\u0441\u044f \u043d\u0435 \u0431\u0443\u0434\u0443\u0442.<\/p>\n<h4>4. \u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/h4>\n<p>\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u0435\u043c \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043a\u0430\u043a \u043f\u043e\u043a\u0430\u0437\u0430\u043d\u043e \u043d\u0430 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0438:<\/p>\n<figure class=\"bordered\"><figcaption><\/figcaption><\/figure>\n<p>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438 \u0438 \u0444\u0430\u0439\u043b\u044b:<\/p>\n<ul>\n<li>\n<p><code>\".\/src\/index.md\"<\/code>\u00a0&#8212; \u0442\u043e\u0447\u043a\u0430 \u0432\u0445\u043e\u0434\u0430 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435<\/p>\n<\/li>\n<li>\n<p><code>\".\/src\/.vuepress\/\"<\/code>\u00a0&#8212; \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f \u0441 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u043c\u0438 VuePress<\/p>\n<\/li>\n<li>\n<p><code>\".\/src\/pages\"<\/code>\u00a0&#8212; \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f \u0441\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430\u043c\u0438<\/p>\n<\/li>\n<\/ul>\n<p>\u0420\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u0430\u043b\u0433\u043e\u0440\u0438\u0442\u043c \u0440\u0430\u0431\u043e\u0442\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u0435\u0433\u043e \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0443:<\/p>\n<ol>\n<li>\n<p>\u041f\u0440\u0438 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0438 \u0441\u043a\u0440\u0438\u043f\u0442\u0430\u00a0<code>\"start\": \"vuepress dev src\"<\/code>, VuePress \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u0442\u0441\u044f \u0432 \u0440\u0435\u0436\u0438\u043c\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0441 \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u0435\u043c \u0440\u0430\u0431\u043e\u0447\u0435\u0439 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438\u00a0<code>\"src\"<\/code><\/p>\n<\/li>\n<li>\n<p>\u0412\u00a0<code>\"src\"<\/code>\u00a0\u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0442\u043e\u0447\u043a\u0430 \u0432\u0445\u043e\u0434\u0430 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435: \u0444\u0430\u0439\u043b\u00a0<code>\"index.md\"<\/code>, \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u0440\u0435\u043d\u0434\u0435\u0440\u0438\u0442\u0441\u044f \u043d\u0430 \u0433\u043b\u0430\u0432\u043d\u0443\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443<\/p>\n<\/li>\n<li>\n<p>VuePress \u0438\u0449\u0435\u0442 \u0432\u00a0<code>\"src\"<\/code>\u00a0\u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e\u00a0<code>\".vuepress\"<\/code>\u00a0\u0434\u043b\u044f \u0447\u0442\u0435\u043d\u0438\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a (\u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f \u0434\u043e\u043b\u0436\u043d\u0430 \u043d\u0430\u0437\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u0438\u043c\u0435\u043d\u043d\u043e \u0442\u0430\u043a)<\/p>\n<\/li>\n<li>\n<p>\u0412 \u0444\u0430\u0439\u043b\u0435\u00a0<code>\".\/src\/.vuepress\/config.js\"<\/code>\u00a0\u043d\u0430\u0445\u043e\u0434\u044f\u0442\u0441\u044f \u0432\u0441\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043f\u043e \u0440\u0430\u0431\u043e\u0442\u0435 VuePress. \u041f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0441\u043e\u043f\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u0440\u043e\u0443\u0442\u043e\u0432: \u0437\u0434\u0435\u0441\u044c \u043c\u044b \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c, \u0447\u0442\u043e \u0438\u043c\u0435\u043d\u043d\u043e \u0432\u00a0<code>\"pages\"<\/code>\u00a0\u0445\u0440\u0430\u043d\u044f\u0442\u0441\u044f \u0432\u0441\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/p>\n<\/li>\n<li>\n<p>\u0414\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f\u00a0<code>\"pages\"<\/code>\u00a0\u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0432\u0441\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u0412 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u0438\u0445 \u0432\u0441\u0435\u0433\u043e \u0434\u0432\u0435: \u0441 \u0442\u0435\u043c\u0430\u043c\u0438 \u043f\u043e React.js (\u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f\u00a0<code>\"react\"<\/code>) \u0438 \u043f\u043e Vue.js (\u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f\u00a0<code>\"vue\"<\/code>). \u0421\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0431\u044b\u043b\u0438 \u043f\u0440\u0438\u0434\u0443\u043c\u0430\u043d\u044b \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u043e<\/p>\n<\/li>\n<li>\n<p>\u0414\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b (\u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044f\u00a0<code>\"pages\"<\/code>) \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0444\u0430\u0439\u043b\u00a0<code>\"README.md\"<\/code>. \u041e\u043d \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u0443\u044e\u00a0<code>\".\/src\/index.md\"<\/code>. \u041a\u0440\u043e\u043c\u0435 \u044d\u0442\u043e\u0433\u043e, \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d \u0444\u0430\u0439\u043b\u044b\u00a0<code>\"info.md\"<\/code>\u00a0\u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0439 \u0442\u0435\u043c\u044b &#8212; \u044d\u0442\u043e \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u043b\u044c\u043d\u044b\u0435 \u043e\u043f\u0438\u0441\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/p>\n<\/li>\n<\/ol>\n<h4>5. Markdown-\u0444\u0430\u0439\u043b\u044b<\/h4>\n<p>\u0418\u0437 \u0444\u0430\u0439\u043b\u043e\u0432 \u0441 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435\u043c\u00a0<code>\".md\"<\/code>, \u043a\u043e\u0434 \u043a\u043e\u043c\u043f\u0438\u043b\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0432 HTML-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b.<\/p>\n<p>\u041a\u043e\u0434 \u0432 \u0444\u0430\u0439\u043b\u0430\u0445\u00a0<code>\".md\"<\/code>\u00a0\u043c\u043e\u0436\u043d\u043e \u043f\u0438\u0441\u0430\u0442\u044c:<\/p>\n<ul>\n<li>\n<p>\u041d\u0430 \u044f\u0437\u044b\u043a\u0435 Markdown<\/p>\n<\/li>\n<li>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f YAML Front Matter<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430 \u0447\u0438\u0441\u0442\u043e\u043c HTML<\/p>\n<\/li>\n<\/ul>\n<p>\u0412 \u0441\u0442\u0430\u0442\u044c\u0435 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c Markdown, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0449\u0438\u0439 \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u0431\u044b\u0441\u0442\u0440\u043e \u0440\u0430\u0437\u043c\u0435\u0442\u0438\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043d\u0442.<\/p>\n<p>\u041e\u0442\u043a\u0440\u043e\u0435\u043c \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0444\u0430\u0439\u043b\u044b\u00a0<code>\".md\"<\/code>\u00a0\u0438 \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043d\u0442. \u0421\u0438\u043c\u0432\u043e\u043b\u00a0<code>\"#\"<\/code>\u00a0\u0432 Markdown \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a \u043f\u0435\u0440\u0432\u043e\u0433\u043e \u0443\u0440\u043e\u0432\u043d\u044f.<\/p>\n<ul>\n<li>\n<p>.\/src\/index.md<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"markdown\"># \u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/code><\/pre>\n<ul>\n<li>\n<p>.\/src\/pages\/react\/README.md<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"markdown\"># \u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0441\u043f\u0440\u0430\u0432\u043e\u0447\u043d\u0438\u043a\u0430 \u043f\u043e React.js<\/code><\/pre>\n<ul>\n<li>\n<p>.\/src\/pages\/react\/info.md<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"markdown\"># \u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430 React.js<\/code><\/pre>\n<ul>\n<li>\n<p>.\/src\/pages\/vue\/README.md<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"markdown\"># \u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0441\u043f\u0440\u0430\u0432\u043e\u0447\u043d\u0438\u043a\u0430 \u043f\u043e Vue.js<\/code><\/pre>\n<ul>\n<li>\n<p>.\/src\/pages\/vue\/info.md<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"markdown\"># \u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430 Vue.js<\/code><\/pre>\n<h4>6. \u0424\u0430\u0439\u043b config.js<\/h4>\n<p>\u041e\u0441\u0442\u0430\u043b\u043e\u0441\u044c \u0443\u043a\u0430\u0437\u0430\u0442\u044c, \u0447\u0442\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0431\u0440\u0430\u0442\u044c \u0438\u0437 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438\u00a0<code>\"pages\"<\/code>.<\/p>\n<p>\u0411\u0430\u0437\u043e\u0432\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0438\u00a0<code>\".\/src\/.vuepress\/config.js\"<\/code>:<\/p>\n<pre><code class=\"javascript\">module.exports = {     themeConfig: {         \/\/ \u0421\u0441\u044b\u043b\u043a\u0438 \u043d\u0430 \u0440\u0430\u0437\u0434\u0435\u043b\u044b         nav: [             {                 text: '\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0440\u0430\u0437\u0434\u0435\u043b\u0430',                 link: '\u041f\u0443\u0442\u044c \u043a \u0440\u0430\u0437\u0434\u0435\u043b\u0443'             },         ],         \/\/ \u0421\u0441\u044b\u043b\u043a\u0438 \u0432\u043d\u0443\u0442\u0440\u0438 \u0440\u0430\u0437\u0434\u0435\u043b\u0430         sidebar: {             '\u041f\u0443\u0442\u044c \u043a \u0440\u0430\u0437\u0434\u0435\u043b\u0443': [                 {                     title: '\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u043f\u043e\u0434\u0440\u0430\u0437\u0434\u0435\u043b\u0430',  \/\/                      children: [                         ['\u041f\u0443\u0442\u044c \u043a \u0442\u0435\u043c\u0435', '\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0442\u0435\u043c\u044b'],                             ]                 }             ]         }     }, }<\/code><\/pre>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0438\u043c\u043f\u043e\u0440\u0442\u0430 \u0438 \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f CommonJS (\u043c\u043e\u0434\u0443\u043b\u044c\u043d\u0430\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u0430 Node.js), \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c\u00a0<code>\"module.exports\"<\/code>.<\/p>\n<p>\u041f\u0440\u043e\u0432\u0435\u0434\u0451\u043c \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u044e \u0438 \u0432\u044b\u043d\u0435\u0441\u0435\u043c \u0432 \u043a\u043e\u043d\u0441\u0442\u0430\u043d\u0442\u044b \u0440\u043e\u0443\u0442\u044b (\u0432 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u044d\u0442\u043e\u00a0<code>\"nav\"<\/code>\u00a0\u0438\u00a0<code>\"sidebar\"<\/code>).<\/p>\n<pre><code class=\"javascript\">\/\/ \u041a\u043e\u043d\u0441\u0442\u0430\u043d\u0442\u044b \u0441 \u0440\u043e\u0443\u0442\u0430\u043c\u0438 \u043a \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430\u043c const PAGE_VUE = '\/pages\/vue\/'; const PAGE_REACT = '\/pages\/react\/';  \/\/ \u0421\u0441\u044b\u043b\u043a\u0438 \u043d\u0430 \u0440\u0430\u0437\u0434\u0435\u043b\u044b const NAV = [     {         text: 'Vue.js',         link: PAGE_VUE     },     {         text: 'React.js',         link: PAGE_REACT     }, ]; \/\/ \u0421\u0441\u044b\u043b\u043a\u0438 \u0432\u043d\u0443\u0442\u0440\u0438 \u0440\u0430\u0437\u0434\u0435\u043b\u0430 const SIDEBAR = {     [PAGE_VUE]: [         {             title: '\u0418\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f',             children: [                 ['info', 'Vue.js'],             ]         }     ],     [PAGE_REACT]: [         {             title: '\u0418\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f',             children: [                 ['info', 'React.js'],             ]         }     ] }; module.exports = {     themeConfig: {         nav: NAV,         sidebar: SIDEBAR     }, }<\/code><\/pre>\n<h4>7. \u0417\u0430\u043f\u0443\u0441\u043a \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/h4>\n<p>\u0417\u0430\u043f\u0443\u0441\u0442\u0438\u043c \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b \u0438\u0437 \u0440\u0430\u0431\u043e\u0447\u0435\u0439 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438 \u0438 \u0432\u044b\u043f\u043e\u043b\u043d\u0438\u043c \u0441\u043a\u0440\u0438\u043f\u0442:<\/p>\n<pre><code class=\"bash\">npm run start<\/code><\/pre>\n<p>\u041f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u043f\u043e \u0430\u0434\u0440\u0435\u0441\u0443:\u00a0<a href=\"http:\/\/localhost:8080\/\" rel=\"noopener noreferrer nofollow\">http:\/\/localhost:8080\/<\/a>.<\/p>\n<p>\u041d\u0430 \u0433\u043b\u0430\u0432\u043d\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0432\u0438\u0434\u0438\u043c \u0442\u0435\u043a\u0441\u0442 \u0438\u0437\u00a0<code>\".\/src\/index.md\"<\/code>. \u0412 \u043c\u0435\u043d\u044e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u044e\u0442\u0441\u044f \u0434\u0432\u0435 \u0441\u0441\u044b\u043b\u043a\u0438: &#171;Vue.js&#187; \u0438 &#171;React.js&#187;.<\/p>\n<figure class=\"bordered full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u041f\u0435\u0440\u0435\u0439\u0434\u0435\u043c \u043d\u0430 \u0432\u043a\u043b\u0430\u0434\u043a\u0443 &#171;Vue.js&#187;. URL \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u0441\u044f \u043d\u0430\u00a0<a href=\"http:\/\/localhost:8080\/pages\/vue\/\" rel=\"noopener noreferrer nofollow\">http:\/\/localhost:8080\/pages\/vue\/<\/a>. \u041d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0432\u0438\u0434\u0438\u043c \u0442\u0435\u043a\u0441\u0442 \u0438\u0437\u00a0<code>\".\/src\/pages\/vue\/README.md\"<\/code>.<\/p>\n<figure class=\"bordered full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0412 \u0441\u0430\u0439\u0434\u0431\u0430\u0440\u0435 \u0432 \u0440\u0430\u0437\u0434\u0435\u043b\u0435 &#171;\u0418\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f&#187; \u0432\u044b\u0431\u0435\u0440\u0435\u043c &#171;Vue.js&#187;. URL \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u0441\u044f \u043d\u0430\u00a0<a href=\"http:\/\/localhost:8080\/pages\/vue\/info.html\" rel=\"noopener noreferrer nofollow\">http:\/\/localhost:8080\/pages\/vue\/info.html<\/a>. \u041d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0432\u0438\u0434\u0438\u043c \u0442\u0435\u043a\u0441\u0442 \u0438\u0437\u00a0<code>\".\/src\/pages\/vue\/info.md\"<\/code>.<\/p>\n<figure class=\"bordered full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u041f\u043e\u0437\u0434\u0440\u0430\u0432\u043b\u044f\u044e! \u041c\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u043b\u0438 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 VuePress. \u0422\u0435\u043f\u0435\u0440\u044c \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0430 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b.  <\/p>\n<h4>8. \u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439<\/h4>\n<p>\u0414\u043e\u0431\u0430\u0432\u0438\u043c \u043d\u043e\u0432\u0443\u044e \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e\u00a0<code>\"img\"<\/code>\u00a0\u0432\u00a0<code>\".\/src\/pages\/vue\"<\/code>\u00a0(\u043f\u043e \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0438 \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0438 \u0434\u043b\u044f\u00a0<code>\".\/src\/pages\/react\"<\/code>). \u041f\u043e\u043c\u0435\u0441\u0442\u0438\u043c \u0432\u00a0<code>\"img\"<\/code>\u00a0\u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435\u00a0<code>\"vue-logo.jpg\"<\/code>.<\/p>\n<figure class=\"bordered\"><figcaption><\/figcaption><\/figure>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u0438\u0437 \u0444\u0430\u0439\u043b\u0430\u00a0<code>\".\/src\/pages\/vue\/info.md\"<\/code>\u00a0\u043c\u043e\u0436\u043d\u043e \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044e.<\/p>\n<pre><code class=\"markdown\">&lt;!-- Markdown-\u0444\u043e\u0440\u043c\u0430\u0442 --> ![Alt for Image](.\/img\/vue-logo.jpg)<\/code><\/pre>\n<pre><code class=\"xml\">&lt;!-- HTML-\u0444\u043e\u0440\u043c\u0430\u0442 --> &lt;img src=\".\/img\/vue-logo.jpg\" width=\"200px\" alt=\"Alt for Image\" \/><\/code><\/pre>\n<p>\u041f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 HTML-\u0444\u043e\u0440\u043c\u0430\u0442\u0430 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u0448\u0438\u0440\u0438\u043d\u0443 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f, \u0447\u0442\u043e \u0432\u043e \u043c\u043d\u043e\u0433\u0438\u0445 \u0441\u0438\u0442\u0443\u0430\u0446\u0438\u044f\u0445, \u0431\u0443\u0434\u0435\u0442 \u0443\u0434\u043e\u0431\u043d\u0435\u0435 \u0440\u0430\u0437\u043c\u0435\u0442\u043a\u0438 Markdown.<\/p>\n<p>\u0414\u043b\u044f \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439 \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u0434\u0430\u0432\u0430\u0442\u044c \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0443\u0442\u044c, \u043d\u043e \u0438 \u0430\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u044b\u0435. \u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0434\u043e\u043b\u0436\u043d\u044b \u0431\u044b\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u0440\u0430\u043c\u043a\u0430\u0445 \u043e\u0434\u043d\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, \u0430 \u0432\u043e \u0432\u0441\u0451\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438. \u0422\u0430\u043a\u0438\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u0432\u00a0<code>\".\/src\/.vuepress\/public\"<\/code>. \u041e\u0431\u0440\u0430\u0442\u0438\u0442\u044c\u0441\u044f \u043a \u043d\u0438\u043c \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e, \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u044f\u00a0<code>\"\/\"<\/code>\u00a0\u0438\u043b\u0438 \u0447\u0435\u0440\u0435\u0437 Vue-\u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0443\u044e\u00a0<code>\"$withBase\"<\/code>.<\/p>\n<pre><code class=\"xml\">&lt;!-- \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043f\u0443\u0442\u0438 \"\/\" --> &lt;img src=\"\/vue-logo.jpg\" alt=\"Alt for Image\" \/>  &lt;!-- \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 Vue-\u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 --> &lt;img<\/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-393637","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/393637","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=393637"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/393637\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=393637"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=393637"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=393637"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}