Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Use universal-middleware #16

Merged
merged 36 commits into from
Nov 28, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
36 commits
Select commit Hold shift + click to select a range
0dbd3b6
feat: use `universal-middleware`
magne4000 Oct 9, 2024
2ac238c
tests: plug universal-middleware
magne4000 Oct 9, 2024
1d8563d
chore: wip
magne4000 Oct 9, 2024
4ccc05c
chore: fallback hmr support
magne4000 Oct 9, 2024
363470f
chore: wip serve static
magne4000 Oct 9, 2024
d29109c
chore: update u-m to provide `req` when required
magne4000 Oct 10, 2024
0b2f2e1
chore: compression
magne4000 Oct 10, 2024
708f594
chore: format
magne4000 Oct 10, 2024
29128b5
chore: use @universal-middleware/compress
magne4000 Oct 15, 2024
7fc7222
chore: format
magne4000 Oct 15, 2024
5327c01
chore: cleanup
magne4000 Oct 16, 2024
5a19bb7
chore: cleanup
magne4000 Oct 16, 2024
14807e7
test: use pnpm instead of npm
magne4000 Oct 16, 2024
e36ab26
chore: upgrade unenv
magne4000 Oct 16, 2024
38f0422
chore: upgrade vike-react
magne4000 Oct 16, 2024
b365ec0
fix: examples
magne4000 Oct 16, 2024
87efe2c
chore: update compress middleware to support zlib when available
magne4000 Oct 16, 2024
2a968ff
doc: README
magne4000 Oct 16, 2024
57d9c91
doc: add migration instructions
magne4000 Oct 16, 2024
956a9fe
doc: rewording
magne4000 Oct 16, 2024
e72c233
chore: review update
magne4000 Nov 25, 2024
58720b1
refactor: review
magne4000 Nov 25, 2024
4cd40f7
refactor: review
magne4000 Nov 25, 2024
234be94
lint
magne4000 Nov 25, 2024
0fb749e
fix: remove restriction on nodeReq in compressMiddleware
magne4000 Nov 25, 2024
7c145f6
chore: put back inject behaviour
magne4000 Nov 25, 2024
4e7491d
doc: remove migration from README
magne4000 Nov 25, 2024
4888380
refactor: use getReadableWebStream
magne4000 Nov 25, 2024
450f9d7
chore: update lock file
magne4000 Nov 25, 2024
89881a5
chore: bump universal-middleware
magne4000 Nov 27, 2024
b827a4e
increase esbuild semver range
brillout Nov 27, 2024
91a4b3a
update type
brillout Nov 27, 2024
c78e23b
Revert "update type"
brillout Nov 27, 2024
e1f5298
fix error message
brillout Nov 27, 2024
712809f
docs: polish
brillout Nov 27, 2024
2a4be82
feat: /connect import replaced by /express
magne4000 Nov 28, 2024
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion biome.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"$schema": "./node_modules/@biomejs/biome/configuration_schema.json",
"files": {
"ignore": ["dist/", ".vercel/", "package.json"]
"ignore": ["dist/", ".vercel/", "package.json", "test/vike-node/build"]
},
"formatter": {
"indentWidth": 2,
Expand Down
8 changes: 4 additions & 4 deletions examples/express-react-vercel/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,13 @@
"dependencies": {
"@vitejs/plugin-react": "^4.3.1",
"cross-env": "^7.0.3",
"express": "^4.19.2",
"express": "^4.21.1",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"vike": "^0.4.193",
"vike": "^0.4.198",
"vike-node": "^0.1.16",
"vike-react": "^0.4.18",
"vite": "^5.4.0"
"vike-react": "^0.5.7",
"vite": "^5.4.8"
},
"type": "module"
}
2 changes: 1 addition & 1 deletion examples/express-react-vercel/server/index.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import express from 'express'
import vike from 'vike-node/connect'
import vike from 'vike-node/express'

export default startServer()

Expand Down
8 changes: 4 additions & 4 deletions examples/express-react/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,13 @@
"dependencies": {
"@vitejs/plugin-react": "^4.3.1",
"cross-env": "^7.0.3",
"express": "^4.19.2",
"express": "^4.21.1",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"vike": "^0.4.193",
"vike": "^0.4.198",
"vike-node": "^0.1.16",
"vike-react": "^0.4.18",
"vite": "^5.4.0"
"vike-react": "^0.5.7",
"vite": "^5.4.8"
},
"type": "module"
}
2 changes: 1 addition & 1 deletion examples/express-react/server/index.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import express from 'express'
import vike from 'vike-node/connect'
import vike from 'vike-node/express'

startServer()

Expand Down
6 changes: 3 additions & 3 deletions examples/hono-react-cf-pages/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -12,10 +12,10 @@
"hono": "^4.5.5",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"vike": "^0.4.193",
"vike": "^0.4.198",
"vike-node": "^0.1.16",
"vike-react": "^0.4.18",
"vite": "^5.4.0"
"vike-react": "^0.5.7",
"vite": "^5.4.8"
},
"type": "module",
"devDependencies": {
Expand Down
8 changes: 4 additions & 4 deletions examples/hono-react-vercel-edge/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,13 +11,13 @@
"@hono/node-server": "^1.12.0",
"@vitejs/plugin-react": "^4.3.1",
"cross-env": "^7.0.3",
"hono": "^4.5.5",
"hono": "^4.6.3",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"vike": "^0.4.193",
"vike": "^0.4.198",
"vike-node": "^0.1.16",
"vike-react": "^0.4.18",
"vite": "^5.4.0",
"vike-react": "^0.5.7",
"vite": "^5.4.8",
"telefunc": "^0.1.76"
},
"type": "module"
Expand Down
2 changes: 1 addition & 1 deletion examples/hono-react-vercel-edge/vite.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ export default {
entry: {
index: 'server/node-entry.js',
app: {
path: 'server/app.js',
entry: 'server/app.js',
brillout marked this conversation as resolved.
Show resolved Hide resolved
runtime: 'vercel'
}
}
Expand Down
3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,8 @@
},
"pnpm": {
"overrides": {
"vike-node": "link:./packages/vike-node/"
"vike-node": "link:./packages/vike-node/",
"esbuild": "^0.24.0"
brillout marked this conversation as resolved.
Show resolved Hide resolved
}
},
"packageManager": "[email protected]"
Expand Down
73 changes: 31 additions & 42 deletions packages/vike-node/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,17 +14,16 @@ In development, the server process is restarted when a change is detected in som
[Installation](#installation)
[Standalone build](#standalone-build)
[External packages](#external-packages)
[Caching and compression](#caching-and-compression)
[Compression](#compression)
[Custom pageContext](#custom-pagecontext)
[Framework examples](#framework-examples)
[Migration guide](#migration-guide)
[Add to existing app](#add-to-existing-app)

<br/>

## Installation

1. `npm install vike-node express`
2. Extend `vite.config.js`:
1. Extend `vite.config.js`:

```js
// vite.config.js
Expand All @@ -36,14 +35,13 @@ In development, the server process is restarted when a change is detected in som
plugins: [vikeNode('server/index.js')]
}
```

3. Create `server/index.js`:
1. Create `server/index.js`:

```js
// server/index.js

import express from 'express'
import vike from 'vike-node/connect'
import vike from 'vike-node/express'

startServer()

Expand All @@ -54,8 +52,9 @@ In development, the server process is restarted when a change is detected in som
app.listen(port, () => console.log(`Server running at http://localhost:${port}`))
}
```
> If you already have a server, see [Add to existing app](#add-to-existing-app).

## Standalone build:
## Standalone build

You can enable standalone builds by setting `standalone` to `true`.
<br>
Expand All @@ -81,7 +80,7 @@ export default {
}
```

## External packages:
## External packages

Packages that import native binaries/custom assets need to be added to `external`.<br>
When building with `standalone` enabled, `external` packages and their assets are copied to the output `dist` directory.<br>
Expand All @@ -108,42 +107,28 @@ export default {
}
```

## Caching and compression:

In production, `vike-node`:
## Compression

- compresses all Vike responses
- caches the compressed static assets(.js, .css).
In production, `vike-node` compresses all Vike responses.

On a request, if the asset(.js, .css) is not in the cache, `vike-node` compresses it with a fast compression level, sends it in the response, then recompresses it with a high compression level and finally caches the compressed data.<br>
You can disable compression/caching:
You can disable it:

```js
app.use(
vike({
compress: false,
static: {
cache: false
}
compress: false
})
)
```

## Custom [pageContext](https://vike.dev/pageContext):
## Custom [pageContext](https://vike.dev/pageContext)

You can define custom [pageContext](https://vike.dev/pageContext) properties:
`vike-node` uses [universal-middleware](https://universal-middleware.dev/) and automatically adds the universal context to `pageContext`.

```js
app.use(
vike({
pageContext: (req) => ({
magne4000 marked this conversation as resolved.
Show resolved Hide resolved
user: req.user
})
})
)
```
If you need custom properties to be available in `pageContext`,
you can [create a universal context middleware](https://universal-middleware.dev/recipes/context-middleware#updating-the-context) and attach it to your server.

## Framework examples:
## Framework examples

`vike-node` includes middlewares for the most popular web frameworks:

Expand All @@ -153,13 +138,15 @@ app.use(
- H3
- Elysia (Bun)

Express:
[See complete list of supported servers](https://universal-middleware.dev/reference/supported-adapters).

#### Express

```js
// server/index.js

import express from 'express'
import vike from 'vike-node/connect'
import vike from 'vike-node/express'

startServer()

Expand All @@ -171,7 +158,7 @@ function startServer() {
}
```

Fastify:
#### Fastify

```js
// server/index.js
Expand All @@ -183,13 +170,13 @@ startServer()

function startServer() {
const app = fastify()
app.register(vike())
app.all('/*', vike())
const port = 3000
app.listen({ port }, () => console.log(`Server running at http://localhost:${port}`))
}
```

Hono:
#### Hono

```js
// server/index.js
Expand All @@ -214,7 +201,7 @@ function startServer() {
}
```

H3:
#### H3

```js
// server/index.js
Expand All @@ -236,7 +223,7 @@ async function startServer() {
}
```

Elysia (Bun):
#### Elysia (Bun)

```js
// server/index.js
Expand All @@ -248,19 +235,21 @@ startServer()

function startServer() {
const app = new Elysia()
app.use(vike())
app.get('/*', vike())
const port = 3000
app.listen(port, () => console.log(`Server running at http://localhost:${port}`))
}
```

## Migration guide:
## Add to existing app

To add `vike-node` to an existing Vike app:

```diff
// server/index.js

magne4000 marked this conversation as resolved.
Show resolved Hide resolved
- import { renderPage } from 'vike/server'
+ import { vike } from 'vike-node/connect'
+ import { vike } from 'vike-node/express'

- if (isProduction) {
- app.use(express.static(`${root}/dist/client`))
Expand Down
Loading