Документация не веселая, если она не публика. Теперь, настроив библиотеку компонентов для использования Vuepress для документации и маркетинга, нам нужно ее развернуть. NetLify Для этого отличный выбор! Документация Vuepress отлично справляется с документированием Параметры развертывания Анкет Мы будем использовать NetLify для этого примера.
Развернуть на NetLify
После последнего поста структура плагина библиотеки компонентов должна быть похожа на структуру ниже. Если вы изменили некоторые соглашения об именах, это нормально.
. └─ docs/ ├── .vuepress/ │ ├─ components/ │ │ ├─ examples/ │ │ │ └─ standard-component-doc.vue │ │ ├─ Demo.vue │ │ └─ SourceCode.vue │ ├─ config.js │ └─ enhanceApp.js ├─ components/ │ ├─ README.md │ └─ standard-component.md ├─ guide.md └─ README.md
Вы можете связать свою учетную запись с правильным публичным репо и создать сайт на проекте толкать . Это работает очень хорошо, если вы используете GitHub, Gitlab и т. Д.
В зависимости от вашего рабочего процесса, триггеры сборки могут быть настроены, если необходимо изменить общую настройку.
Идеальный. Сайт документации не живет по URL -адресу, назначенному NetLify. 🍸
https://vue-component-library-template.netlify.app/
Настройте пользовательский домен
Что, если пользовательский домен лучше соответствует этому проекту? Давайте добавим это.
Создать _redirects Файл .vuepress/public Для NetLify забрать во время процесса развертывания. Любые файлы, размещенные в Публичный каталог скопированы в корень сгенерированного каталога при построении.
. └─ docs/ ├── .vuepress/ │ ├─ components/ │ │ ├─ examples/ │ │ │ └─ standard-component-doc.vue │ │ ├─ Demo.vue │ │ └─ SourceCode.vue │ ├─ config.js │ └─ enhanceApp.js ├─ components/ │ ├─ README.md │ └─ standard-component.md + ├─ public/ + │ └─ _redirects ├─ guide.md └─ README.md
Информация о перенаправлении доступна после того, как сайт будет развернут и настроен с помощью пользовательского домена. Возьмите эту конфигурацию и добавьте ее в новый _redirects файл. Информация в Управление доменом Раздел в консоли NetLify.
Пример ниже иллюстрирует сайт, на котором HTTPS включен через NetLify. Обратите внимание на https:// Анкет
# Redirect default Netlify subdomain to primary domain https://.netlify.com/* https://www. /:splat 301!
Перенаправление вступит в силу на следующем git push в репо.
Дополнительные варианты, предоставленные NetLify
- Инъекция фрагмента
- Оптимизация активов
- Презринг
- Развертывание уведомлений
Дополнительные соображения для Vuepress
- Sitemap (помогает при настройке инструментов Google Webmaster)
- Теги OpenGraph с передним веществом
Следующие шаги
Публикуйте в NPM!
Оригинал: “https://dev.to/siegerts/creating-a-vue-js-component-library-part-v-deploying-documentation-to-netlify-4263”