Установка Astro с помощью CLI

Готовы установить Astro? Следуйте нашим инструкциям по автоматической или ручной установке.

Требования

• Node.js - v18.14.1 или выше.
• Текстовый редактор - Мы рекомендуем VS Code с нашим Официальным расширением для Astro.
• Терминал - Для работы с Astro через command-line interface (CLI).

Автоматический CLI Ручная настройка

Установка

Самый быстрый способ начать работу с новым Astro проектом это create-astro. Он проведет вас через каждый шаг в настройке вашего Astro проекта. Это позволит вам выбрать из нескольких готовых шаблонов или указать свой, используя аргумент --template.

Онлайн предпросмотр

Хотели бы попробовать Astro в вашем браузере? Посетите astro.new, чтобы посмотреть наши готовые шаблоны и запустить новый Astro проект не покидая ваш браузер.

1. Запуск установщика

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

npm

# создать новый проект через npm
npm create astro@latest

pnpm

# создать новый проект через pnpm
pnpm create astro@latest

Yarn

# создать новый проект через yarn
yarn create astro

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

Если все пройдет хорошо, вы должны увидеть сообщение “Ready for liftoff!”, за которым последуют рекомендуемые “Следующие шаги”. Через cd перейдите в новую директорию вашего проекта, чтобы начать использовать Astro.

Если вы пропустили шаг npm install, во время выполнения create-astro, убедитесь что установили зависимости, перед тем как продолжить.

2. Запускаем Astro ✨

Astro идет со встроенным сервером для разработки, который имеет все, что вам необходимо для разработки проекта. Команда astro dev запустит локальный сервер для разработки, что позволит увидеть ваш новый сайт в действии в самый первый раз.

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

npm

npm run dev

pnpm

pnpm run dev

Yarn

yarn run dev

Если все пройдет хорошо, Astro будет использовать http://localhost:4321/ для вашего проекта!

Astro будет следить за изменениями файлов в вашей директории src/, так что, вам не нужно перезапускать сервер после внесения изменений во время разработки.

Если вы не можете открыть свой проект в браузере, вернитесь к терминалу, где вы запустили команду dev, и посмотрите, произошла ли ошибка или ваш проект обслуживается по другому URL, чем тот, на который ссылались выше.

Следующие шаги

Успех! Теперь вы готовы начать разрабатывать с Astro! 🥳

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

📚 Добавление фреймворка: Изучите как в Astro использовать React, Svelte, Tailwind и других, используя npx astro add, в Руководстве по интеграции.

📚 Деплой вашего сайта: Изучите как собирать и деплоить ваш Astro проект, в Руководстве по деплою.

📚 Изучение кодовой базы: Узнайте больше про структуру Astro проектов, в Руководстве по структуре проекта.