Учебник VuePress

# Сборка проекта

Эти руководства основаны на нескольких условиях:

  • Вы располагаете вашу документацию внутри каталога docs вашего проекта;
  • Вы используете местоположение по умолчанию для итоговой сборки (.vuepress/dist);
  • VuePress установлен глобально.

Перед тем как размещать проект в интернет его необходимо собрать, т.е. преобразовать файлы разработки в статический сайт состоящий из html файлов.

Для сборки проекта, находясь в основной папке (в нашем примере это first_progect) напечатайте команду vuepress build docs:

D:\first_project>vuepress build docs
1

В результате сборки должны увидеть следующее:

√ Client
  Compiled successfully in 18.89s

√ Server
  Compiled successfully in 14.01s

wait Rendering static HTML...
success Generated static files in docs\.vuepress\dist.
1
2
3
4
5
6
7
8

После нажатия клавиши "Enter" и окончании сборки проекта, появиться папка .vuepress/dist/ внутри которой и разместиться собранный проект для сборки.

Пример проекта

first_project           // основная папка проекта
└─ docs                 // папка для содержимого vuepress
   ├─ .vuepress         // служебная папка
   │   └─ public        // папка для картинок, используемых на главной странице
   │       └─ hero.png  // пример картинки
   └─ READRME.md        // Markdown-файл из которого формируется главная страница
1
2
3
4
5
6

После выполнения команды будет иметь вид:





 
 
 
 
 
 
 




first_project
└─ docs
   ├─ .vuepress
   │   ├─ dist                      // служебная папка для хранения сборки проекта
   │   │   ├─ assets                // папка для хранения файлов проекта
   │   │   │   ├─ css               // папка для хранения стилей проекта
   │   │   │   ├─ img               // папка куда переносятся все картинки проекта
   │   │   │   │   └─ hero.png      // пример картинки
   │   │   │   └─ js                // папка с программным js кодом
   │   │   ├─ 404.html              // страница ошибки
   │   │   └─ index.html            // главная страница
   │   └─ public
   │       └─ hero.png
   └─ READRME.md
1
2
3
4
5
6
7
8
9
10
11
12
13
14

Содержимое папки dist: строки с 5 по 11 выносятся на публикацию в интернете.

ПРИМЕЧАНИЕ

Это лишь короткий пример собранного сайта. Настоящие проекты имеют более развитую и сложную структур файлов и папок, но сути это не меняет: на публикацию передается все содержимое папки .vuepress/dist/.

← Firebase Hosting →