vue-cli

vue-cli — это консольная утилита для создания каркаса приложения vue.js на основе одного из имеющихся шаблонов.

Она автоматизирует для нас

  • процессы настройки системы сборки
  • подключение библиотек

У vue-cli имеется ряд готовых шаблонов, на основе которых можно создать приложение:

  • webpack — Полный набор на базе Webpackvue-loader, горячей перезагрузкой страницы, линтингом и тестами)
  • webpack-simple — Упрощенный набор на базе Webpack и vue-loader
  • browserify — Полный набор на базе Browserify
  • browserify-simple — Упрощенный на базе Browserify и vueify
  • pwa — Шаблон для PWA на базе шаблона webpack
  • simple — На базе обычного html-файла с подключенными в него собранными js-файлами (без системы сборки)

Также можно создать собсвенный шаблон со своими файлами и библиотеками.

Что нужно чтобы создать и запустить приложение с помощью vue-cli?

Порядок действий примерно такой:

# Устанавливаем глобально npm пакет
npm install -g vue-cli
# Создание проект в директории folder-name на базе шаблона webpack
vue init webpack folder-name
# После этого в консоли будет задан ряд вопросов (имя приложения и т.п.)
# Переходим в папку с проектом и запускаем установку всех модулей
cd folder-name
npm install
# Запускаем сборку
npm run dev

После запуска npm run dev в консоли отобразится URL для открытия в  браузере. Так как шаблон webpack поддерживает горячую перезагрузку, то при изменении какого-либо файла страница в браузере будет перезагружаться чтобы отобразить изменения.

Полезные ссылки:

Leave a Reply

Ваш адрес email не будет опубликован. Обязательные поля помечены *