newcity/tailwind-config-viewer repository overview

⁠Tailwind Config Viewer

This image creates a Docker container around the tailwind-config-viewer⁠ tool.

⁠Docker Configuration

You must map a local port to the container's port 3100:

ports:
  - "3100:3100"

You need to mount your custom tailwind.config.js file to /app/tailwind.config.js. If you do not, the viewer will load the default tailwind configuration, which is of limited use.

If your tailwind config file imports any other resources, make sure to mount them too.

⁠Plugins

This image comes bundled with the @tailwindcss/typography plugin. If your tailwind config requires additional plugins or npm dependencies, you need to add them to a package.json file and mount it at /app/config/package.json.

volumes:
  - ./.builder-config/tailwind.config.js:/app/tailwind.config.js
  - ./.builder-config/package.json:/app/config/package.json

⁠Sample docker-compose.yml

version: '3'

services:
  tailwind_config:
    build: ./docker/tailwind-config-viewer
    volumes:
      - ./tailwind.config.js:/app/tailwind.config.js
      - ./package.json:/app/config/package.json
    restart: on-failure
    ports:
      - "3100:3100"

⁠Sample package.json for extra dependencies

Your package file does not need to include a full NPM configuration. Only the dependencies or devDependencies section is required.

{
  "devDependencies": {
    "@tailwindcss/custom-forms": "^0.2.1"
  }
}