Giter VIP home page Giter VIP logo

antora-preview's Introduction

Antora Preview Tool

This tool can be used to quickly preview an Antora documentation website.

How to use

Run the following command on top of any project containing Antora documentation:

$ docker run --rm --publish 35729:35729 \
             --publish 2020:2020 \
             --volume "${PWD}":/preview/antora \
             vshn/antora-preview:$LATEST_VERSION --antora=docs --style=appuio

Passing the --help parameter shows the inline help:

Antora Documentation Previewer

This command builds an Antora documentation website locally and launches a web
server on port 2020 to browse the documentation.

Arguments:
    --style=STYLE / -s=STYLE:
           Antora UI Bundle to use to render the documentation.
           Valid values: 'vshn', 'appuio', 'syn', 'k8up', 'antora'.
           Default value: 'vshn'

    -a=PATH / --antora=PATH:
           Path to the subfolder.
           Default: 'docs'

Examples:
    antora-preview --style=appuio --antora=src

GitHub project: https://github.com/vshn/antora-preview

Open the URL http://localhost:2020 to browse the documentation.

Previewing Your Own Bundles

If you would like to use your own ui-bundle.zip file for preview, follow these steps.

  1. Build your custom UI bundle; assuming the new file is located in /home/user/antora-default-ui/build/custom-ui-bundle.zip

  2. Launch the previewer sharing a new volume, pointing to the location above mapped as /preview/bundles in the container, and specifying the --style parameter with the custom-ui-bundle name (this is the basename of the zip file above):

$ docker run --rm --publish 35729:35729 --publish 2020:2020 \
             --volume "${PWD}":/preview/antora \
             --volume /home/user/antora-default-ui/build/:/preview/bundles \
             vshn/antora-preview:$LATEST_VERSION --antora=docs --style=custom-ui-bundle

If needed, force refresh the page in your browser to clear any cache.

LiveReload

This image is capable of "live reloading" the documention as the user writes the Asciidoc source. To do that, you need a browser with one of these extensions:

Open the documentation in your browser and click on the LiveReload extension button on the toolbar; when it becomes green, the browser will automatically refresh whenever you save an Asciidoc file.

antora-preview's People

Contributors

akosma avatar arska avatar kidswiss avatar renovate-bot avatar renovate[bot] avatar simu avatar tobru avatar

Stargazers

 avatar

Watchers

 avatar  avatar  avatar  avatar

antora-preview's Issues

Dependency Dashboard

This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.

Open

These updates have all been created already. Click a checkbox below to force a retry/rebase of any.

Detected dependencies

dockerfile
Dockerfile
  • ghcr.io/vshn/antora 3.1.4
github-actions
.github/workflows/container.yml
  • actions/checkout v4
  • docker/setup-qemu-action v2
  • docker/setup-buildx-action v2
  • docker/login-action 9780b0c442fbb1117ed29e0efdff1e18412f7567
  • docker/metadata-action 60a0d343a0d8a18aedee9d34e62251f752153bdb
  • docker/build-push-action 5cd11c3a4ced054e52742c5fd54dca954e0edd85

  • Check this box to trigger a request for Renovate to run again on this repository

Configurable location for custom UI assets

I have a build directory within my Antora project's home, would it be possible to specify the location of both the UI bundle (zip file) and supplemental-ui folder at container start.

./build/ui-bundle.zip
./build/supplemental-ui

Using FF 80.0.1 (64-bit). Ubuntu 18.04 LTS app under WSL with Docker Desktop.

Livereload not working on macOS with lima

Summary

Using docker via lima on macOS breaks the livereload.

Context

Lima uses sshfs to map local folders to the docker VM and inotify doesn't seem to be working properly in that case.

To Reproduce

  • Start lima VM
  • Configure Docker to use lima
  • Start the antora-preview container
  • Edit .adoc files
  • The docker container doesn't register the changes and doesn't trigger a rebuild

Workaround

Using guard locally with this configuraton:

group :documentation do
    # Rebuild documentation when modifying files
    guard :shell do
        watch(/(.*).adoc/) do
            `docker exec -it antora antora --cache-dir=/preview/public/.cache/antora /preview/playbook.yml`
        end
    end

    # Refresh browser when folder with HTML files changes
    guard :livereload do
        watch(/(.*).adoc/)
    end
end

Then run it:

cd project
guard &
docker run --name antora --rm --publish 35729:35729 --publish 2020:2020 --volume "${pwd}":/preview/antora -d vshn/antora-preview:2.3.12 --antora=docs --style=vshn

Not really sure how this could be solved though. Maybe just document this workaround somewhere? Also most people probably use Docker Desktop on Macs.

Cannot find Antora file '/preview/antora/docs/antora.yml'

Running:

docker run --rm --publish 35729:35729 --publish 2020:2020 --volume "${PWD}":/preview/antora vshn/antora-preview:2.3.4 --antora=docs --style=appuio

It returns:

Cannot find Antora file '/preview/antora/docs/antora.yml'

Make ports configurable

Currently the Docker image requires two ports exposed:

  • Web server port (Caddy) configured as 2020;
  • LiveReload port, configured as 35729 by default.

Make these two configurable via environment variables, following this suggestion by @corvus-ch in this PR comment.

Serve custom 404.html page for 404 error

Does your preview setup serve a custom 404 html page?

I'm new to Caddyfile format, but shouldn't you also have something like:

handle_errors {
	rewrite * /{err.status_code}.html
	file_server
}

For some reason this was not working with 2.6.4-alpine version and I downgraded to 2.6.3-alpine and it works, partially.
If the request is nested (e.g. localhost:port/some-path/somefile), then the CSS and js files are not found.

Do you think this is an issue with Caddy or Antora 404.html generated file?

EDIT: It looks like the issue was with the 404.html file. The file generated from the Default-UI preview src outputs:

<script id="site-script" src="_/js/site.js" data-ui-root-path="_"></script>
<script async src="_/js/vendor/highlight.js"></script>

And it should be absolute path: src="/_/js/site.js"

Provide ARM64 images

Currently it's a pain to use make preview in the docs repos on an Apple Silicon Mac.

Although docker can be run through rosetta, it's very unstable and unreliable. The only option is to use qemu emulation which is slow. Most docs take over 1minute to build this way.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.