Установка Astro с помощью CLI
Готовы установить Astro? Следуйте этому руководству по использованию create astro CLI для начала работы.
Необходимые условия
Заголовок раздела Необходимые условия- Node.js —
v18.17.1илиv20.3.0или выше. (v19не поддерживается.) - Текстовый редактор — мы рекомендуем VS Code с нашим официальным расширением Astro.
- Терминал — доступ к Astro осуществляется через интерфейс командной строки (CLI).
Установка
Заголовок раздела Установкаcreate astro — это самый быстрый способ начать новый проект Astro с нуля. Он проведет вас через все этапы создания нового проекта Astro. Он позволяет вам выбрать один из нескольких официальных шаблонов, или вы можете использовать любой существующий проект на GitHub с аргументом --template.
1. Запустите мастер настройки
Заголовок раздела 1. Запустите мастер настройкиВыполните следующую команду в терминале, чтобы запустить наш удобный мастер установки:
# создайте новый проект с помощью npmnpm create astro@latest# создайте новый проект с помощью pnpmpnpm create astro@latest# создайте новый проект с помощью yarnyarn create astroВы можете запустить create astro в любом месте на вашей машине, поэтому нет необходимости создавать новую пустую директорию для вашего проекта перед началом работы. Если у вас еще нет пустой директории для нового проекта, мастер поможет создать ее автоматически.
Если все прошло успешно, вы должны увидеть сообщение “Liftoff confirmed. Explore your project!”, за которым последуют некоторые рекомендуемые дальнейшие шаги. Перейдите в директорию вашего нового проекта, чтобы начать использовать Astro.
Если вы пропустили шаг npm install, во время выполнения create-astro, убедитесь что установили зависимости, перед тем как продолжить.
2. Запускаем Astro ✨
Заголовок раздела 2. Запускаем Astro ✨Astro поставляется со встроенным сервером разработки, на котором есть все необходимое для разработки проекта. Команда astro dev запустит локальный сервер разработки, и вы сможете впервые увидеть свой новый сайт в действии.
Каждый стартовый шаблон поставляется с предварительно настроенным скриптом, который запустит astro dev для вас. Используйте ваш любимый менеджер пакетов, чтобы запустить эту команду и запустить сервер разработки Astro.
npm run devpnpm run devyarn run devЕсли все пройдет хорошо, Astro будет использовать http://localhost:4321/ для вашего проекта!
Astro будет следить за изменениями файлов в вашей директории src/, так что, вам не нужно перезапускать сервер после внесения изменений
во время разработки.
При просмотре сайта в браузере вам будет доступна панель разработчика Astro. В процессе создания сайта она поможет вам проверить ваши острова, выявить проблемы с доступностью и многое другое.
Если вы не можете открыть свой проект в браузере, вернитесь в терминал, где вы выполняли команду dev, и посмотрите, не произошла ли ошибка, или не обслуживается ли ваш проект по URL, отличному от того, на который дана ссылка выше.
Стартовые шаблоны
Заголовок раздела Стартовые шаблоныВы также можете начать новый проект astro на основе официального примера или main ветки любого репозитория GitHub, передав аргумент --template команде create astro.
# создайте новый проект с официальным примеромnpm create astro@latest -- --template <example-name>
# создайте новый проект на основе основной ветки репозитория GitHubnpm create astro@latest -- --template <github-username>/<github-repo># создайте новый проект с официальным примеромpnpm create astro@latest --template <example-name>
# создайте новый проект на основе основной ветки репозитория GitHubpnpm create astro@latest --template <github-username>/<github-repo># создайте новый проект с официальным примеромyarn create astro --template <example-name>
# создайте новый проект на основе основной ветки репозитория GitHubyarn create astro --template <github-username>/<github-repo>По умолчанию эта команда будет использовать main ветку репозитория шаблона. Чтобы использовать другое имя ветки, передайте его в качестве части аргумента --template: <github-username>/<github-repo>#<branch>.
Исследуйте каталог наших тем и стартовых проектов, где вы можете найти темы для блогов, портфолио, документации, целевых страниц и многого другого! Или произведите поиск на GitHub, чтобы найти еще больше стартовых проектов.
Следующие шаги
Заголовок раздела Следующие шагиУспех! Теперь вы готовы начать создавать с помощью Astro! 🥳
Вот несколько тем, которые мы рекомендуем изучить далее. Вы можете читать их в любом порядке. Вы даже можете оставить нашу документацию на некоторое время и поиграть в кодовой базе вашего нового проекта Astro, возвращаясь сюда всякий раз, когда у вас возникнут проблемы или вопросы.