Пошаговое руководство по развертыванию статического приложения Nuxt.js в Netlify
В этой статье мы рассмотрим, как можно развернуть статическое приложение NuxtJs в Netlify.
Netlify - это хостинговый веб-сайт, который предоставляет бесплатный хостинг и более быстрый способ создания и развертывания сайтов на лету.
Мы будем развертывать наше приложение прямо из репозитория GitHub.
Netlify очень удобен тем, что после внесения изменений в наше приложение и отправки кода на GitHub мы получаем обновленную версию нашего приложения.
Перво-наперво нам нужно создать репозиторий GitHub нашего приложения, которое мы будем развертывать в Netlify.
После создания репозитория нам необходимо авторизоваться на сайте Netlify и привязать нашу учетную запись GitHub.
Если у вас нет учетной записи Netlify, вы можете зарегистрироваться и создать учетную запись. После этого вы войдете в систему, и вам будет предложено связать вашу учетную запись GitHub, GitLab или Bitbucket, если она у вас есть.
После привязки вашей учетной записи GitHub к Netlify нажмите кнопку «Новый сайт» с помощью кнопки Git - это предоставит вам экран для выбора репозитория GitHub с вашим приложением NuxtJs.
Теперь Netlify направит нас на второй экран, где мы выберем наш репозиторий, содержащий файлы приложения NuxtJs.
Выберите репозиторий приложений Nuxtjs и щелкните по нему.
После выбора вашего репозитория на последнем шаге Netlify предложит вам перейти к следующему шагу, где будет находиться корень ваших файлов приложения Nuxt или ветка (основная или главная), в зависимости от вашей конфигурации GIT.
В команде сборки для нашего статического приложения Nuxtjs мы используем команду
npm run generate
в каталоге публикации нам нужно указать папку dist, чтобы Nuxt обслуживал эту конкретную папку и сгенерировал там все содержимое нашего приложения.
После этого нажмите кнопку развертывания сайта и дождитесь, пока Netlify сгенерирует и соберет наше приложение.
Nuxtjs выполнит команды и сгенерирует наше приложение, вы увидите окно с приведенной выше информацией, касающейся процедуры и процесса сборки вашего приложения.
После запуска всего этого Netlify предоставит вам еще один экран для предварительного просмотра созданного и развернутого сайта.
Нажмите на предварительный просмотр, чтобы ознакомиться с вашим приложением.
Заключение
Это было простое руководство по развертыванию статического приложения Nuxtjs.
Просто напомним, что мы видели;
- Как связать свою учетную запись GitHub с Netlify.
- Разверните статическое приложение Nuxtjs с помощью Netlify.
Если вы нашли эту статью помощи, не стесняйтесь поделиться ею.
Вы также можете проверить мой профиль здесь на наличие некоторых статей в блоге.