Search code examples
swagger-editor

Downloading swagger-documentation in the same style as displayed

I'm using the swagger-editor docker.

It produces, in the right column, a beautiful and functional interactive version of the documentation I'm writing in the right column.

I am trying to export such documentation but to no luck.

Is it possible to export an interactive, stand alone, documentation looking and working as the one shown in the right column?

Solution

  • The right-side panel of Swagger Editor is Swagger UI. You can download Swagger UI assets and host them on your own website.

    1. Download (or clone) the Swagger UI repository:
      https://github.com/swagger-api/swagger-ui

    2. Take the dist folder - it contains the static assets.

    3. Put your OpenAPI YAML/JSON file to the dist folder.

    4. In the dist\index.html file, change the url parameter to point to your YAML/JSON file:

            const ui = SwaggerUIBundle({
        url: "myapi.yaml",  // <----

    5. Put the files from the dist folder on your web server.

    It's also possible to embed Swagger UI into your existing web page, e.g. if you want to have your custom branded header and footer.


    See also: