diff --git a/.dockerignore b/.dockerignore index b477f4cc..a16bb106 100644 --- a/.dockerignore +++ b/.dockerignore @@ -2,4 +2,13 @@ **/.git **/.svelte-kit **/dist -**/docs \ No newline at end of file +**/docs + +**/.github +**/.husky +**/.vscode + +Dockerfile +.dockerignore +docker-compose.yml +README.md \ No newline at end of file diff --git a/.github/workflows/docker-publish.yml b/.github/workflows/docker-publish.yml index d57fc48a..ebc0b917 100644 --- a/.github/workflows/docker-publish.yml +++ b/.github/workflows/docker-publish.yml @@ -2,13 +2,11 @@ name: Docker on: push: - # Publish `master` as Docker `latest` image. branches: + # Publish `master` as Docker `latest` image. - master - - # Publish `v1.2.3` tags as releases. - tags: - - v* + # Publish `develop` as Docker `nightly` image. + - develop # Run tests for all PRs to master and develop. pull_request: @@ -16,54 +14,35 @@ on: - master - develop -env: - IMAGE_NAME: mermaid-live-editor - jobs: - test: + docker: runs-on: ubuntu-latest - steps: - - uses: actions/checkout@v3 - - - name: Run tests + - uses: actions/checkout@v4 + - uses: docker/setup-qemu-action@v3 + - uses: docker/setup-buildx-action@v3 + - name: Login to GitHub Container Registry + if: github.event_name != 'pull_request' + uses: docker/login-action@v3 + with: + registry: ghcr.io + username: ${{ github.repository_owner }} + password: ${{ secrets.GITHUB_TOKEN }} + - name: Get release version run: | - docker build . --file Dockerfile - - push: - # Ensure test job passes before pushing image. - needs: test - - runs-on: ubuntu-latest - if: github.event_name == 'push' - - steps: - - uses: actions/checkout@v3 - - - name: Build image - run: docker build . --file Dockerfile --tag $IMAGE_NAME - - - name: Log into registry - run: echo "${{ secrets.GITHUB_TOKEN }}" | docker login ghcr.io -u ${{ github.actor }} --password-stdin - - - name: Push image - run: | - IMAGE_ID=ghcr.io/${{ github.repository_owner }}/$IMAGE_NAME - - # Change all uppercase to lowercase - IMAGE_ID=$(echo $IMAGE_ID | tr '[A-Z]' '[a-z]') - - # Strip git ref prefix from version - VERSION=$(echo "${{ github.ref }}" | sed -e 's,.*/\(.*\),\1,') - - # Strip "v" prefix from tag name - [[ "${{ github.ref }}" == "refs/tags/"* ]] && VERSION=$(echo $VERSION | sed -e 's/^v//') - - # Use Docker `latest` tag convention - [ "$VERSION" == "master" ] && VERSION=latest - - echo IMAGE_ID=$IMAGE_ID - echo VERSION=$VERSION - - docker tag $IMAGE_NAME $IMAGE_ID:$VERSION - docker push $IMAGE_ID:$VERSION + RELEASE_VERSION=$([ "${{ github.ref_name }}" = "master" ] && echo "latest" || echo "nightly") + echo "RELEASE_VERSION=${RELEASE_VERSION}" >> "${GITHUB_ENV}" + - uses: docker/metadata-action@v5 + id: meta + with: + images: ghcr.io/${{ github.repository }} + tags: | + type=raw,value=${{ env.RELEASE_VERSION }} + - uses: docker/build-push-action@v5 + with: + context: . + target: mermaid + push: ${{ github.event_name == 'push' }} + pull: true + tags: ${{ steps.meta.outputs.tags }} + labels: ${{ steps.meta.outputs.labels }} diff --git a/Dockerfile b/Dockerfile index 879b9aa1..c8ab6c84 100644 --- a/Dockerfile +++ b/Dockerfile @@ -1,17 +1,31 @@ -# Two-stage docker container for mermaid-js/mermaid-live-editor -# Build : docker build -t mermaid-js/mermaid-live-editor . -# Run : docker run --name mermaid-live-editor --publish 8080:8080 mermaid-js/mermaid-live-editor -# Start : docker start mermaid-live-editor -# Use webbrowser : http://localhost:8080 -# Stop : press ctrl + c -# or -# docker stop mermaid-live-editor -FROM node:18.18.2 as mermaid-live-editor-builder -COPY --chown=node:node . /home -WORKDIR /home +FROM docker.io/library/node:20-alpine3.18 AS mermaid-live-editor-dependencies + +RUN apk --no-cache add build-base git python3 && \ + rm -rf /var/cache/apk/* + +RUN yarn global add node-gyp + +WORKDIR /app + +COPY ./package.json . +COPY ./yarn.lock . + RUN yarn install + +FROM mermaid-live-editor-dependencies AS mermaid-live-editor-builder + +ARG MERMAID_RENDERER_URL +ARG MERMAID_KROKI_RENDERER_URL + +COPY . ./ + RUN yarn build -FROM nginxinc/nginx-unprivileged:alpine as mermaid-live-editor-runner +FROM mermaid-live-editor-builder AS mermaid-dev + +ENTRYPOINT ["yarn", "dev"] + +FROM nginx:1.25-alpine3.18 AS mermaid + COPY ./nginx.conf /etc/nginx/conf.d/default.conf -COPY --from=mermaid-live-editor-builder --chown=nginx:nginx /home/docs /usr/share/nginx/html +COPY --from=mermaid-live-editor-builder /app/docs /usr/share/nginx/html diff --git a/Dockerfile.dev b/Dockerfile.dev deleted file mode 100644 index 5e36fd41..00000000 --- a/Dockerfile.dev +++ /dev/null @@ -1,8 +0,0 @@ -FROM node:18.18.2 -WORKDIR /app -COPY package.json . -COPY yarn.lock . -RUN npm install -COPY . . -RUN ls -CMD ["yarn", "dev"] diff --git a/README.md b/README.md index cf042bd3..5c18f655 100644 --- a/README.md +++ b/README.md @@ -29,12 +29,12 @@ docker run --platform linux/amd64 --publish 8000:8080 ghcr.io/mermaid-js/mermaid ### To configure renderer URL -When building, Set the Environment variable MERMAID_RENDERER_URL to the rendering service. +When building set the MERMAID_RENDERER_URL build argument to the rendering service. Default is `https://mermaid.ink` ### To configure Kroki Instance URL -When building, Set the Environment variable MERMAID_KROKI_RENDERER_URL to your Kroki instance. +When building set the MERMAID_KROKI_RENDERER_URL build argument to your Kroki instance. Default is `https://kroki.io` ### Development @@ -45,6 +45,28 @@ docker compose up --build Then open http://localhost:3000 +### Building and running images locally + +#### Build + +```bash +docker build -t mermaid-js/mermaid-live-editor . +``` + +#### Run + +```bash +docker run --detach --name mermaid-live-editor --publish 8080:8080 mermaid-js/mermaid-live-editor +``` + +Visit: + +#### Stop + +```bash +docker stop mermaid-live-editor +``` + ## Setup Below link will help you making a copy of the repository in your local system. diff --git a/docker-compose.yml b/docker-compose.yml index 68a47332..c4649256 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -3,7 +3,7 @@ services: mermaid: build: context: . - dockerfile: Dockerfile.dev + target: mermaid-dev volumes: - ./src:/app/src ports: diff --git a/package.json b/package.json index 2d414d05..809976e8 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,7 @@ "devDependencies": { "@cypress/snapshot": "2.1.7", "@sveltejs/adapter-static": "2.0.3", - "@sveltejs/kit": "1.27.3", + "@sveltejs/kit": "1.27.6", "@testing-library/jest-dom": "5.17.0", "@testing-library/svelte": "3.2.2", "@types/pako": "2.0.3", @@ -38,8 +38,8 @@ "cssnano": "^6.0.0", "cy-verify-downloads": "0.2.2", "cypress": "12.17.4", - "cypress-localstorage-commands": "2.2.4", - "eslint": "8.53.0", + "cypress-localstorage-commands": "2.2.5", + "eslint": "8.54.0", "eslint-config-prettier": "8.10.0", "eslint-plugin-cypress": "2.15.1", "eslint-plugin-es": "4.1.0", @@ -56,15 +56,15 @@ "lint-staged": "13.3.0", "node-html-parser": "^6.1.5", "postcss": "^8.4.21", - "postcss-load-config": "4.0.1", + "postcss-load-config": "4.0.2", "prettier": "2.8.8", "prettier-plugin-svelte": "^2.10.0", "svelte": "3.59.2", - "svelte-preprocess": "5.0.4", + "svelte-preprocess": "5.1.1", "tailwindcss": "^3.3.1", "tslib": "^2.5.0", - "typescript": "5.2.2", - "vite": "^4.3.9", + "typescript": "5.3.2", + "vite": "^4.5.1", "vitest": "^0.34.0" }, "dependencies": { @@ -88,7 +88,7 @@ }, "volta": { "node": "18.18.2", - "yarn": "1.22.19" + "yarn": "1.22.21" }, "engines": { "node": ">=16.7" diff --git a/src/app.html b/src/app.html index ae3fdb02..e2469685 100644 --- a/src/app.html +++ b/src/app.html @@ -17,8 +17,8 @@ %sveltekit.head% diff --git a/src/env.d.ts b/src/env.d.ts index 8188f7aa..3bdd9740 100644 --- a/src/env.d.ts +++ b/src/env.d.ts @@ -3,9 +3,6 @@ interface ImportMetaEnv { readonly MERMAID_RENDERER_URL?: string; readonly MERMAID_KROKI_RENDERER_URL?: string; - readonly MERMAID_CDN_URL?: string; - readonly MERMAID_BASE_URL?: string; - readonly MERMAID_LOCAL?: boolean; // more env variables... } diff --git a/src/lib/components/Navbar.svelte b/src/lib/components/Navbar.svelte index 51da006b..2c54e9da 100644 --- a/src/lib/components/Navbar.svelte +++ b/src/lib/components/Navbar.svelte @@ -1,6 +1,6 @@ +{#if activePromotion} +
+
+ +
+ +
+{/if} +