Template of yew project, using tailwind and webpack for css, trunk for build and serve, deployable as is for github.io

Yew Template for Github.io

Yew template that deployable as is for github.io (or as a normal yew template with css/scss stuffs without github.io), with tailwind.css and webpack with your css/scss.

About github.io

main branch
├── index.html
│
├── css                       # css/scss
│   ├── index.css
│   ├── index.scss
│   ├── main.scss
│   └── tailwind
│       └── tailwind_base.css
│
├── src                       # yew here
│   └── main.rs
│
├── static
│   └── 404.html
│
├── README.md
├── Cargo.lock
├── Cargo.toml
├── Trunk.toml
├── package.json
├── tailwind.config.js
└── webpack.config.js

gh-pages branch
├── index.html
├── 404.html
├── index-7823f64dca35d01f.js
├── index-7823f64dca35d01f_bg.wasm
└── main-baa4389a63fdea1b.css

Things that you need to do

Go Setting > Code and automation > Pages > Github Pages > Source and change branch from main to gh-pages. if not exists, create new branch named gh-pages.
github action is cofigured. just push your repo to the main branch, and then outputs of trunk build --release will automatically deployed.

For {username}.github.io page

you need to modify this line and this line to 0
also check ./src/main.rs

For {username}.github.io/{project_name} page

you need to modify this line and this line to 1 also check ./src/main.rs
When you want to deploy on your machine, run trunk serve --public-url=/{project_name}/

As a normal template(not for github.io)

To use without github.io, open Trunk.toml and remove public_url field.
Also remove 404.html in static folder and this line in index.html.
Lastly remove .github/workflow folder.

Using Custom Domain

go to ./.github/workflows/publish_gh_pages.yml and add your domain in cname field.

Routing

Using static/404.html. for more information, checkout https://github.com/rafgraph/spa-github-pages.