Slidev Docker image

Work with Slidev. Just run following command in your work folder:

docker run --name slidev --rm -it \
    --user node \
    -v ${PWD}:/slidev \
    -p 3030:3030 \
    -e NPM_MIRROR="https://registry.npmmirror.com" \
    tangramor/slidev:latest

Or use the automatically updated GitHub Container Registry image:

docker run --name slidev --rm -it \
    --user node \
    -v ${PWD}:/slidev \
    -p 3030:3030 \
    ghcr.io/xxchillkroetexx/slidev:latest

Note: You can use NPM_MIRROR to specify a npm mirror to speed up the installation process.

If your work folder is empty, it will generate a template slides.md and other related files under your work folder, and launch the server on port 3030.

You can access your slides from http://localhost:3030/

Exportable docker image

To support the export feature, there is a bigger docker image with tag playwright. Just run following command in your work folder:

docker run --name slidev --rm -it \
    -v ${PWD}:/slidev \
    -p 3030:3030 \
    -e NPM_MIRROR="https://registry.npmmirror.com" \
    tangramor/slidev:playwright

Or use the automatically updated GitHub Container Registry image:

docker run --name slidev --rm -it \
    -v ${PWD}:/slidev \
    -p 3030:3030 \
    ghcr.io/xxchillkroetexx/slidev:latest-playwright

Then you can use the export feature of Slidev like following under your work folder:

docker exec -i slidev npx slidev export --timeout 2m --output slides.pdf

Build deployable image

Or you can create your own slidev project to a docker image with Dockerfile:

FROM tangramor/slidev:latest

ADD . /slidev

Create the docker image: docker build -t myppt .

And run the container: docker run --name myslides --rm --user node -p 3030:3030 myppt

You can visit your slides from http://localhost:3030/

Build hostable SPA (Single Page Application)

Run command docker exec -i slidev npx slidev build on the running container slidev. It will generate static HTML files under dist folder.

Host on Github Pages

You can host dist in a static web site such as Github Pages or Gitlab Pages.

Because in Github pages the url may contain subfolder, so you need to modify the generated index.html to change href="/assets/xxx to href="./assets/xxx. Or you may use --base=/<subfolder>/ option during the build process, such as: docker exec -i slidev npx slidev build --base=/slidev_docker/.

And to avoid Jekyll build process, you need to add an empty file .nojekyll.

Host by docker

You can also host it by yourself with docker:

docker run --name myslides --rm -p 80:80 -v ${PWD}/dist:/usr/share/nginx/html nginx:alpine

Or create a static image with following Dockerfile:

FROM nginx:alpine

COPY dist /usr/share/nginx/html

Create the docker image: docker build -t mystaticppt .

And run the container: docker run --name myslides --rm -p 80:80 mystaticppt

You can visit your slides from http://localhost/

GitHub Actions - Container Registry

The workflow automatically builds and pushes images to GitHub Container Registry on every push to the master branch or when a version tag is created.

Images are available at:

• ghcr.io/xxchillkroetexx/slidev:latest
• ghcr.io/xxchillkroetexx/slidev:latest-playwright
• ghcr.io/xxchillkroetexx/slidev:latest-arm64v8

No additional configuration is needed as the workflow uses the built-in GITHUB_TOKEN.