Фото Билла Джелен на Unsplash
Введение
Vuejs - это прогрессивный Javascript-фреймворк для создания реактивных и легко масштабируемых веб-сайтов.
Netlify - это быстрая статическая платформа веб-хостинга, которая автоматически повторно развертывает ваш сайт, когда вы отправляете его в репозиторий git.
Предпосылки
Убедитесь, что у вас есть следующее:
- НПМ
- Vue CLI
- GitHub аккаунт т
- Счет Netlify
- GitHub CLI (необязательно)
Давайте развернемся!
Создайте новый проект Vue с помощью Vue CLI и перейдите в его каталог
vue create vuejs-netlify cd vuejs-netlify
Создайте удаленное репо с помощью GitHub CLI
gh repo create — public vuejs-netlify
Кроме того, вы можете создать его на сайте GitHub, перейдя по ссылке https://github.com/new.
Git push на удаленное репо
git push -u origin master
Войдите в свою учетную запись Netlify
Нажмите Новый сайт из Git.
Подключитесь к Git Provider. В этом случае GitHub
Выберите репозиторий vuejs-netlify
Ветвь master - это ветвь по умолчанию для развертывания. Однако вы можете развернуть из любой другой ветки
Добавьте yarn build или npm run build в качестве команды сборки. Выполнение любой из команд приведет к созданию папки dist, в которой скомпилирован весь код.
Поэтому добавьте dist в качестве каталога публикации.
Разверните веб-сайт, нажав Развернуть сайт.
Подождите, пока веб-сайт будет развернут. Это не займет много времени, поскольку Netlify - это быстрая статическая платформа для веб-хостинга.
Откройте автоматически сгенерированный URL-адрес веб-сайта
Вы сделали это! Вы развернули свое приложение Vuejs! 🎊🎊🎊
Нашли опечатку? Хотите внести свой вклад? Вот исходный код
Следуйте за мной в Twitter, чтобы получать новости из блога и отличный контент для веб-разработки.