Введение.

Если вы новичок во фронтенд-разработке и ищете инструменты, которые помогут вам стать более продуктивным, я покажу вам, как развернуть ваши фронтенд-приложения с помощью Surge.

Единственная проблема, связанная с интерфейсными фреймворками, — это возможность работать с ними, поскольку к ним обычно привязано очень много конфигураций.

В этом руководстве я покажу вам, как развернуть ваше приложение Vue js с помощью инструмента сборки Surge.

Что такое Vue JS?

Vue js — это фреймворк для одностраничных приложений, который позволяет разработчикам интерфейса быстро разрабатывать работающие веб-приложения.

Vue js был создан бывшим разработчиком Google Эваном Ю, и с тех пор он стал достаточно популярным, чтобы стоять рядом с установленными интерфейсными фреймворками, такими как React Js, Angular JS.

Что такое всплеск.

Surge — это инструмент сборки CLI, который позволяет быстро разместить ваше внешнее приложение, он работает с такими внешними инструментами, как Vue Js, Angular JS, статически созданным проектом HTML, CSS и Javascript и даже с React Js.

Как начать работу с Surge.

Surge — это полный инструмент командной строки, поэтому вам не нужно беспокоиться о каком-либо взаимодействии с размещенным веб-сайтом, и это одна из причин, по которой я предпочитаю его Netlify и другим инструментам сборки JS.

Начать работу с Surge очень просто, все, что вам когда-либо понадобится.

1. ПК (Windows, Mac, Ubuntu).

2. Установка Node.js.

3. Активный или новый проект Vue js.

Развертывание нашего проекта для Surge.

Нам нужно настроить всплеск таким образом, чтобы он идентифицировал наш проект и развертывал его, когда мы захотим. Помните, что всплеск — это полноценный инструмент командной строки, и вам не нужно взаимодействовать с веб-интерфейсом пользователя.

1. Установите Surge CLI глобально в вашей системе.

В зависимости от того, какую операционную систему вы используете, вам будет предложено установить на ваш компьютер скрипты всплеска по всему миру.

2. Настройте свой идентификатор, адрес электронной почты и пароль.

при первой установке Surge вам будет предложено настроить идентификатор с действительным адресом электронной почты и паролем.

Мне пришлось пропустить этот шаг, потому что я настроил всплеск в своей локальной системе.

3. Развернуть.

Заключительный этап включает в себя небольшую настройку, пока не радуйтесь, ваш проект еще не запущен, у вас еще есть кое-какие домашние дела.

Теперь, находясь в корневом каталоге вашего проекта,

  1. запустить npm запустить сборку.

2. перейдите в папку dist, запустив cd dist.

3. Переименуйте index.html в 200.html.

3. Запустите команду выброса.

4. Выберите имя субдомена, Surge предоставит вам субдомен по умолчанию, но вы можете изменить его, но убедитесь, что вы включили в него Surg.sh, и на этом все, ваш проект запущен.

5. Каждый раз, когда вы вносите какие-либо изменения, повторяйте здесь шаги с 1 по 4, но убедитесь, что при вводе субдомена вы выбрали ранее выбранное имя субдомена.

Вывод.

Имея очень малолетний опыт работы с одностраничными приложениями, мне было очень трудно запускать их в работу каждый раз, когда я заканчивал разработку своих приложений локально на своем компьютере.

Surge.sh помог мне очень быстро сделать многое с моим интерфейсным проектом, попробуйте Surge прямо сейчас.