Скачать astro paper - Скачать astro paper Исходный код

astro paper

Другие категории

v4.7.0

Скачать

Астробумага?

Структура проекта

Внутри AstroPaper вы увидите следующие папки и файлы:

/
├── public/
│   ├── assets/
│   │   └── logo.svg
│   │   └── logo.png
│   └── favicon.svg
│   └── astropaper-og.jpg
│   └── robots.txt
│   └── toggle-theme.js
├── src/
│   ├── assets/
│   │   └── socialIcons.ts
│   ├── components/
│   ├── content/
│   │   |  blog/
│   │   |    └── some-blog-posts.md
│   │   └── config.ts
│   ├── layouts/
│   └── pages/
│   └── styles/
│   └── utils/
│   └── config.ts
│   └── types.ts
└── package.json

Astro ищет файлы .astro или .md в каталоге src/pages/ . Каждая страница отображается как маршрут на основе имени ее файла.

Любые статические ресурсы, например изображения, можно разместить в каталоге public/ .

Все сообщения блога хранятся в каталоге src/content/blog .

Документация

Документацию можно читать в двух форматах: уценка и запись в блоге .

Конфигурация - уценка | сообщение в блоге
Добавить сообщения - уценка | сообщение в блоге
Настройка цветовых схем — уценка | сообщение в блоге
Предопределенные цветовые схемы — уценка | сообщение в блоге

Для AstroPaper v1 проверьте эту ветку и этот действующий URL-адрес.

Технический стек

Основная платформа — Astro
Проверка типов — TypeScript
Компонентная платформа — ReactJS
Стиль — TailwindCSS
UI/UX — файл дизайна Figma
Нечеткий поиск — FuseJS
Иконки - Боксиконы | Столбцы
Форматирование кода — красивее
Развертывание — страницы Cloudflare
Иллюстрация на странице «О программе » — https://freesvgillustration.com
Линтинг — ESLint

??‍ Запуск локально

Вы можете начать использовать этот проект локально, выполнив следующую команду в нужном каталоге:

 # npm 6.x
npm create astro@latest --template satnaing/astro-paper

# npm 7+, extra double-dash is needed:
npm create astro@latest -- --template satnaing/astro-paper

# yarn
yarn create astro --template satnaing/astro-paper

# pnpm
pnpm dlx create-astro --template satnaing/astro-paper

Предупреждение! Если вы используете yarn 1 , вам может потребоваться установить sharp в качестве зависимости.

Затем запустите проект, выполнив следующие команды:

 # install dependencies
npm run install

# start running the project
npm run dev

В качестве альтернативного подхода, если у вас установлен Docker, вы можете использовать Docker для локального запуска этого проекта. Вот как:

 # Build the Docker image
docker build -t astropaper .

# Run the Docker container
docker run -p 4321:80 astropaper

Проверка сайта Google (необязательно)

Вы можете легко добавить HTML-тег проверки сайта Google в AstroPaper, используя переменную среды. Этот шаг не является обязательным. Если вы не добавите следующую переменную среды, тег google-site-verification не появится в разделе HTML <head> .

 # in your environment variable file (.env)
PUBLIC_GOOGLE_SITE_VERIFICATION=your-google-site-verification-value

См. это обсуждение для добавления AstroPaper в консоль поиска Google.

? Команды

Все команды запускаются из корня проекта, из терминала:

Примечание! Для команд Docker он должен быть установлен на вашем компьютере.

Команда	Действие
`npm install`	Устанавливает зависимости
`npm run dev`	Запускает локальный сервер разработки по адресу `localhost:4321`
`npm run build`	Создайте свой производственный сайт в `./dist/`
`npm run preview`	Предварительный просмотр сборки локально перед развертыванием
`npm run format:check`	Проверьте формат кода с помощью Prettier
`npm run format`	Форматирование кодов с помощью Prettier
`npm run sync`	Генерирует типы TypeScript для всех модулей Astro. Узнать больше.
`npm run lint`	Линт с ESLint
`docker compose up -d`	Запустите AstroPaper в докере. Вы можете получить доступ с тем же именем хоста и портом, которые указаны в команде `dev` .
`docker compose run app npm install`	Вы можете запустить любую команду, указанную выше, в контейнере докеров.
`docker build -t astropaper .`	Создайте образ Docker для AstroPaper.
`docker run -p 4321:80 astropaper`	Запустите AstroPaper в Docker. Веб-сайт будет доступен по адресу `http://localhost:4321` .

Предупреждение! Пользователям Windows PowerShell может потребоваться установить пакет concurrently, если они хотят запускать диагностику во время разработки ( astro check --watch & astro dev ). Дополнительную информацию см. в этом выпуске.

Отзывы и предложения

Если у вас есть какие-либо предложения/отзывы, вы можете связаться со мной по электронной почте. Альтернативно, не стесняйтесь открыть проблему, если вы обнаружите ошибки или захотите запросить новые функции.