Установите Vue.js на подсистему Windows для Linux

Руководство по настройке среды разработки Vue.js в подсистеме Windows для Linux (WSL). Общие сведения см. в Vue.js обзоре.

Vue можно установить непосредственно в Windows или WSL. WSL рекомендуется, если вы планируете взаимодействовать с серверной частью Node.js, развертывать на серверах Linux или следовать руководствам, используюющим команды Bash.

Предпосылки

• Установите подсистему Windows для Linux (WSL), включая дистрибутив Linux (например, Ubuntu), работающий в режиме WSL 2. Проверьте с помощью: wsl -l -v
• Установите Node.js в WSL 2: Это включает менеджер версий, менеджер пакетов, Visual Studio Code и Расширение удаленной разработки.

Это важно

Сохраните файлы проекта в файловой системе WSL (например, ~/projects), а не на подключенном диске Windows (/mnt/c/). Работа по границе файловой системы значительно замедляет установку и время сборки.

Создание проекта Vue

Рекомендуемый способ начать новый проект Vue 3 — это npm create vue@latest, который использует create-vue — официальный инструмент генерации проектов на основе Vite.

1. Откройте терминал WSL (например, Ubuntu).

2. Перейдите в каталог проектов:

   mkdir -p ~/projects
   cd ~/projects
   

3. Создайте проект Vue:

   npm create vue@latest
   

   Установщик предложит присвоить проекту имя и выбрать дополнительные функции (TypeScript, поддержка JSX, маршрутизатор Vue, управление состояниями Pinia, Vitest, ESLint).

4. Перейдите в папку проекта, установите зависимости и запустите сервер разработки:

   cd <your-project-name>
   npm install
   npm run dev
   

   Ваше приложение будет доступно по адресу http://localhost:5173.

Дополнительные ресурсы

• документация по Vue
• Vue.js обзор
• Установка Vue.js в Windows
• Выполните первые шаги с Vue.js схемой обучения
• Руководство по Vue с VS Code