Skip to content

Commit

Permalink
docs: update README
Browse files Browse the repository at this point in the history
  • Loading branch information
yusukebe committed Jun 16, 2024
1 parent 903928f commit 0d9159d
Showing 1 changed file with 12 additions and 38 deletions.
50 changes: 12 additions & 38 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,7 @@ There are three ways to define routes.
Each route should return an array of `Handler | MiddlewareHandler`. `createRoute()` is a helper function to return it. You can write a route for a GET request with `default export`.

```tsx
// app/routes/index.tsx
// `createRoute()` helps you create handlers
import { createRoute } from 'honox/factory'

Expand All @@ -108,6 +109,7 @@ export default createRoute((c) => {
You can also handle methods other than GET by `export` `POST`, `PUT`, and `DELETE`.

```tsx
// app/routes/index.tsx
import { createRoute } from 'honox/factory'
import { getCookie, setCookie } from 'hono/cookie'

Expand Down Expand Up @@ -157,6 +159,7 @@ export default app
Or simply, you can just return JSX.

```tsx
// app/routes/index.tsx
export default function Home(_c: Context) {
return <h1>Welcome!</h1>
}
Expand Down Expand Up @@ -660,21 +663,17 @@ Finally, add `vite.config.ts` configuration to output assets for the production.
```ts
import honox from 'honox/vite'
import { defineConfig } from 'vite'
import pages from '@hono/vite-cloudflare-pages'
export default defineConfig(({ mode }) => {
if (mode === 'client') {
return {
build: {
rollupOptions: {
input: ['/app/style.css'],
},
export default defineConfig({
plugins: [
honox({
client: {
input: ['/app/style.css'],
},
}
} else {
return {
plugins: [honox()],
}
}
}),
pages(),
],
})
```

Expand All @@ -690,13 +689,10 @@ import remarkFrontmatter from 'remark-frontmatter'
import remarkMdxFrontmatter from 'remark-mdx-frontmatter'
import { defineConfig } from 'vite'
const entry = './app/server.ts'
export default defineConfig(() => {
return {
plugins: [
honox(),
devServer({ entry }),
mdx({
jsxImportSource: 'hono/jsx',
remarkPlugins: [remarkFrontmatter, remarkMdxFrontmatter],
Expand Down Expand Up @@ -800,28 +796,6 @@ export default defineConfig({
})
```

If you want to include client-side scripts and assets:

```ts
// vite.config.ts
import pages from '@hono/vite-cloudflare-pages'
import honox from 'honox/vite'
import client from 'honox/vite/client'
import { defineConfig } from 'vite'
export default defineConfig(({ mode }) => {
if (mode === 'client') {
return {
plugins: [client()],
}
} else {
return {
plugins: [honox(), pages()],
}
}
})
```

Build command (including a client):

```txt
Expand Down

0 comments on commit 0d9159d

Please sign in to comment.