Publish Your Presentation

Slidev presentations are actually static websites. You can thus host your presentation online, meaning anyone can browse to your presentation and access it. You can find more information about hosting Slidev presentations here.

In this guide we will cover some free options for hosting your presentations.

Github

You can use Github Actions to build your presentation and then host it for free with Github Pages.

In order to use these features, you need to create a file called .github/workflows/deploy.yml and enter the following content. Make sure to replace <repository-name> with the name of your repository in the build command. If you use a main branch instead of a master branch, you need to change that at the top of the file as well.

name: Build and Deploy Presentation
on:
  push:
    branches:
      - master
permissions:
  contents: write
concurrency:
  group: ci-${{ github.ref }}
  cancel-in-progress: true

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
      # Checkout repository
      - name: Checkout
        uses: actions/checkout@v3

      # Setup Node & pnpm
      - name: Setup PNPM
        uses: pnpm/action-setup@v2
        with:
          version: 8
      - name: Setup Node
        uses: actions/setup-node@v3
        with:
          node-version: 'latest'
          cache: pnpm

      # Install dependencies
      - name: Install dependencies
        run: pnpm install --frozen-lockfile

      # Build demo
      - name: Build
        run: pnpm run build --base /<repository-name>/
        
      # Deploy
      - name: Deploy
        uses: JamesIves/github-pages-deploy-action@v4
        with:
          folder: dist

Whenever you push a new update to your master branch, this action will get started and rebuild your presentation. You can then access your presentation by browsing to https://<username>.github.io/<repository-name>/.

NOTE
Github pages websites are always publicly available (unless you have Github Enterprise Cloud). This means that anyone can view your presentation, even if your repository is private.

Gitlab

Similarly to github, you can use Gitlab CI to build you presentation and host it with Gitlab Pages.

In order to use these features, you need to create a file called .gitlab-ci.yml and enter the following content. Make sure to replace <repository-name> with the name of your repository in the build command. If you use a main branch instead of a master branch, you need to change that at the top of the file as well.

image: node:lts

before_script:
    - corepack enable
    - corepack prepare pnpm@latest-8 --activate
    - pnpm config set store-dir .pnpm-store

cache:
  key:
    files:
      - pnpm-lock.yaml
  paths:
    - .pnpm-store

stages:
  - deploy

pages:
  stage: deploy
  rules:
    - if: '$CI_COMMIT_BRANCH == "master"'
  script:
    - pnpm install --frozen-lockfile
    - pnpm run build --base <repository-name>
  artifacts:
    paths:
      - dist
  publish: dist

Whenever you push a new update to your master branch, this action will get started and rebuild your presentation. You can then access your presentation by browsing to https://<username>.gitlab.io/<repository-name>/. You do need to disable the "Use unique domain" option under deploy > pages to have this fixed URL as your domain.

NOTE
If you created a private repository in Gitlab, only people with access to your repository will be able to view the presentation. You can disable this setting on Gitlab in your pages settings.