|
| 1 | +# Rspress |
| 2 | + |
| 3 | +:::info Prerequisites |
| 4 | + |
| 5 | +- Finished our [Get Started](/general/get-started) guide. |
| 6 | +- Registered an account on [Zephyr Cloud](https://app.zephyr-cloud.io). |
| 7 | +- Installed npm >=8. |
| 8 | +- Installed node >=18. |
| 9 | + |
| 10 | +If you don't have `nvm` to manage your node versions yet, head to [the official nvm guide](https://github.com/nvm-sh/nvm) to install it. |
| 11 | + |
| 12 | +```bash |
| 13 | +nvm use 18 |
| 14 | +``` |
| 15 | + |
| 16 | +::: |
| 17 | + |
| 18 | +## Generating a Rspress project |
| 19 | + |
| 20 | +```bash filename="Terminal" |
| 21 | +npm create rspress@latest my-rspress-site |
| 22 | +``` |
| 23 | + |
| 24 | +and then run commands to make sure you have necessary dependencies installed. |
| 25 | + |
| 26 | +```bash filename="Terminal" |
| 27 | +cd my-rspress-site |
| 28 | +npm install zephyr-rspress-plugin |
| 29 | +npm install |
| 30 | +``` |
| 31 | + |
| 32 | +## Add Zephyr configuration |
| 33 | + |
| 34 | +You should see the website running on localhost. Open `rspress.config.ts` in your editor and add the following modifications: |
| 35 | + |
| 36 | +```bash {16-18} filename="rspress.config.ts" |
| 37 | +import path from 'node:path'; |
| 38 | +import { defineConfig } from 'rspress/config'; |
| 39 | +import { withZephyr } from 'zephyr-rspress-plugin'; // Add this line |
| 40 | + |
| 41 | +export default defineConfig({ |
| 42 | + ... |
| 43 | + ssg: true, |
| 44 | + builderPlugins: [], |
| 45 | + plugins: [withZephyr()], // Add this line |
| 46 | +}); |
| 47 | +``` |
| 48 | +
|
| 49 | +:::warning |
| 50 | +
|
| 51 | +**Remember to initialize a git repository in current folder**, before you `npm run build` to deploy your app. |
| 52 | +
|
| 53 | +::: |
| 54 | +
|
| 55 | +With git config initialized, configured, and linked to remote origin, you are ready to deploy: |
| 56 | +
|
| 57 | +```bash filename="Terminal" |
| 58 | +npm run build |
| 59 | +``` |
| 60 | +
|
| 61 | +You should see something similar to the following build output below. The highlighted lines include your deployed URL: |
| 62 | +
|
| 63 | +```bash {16-18} |
| 64 | + |
| 65 | +$ rspress build |
| 66 | + |
| 67 | +🔥 Rspress v1.43.12 |
| 68 | + |
| 69 | +[zephyr] ready Built in 1.73 s (web) |
| 70 | +ready Built in 1.36 s (node) |
| 71 | +File (web) Size Gzip |
| 72 | +doc_build/static/js/styles.f3d5533f.js 0.17 kB 0.13 kB |
| 73 | +doc_build/index.html 1.1 kB 0.57 kB |
| 74 | +doc_build/static/js/async/537.c8f80cb6.js 1.9 kB 1.0 kB |
| 75 | +doc_build/static/css/styles.e45a8283.css 55.0 kB 12.0 kB |
| 76 | +Total: 13.7 kB (gzip: 142.3 kB) |
| 77 | +[zephyr] ✓ You are now logged in to Zephyr Cloud |
| 78 | +[zephyr] rspress-ssg.zephyr-packages.zephyrcloudio#280 |
| 79 | +[zephyr] Uploaded ci snapshot in 855ms |
| 80 | +[zephyr] (4/4 assets uploaded in 1191ms, 20.61kb) |
| 81 | +[zephyr] Deployed to Zephyr's edge in 3454ms. |
| 82 | +[zephyr] https://domain.zephyr-cloud.io |
| 83 | +``` |
| 84 | +
|
| 85 | +:::warning |
| 86 | +
|
| 87 | +The total size for the web thread reflects the original files. When the SSG flag is enabled, the uploaded total size corresponds to the already-processed SSG files. If the SSG flag is disabled, the Rspress plugin relies on the Rspack plugin execution, and the total size represents the original, unprocessed files. |
| 88 | +
|
| 89 | +::: |
| 90 | +
|
| 91 | +## Next Steps |
| 92 | +
|
| 93 | +Now that the initial setup is complete, you can check other [cloud providers](/cloud) to deploy your application. Or how to customize your [environment settings](/how-to/environments). |
| 94 | +
|
| 95 | +You can also check out the [Rspress documentation](https://rspress.dev/guide/start/introduction) for more information on how to use Rspress. |
0 commit comments