vue-cli – это консольная утилита для создания каркаса приложения vue.js на основе одного из имеющихся шаблонов.
Она автоматизирует для нас
- процессы настройки системы сборки
- подключение библиотек
У vue-cli имеется ряд готовых шаблонов, на основе которых можно создать приложение:
- webpack – Полный набор на базе Webpack (с vue-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 поддерживает горячую перезагрузку, то при изменении какого-либо файла страница в браузере будет перезагружаться чтобы отобразить изменения.
Полезные ссылки: