Запустите yarn serve:dev
Это будет использовать src
с index.html
в качестве точки входа.
Во втором терминале запустите yarn watch
. Это будет отслеживать все файлы внутри src/
и знать, что app.css
необходимо перекомпилировать с любыми новыми стилями попутного ветра, которые были добавлены по пути.
Примечание: здесь есть небольшая задержка, прежде чем вы нажмете «Обновить»… «Эй, это не какое-то необычное приложение React KISS, просто нажмите кнопку обновления».
dev
без просмотра, yarn compile:css:dev
Итак, вы действительно хотите развернуть эту штуку...
Запустите yarn build:all
, чтобы сделать «все». Это скопирует все файлы *.html
в каталог /build
и скомпилирует app.css
с NODE_ENV=production
. Это говорит Tailwind использовать предустановленный вариант purge
из Tailwind.config.js.
Скопируйте этот каталог /build
на любой сайт статического хостинга... Или укажите статическому сайту хостинга, чтобы он использовал /build/index.html
в качестве точки входа.
Примечание. После сборки вы также можете запустить эту сборку локально, чтобы увидеть, как будет выглядеть «prod», запустив
yarn serve:prod
. Это позволит использовать каталогbuild
вместоsrc
для просмотра вновь скомпилированного кода.
Как создать чистые URL-адреса для новых страниц? Добавьте файл vercel.json с определенными routes
, и пусть Vercel позаботится обо всем остальном.
{
"version": 2,
"routes": [
{"src": "/about", "dest": "/about.html"}
]
}
Для получения более подробной информации ознакомьтесь с их документацией здесь.
Вот и все... Добавьте статический HTML, ссылку на index.css
и получайте удовольствие.
Связывание репо и настроек
Предварительный просмотр развертывания
Сделанный!