| 1 | --- |
| 2 | name: hosting |
| 3 | description: Build and deploy Slidev presentations |
| 4 | --- |
| 5 | |
| 6 | # Hosting & Deployment |
| 7 | |
| 8 | Build and deploy Slidev presentations. |
| 9 | |
| 10 | ## Build for Production |
| 11 | |
| 12 | ```bash |
| 13 | slidev build |
| 14 | ``` |
| 15 | |
| 16 | Output: `dist/` folder (static SPA) |
| 17 | |
| 18 | ### Options |
| 19 | |
| 20 | ```bash |
| 21 | slidev build --base /talks/my-talk/ # Custom base path |
| 22 | slidev build --out public # Custom output dir |
| 23 | slidev build --download # Include PDF |
| 24 | slidev build --without-notes # Exclude notes |
| 25 | ``` |
| 26 | |
| 27 | ### Multiple Presentations |
| 28 | |
| 29 | ```bash |
| 30 | slidev build slides1.md slides2.md |
| 31 | ``` |
| 32 | |
| 33 | ## GitHub Pages |
| 34 | |
| 35 | ### GitHub Actions |
| 36 | |
| 37 | Create `.github/workflows/deploy.yml`: |
| 38 | |
| 39 | ```yaml |
| 40 | name: Deploy |
| 41 | |
| 42 | on: |
| 43 | push: |
| 44 | branches: [main] |
| 45 | |
| 46 | permissions: |
| 47 | contents: read |
| 48 | pages: write |
| 49 | id-token: write |
| 50 | |
| 51 | jobs: |
| 52 | deploy: |
| 53 | runs-on: ubuntu-latest |
| 54 | steps: |
| 55 | - uses: actions/checkout@v4 |
| 56 | |
| 57 | - uses: actions/setup-node@v4 |
| 58 | with: |
| 59 | node-version: 'lts/*' |
| 60 | |
| 61 | - name: Install |
| 62 | run: npm install |
| 63 | |
| 64 | - name: Build |
| 65 | run: npm run build -- --base /${{ github.event.repository.name }}/ |
| 66 | |
| 67 | - uses: actions/configure-pages@v4 |
| 68 | |
| 69 | - uses: actions/upload-pages-artifact@v3 |
| 70 | with: |
| 71 | path: dist |
| 72 | |
| 73 | - uses: actions/deploy-pages@v4 |
| 74 | ``` |
| 75 | |
| 76 | ## Netlify |
| 77 | |
| 78 | Create `netlify.toml`: |
| 79 | |
| 80 | ```toml |
| 81 | [build] |
| 82 | publish = 'dist' |
| 83 | command = 'npm run build' |
| 84 | |
| 85 | [[redirects]] |
| 86 | from = '/*' |
| 87 | to = '/index.html' |
| 88 | status = 200 |
| 89 | ``` |
| 90 | |
| 91 | ## Vercel |
| 92 | |
| 93 | Create `vercel.json`: |
| 94 | |
| 95 | ```json |
| 96 | { |
| 97 | "rewrites": [ |
| 98 | { "source": "/(.*)", "destination": "/index.html" } |
| 99 | ] |
| 100 | } |
| 101 | ``` |
| 102 | |
| 103 | ## Docker |
| 104 | |
| 105 | ### Using Official Image |
| 106 | |
| 107 | ```bash |
| 108 | docker run --name slidev --rm -it \ |
| 109 | -v ${PWD}:/slidev \ |
| 110 | -p 3030:3030 \ |
| 111 | tangramor/slidev:latest |
| 112 | ``` |
| 113 | |
| 114 | ### Custom Dockerfile |
| 115 | |
| 116 | ```dockerfile |
| 117 | FROM tangramor/slidev:latest |
| 118 | |
| 119 | COPY slides.md . |
| 120 | COPY public ./public |
| 121 | |
| 122 | RUN npm run build |
| 123 | |
| 124 | EXPOSE 80 |
| 125 | CMD ["npx", "serve", "dist"] |
| 126 | ``` |
| 127 | |
| 128 | ## Base Path |
| 129 | |
| 130 | For subdirectory deployment: |
| 131 | |
| 132 | ```bash |
| 133 | # Build |
| 134 | slidev build --base /my-slides/ |
| 135 | |
| 136 | # Or in headmatter |
| 137 | --- |
| 138 | base: /my-slides/ |
| 139 | --- |
| 140 | ``` |
| 141 | |
| 142 | ## Router Mode |
| 143 | |
| 144 | For servers without rewrite support: |
| 145 | |
| 146 | ```yaml |
| 147 | --- |
| 148 | routerMode: hash |
| 149 | --- |
| 150 | ``` |
| 151 | |
| 152 | URLs become: `/#/1`, `/#/2`, etc. |
| 153 |