From b3a11965e08f4a10e52715e91ad2f3b37a7e408b Mon Sep 17 00:00:00 2001 From: Young-Zen <40934357+Young-Zen@users.noreply.github.com> Date: Sun, 12 Nov 2023 16:53:11 +0800 Subject: [PATCH] Fix: include monaco sources into bundle (#3796) * Fix: include monaco sources into bundle --- .gitignore | 1 + docker/README.md | 4 ++-- docker/server/Dockerfile | 4 +++- docker/ui/Dockerfile | 5 ++++- ui/package.json | 3 ++- ui/src/App.jsx | 6 ++++++ ui/yarn.lock | 24 ++++++++++++++---------- 7 files changed, 32 insertions(+), 15 deletions(-) diff --git a/.gitignore b/.gitignore index 6bf71b0ef6..95729213ae 100644 --- a/.gitignore +++ b/.gitignore @@ -23,6 +23,7 @@ buildscan.log # JS & UI Related node_modules /ui/build +/ui/public/monaco-editor # publishing secrets secrets/signing-key diff --git a/docker/README.md b/docker/README.md index b45b2d9bc6..e19a916ee0 100644 --- a/docker/README.md +++ b/docker/README.md @@ -11,7 +11,7 @@ Conductor server with support for the following backend: ### Docker File for Server and UI -[Docker Image Source for Server with UI](docker/server/DockerFile) +[Docker Image Source for Server with UI](server/Dockerfile) ### Configuration Guide for Conductor Server Conductor uses a persistent store for managing state. @@ -48,4 +48,4 @@ TODO: Link to the helm charts |--------------------------------------------------------------|----------------------------| | [docker-compose.yaml](docker-compose.yaml) | Redis + Elasticsearch 7 | | [docker-compose-postgres.yaml](docker-compose-postgres.yaml) | Postgres + Elasticsearch 7 | -| [docker-compose-postgres.yaml](docker-compose-mysql.yaml) | Mysql + Elasticsearch 7 | +| [docker-compose-mysql.yaml](docker-compose-mysql.yaml) | Mysql + Elasticsearch 7 | diff --git a/docker/server/Dockerfile b/docker/server/Dockerfile index ab6b099b50..793cb830ae 100644 --- a/docker/server/Dockerfile +++ b/docker/server/Dockerfile @@ -20,7 +20,9 @@ RUN apk add --update nodejs npm yarn COPY . /conductor WORKDIR /conductor/ui -RUN yarn install && yarn build +# Include monaco sources into bundle (instead of using CDN) +ENV REACT_APP_MONACO_EDITOR_USING_CDN=false +RUN yarn install && cp -r node_modules/monaco-editor public/ && yarn build RUN ls -ltr RUN echo "Done building UI" diff --git a/docker/ui/Dockerfile b/docker/ui/Dockerfile index b7967b9a00..5762f7d1ff 100644 --- a/docker/ui/Dockerfile +++ b/docker/ui/Dockerfile @@ -16,10 +16,13 @@ WORKDIR /usr/src/app COPY ./ui/package.json ./ # Installs all node packages. Cached unless package.json changes -RUN yarn install +RUN yarn install && mkdir -p public && cp -r node_modules/monaco-editor public/ # Copies everything else over to Docker environment # node_modules excluded in .dockerignore. COPY ./ui . +# Include monaco sources into bundle (instead of using CDN) +ENV REACT_APP_MONACO_EDITOR_USING_CDN=false + CMD [ "yarn", "start" ] diff --git a/ui/package.json b/ui/package.json index ac64a7d716..33b909bb13 100644 --- a/ui/package.json +++ b/ui/package.json @@ -6,7 +6,7 @@ "@material-ui/icons": "^4.11.2", "@material-ui/lab": "^4.0.0-alpha.60", "@material-ui/styles": "^4.11.4", - "@monaco-editor/react": "^4.3.1", + "@monaco-editor/react": "^4.4.0", "clsx": "^1.1.1", "cronstrue": "^1.72.0", "d3": "^6.2.0", @@ -18,6 +18,7 @@ "json-bigint-string": "^1.0.0", "lodash": "^4.17.20", "moment": "^2.29.2", + "monaco-editor": "^0.44.0", "node-forge": "^1.3.0", "parse-svg-path": "^0.1.2", "prop-types": "^15.7.2", diff --git a/ui/src/App.jsx b/ui/src/App.jsx index 512065581e..64292db5ab 100644 --- a/ui/src/App.jsx +++ b/ui/src/App.jsx @@ -2,6 +2,7 @@ import React from "react"; import { Route, Switch } from "react-router-dom"; import { makeStyles } from "@material-ui/styles"; +import { loader } from '@monaco-editor/react'; import { Button, AppBar, Toolbar } from "@material-ui/core"; import AppLogo from "./plugins/AppLogo"; import NavLink from "./components/NavLink"; @@ -132,3 +133,8 @@ export default function App() { ); } + +if (process.env.REACT_APP_MONACO_EDITOR_USING_CDN === "false") { + // Change the source of the monaco files, see https://github.com/suren-atoyan/monaco-react/issues/168#issuecomment-762336713 + loader.config({ paths: { vs: '/monaco-editor/min/vs' } }); +} diff --git a/ui/yarn.lock b/ui/yarn.lock index 6d4df6a9f2..43d8cb9222 100644 --- a/ui/yarn.lock +++ b/ui/yarn.lock @@ -1678,20 +1678,19 @@ prop-types "^15.7.2" react-is "^16.8.0 || ^17.0.0" -"@monaco-editor/loader@^1.3.2": - version "1.3.2" - resolved "https://registry.yarnpkg.com/@monaco-editor/loader/-/loader-1.3.2.tgz#04effbb87052d19cd7d3c9d81c0635490f9bb6d8" - integrity sha512-BTDbpHl3e47r3AAtpfVFTlAi7WXv4UQ/xZmz8atKl4q7epQV5e7+JbigFDViWF71VBi4IIBdcWP57Hj+OWuc9g== +"@monaco-editor/loader@^1.4.0": + version "1.4.0" + resolved "https://registry.yarnpkg.com/@monaco-editor/loader/-/loader-1.4.0.tgz#f08227057331ec890fa1e903912a5b711a2ad558" + integrity sha512-00ioBig0x642hytVspPl7DbQyaSWRaolYie/UFNjoTdvoKPzo6xrXLhTk9ixgIKcLH5b5vDOjVNiGyY+uDCUlg== dependencies: state-local "^1.0.6" -"@monaco-editor/react@^4.3.1": - version "4.4.5" - resolved "https://registry.yarnpkg.com/@monaco-editor/react/-/react-4.4.5.tgz#beabe491efeb2457441a00d1c7651c653697f65b" - integrity sha512-IImtzU7sRc66OOaQVCG+5PFHkSWnnhrUWGBuH6zNmH2h0YgmAhcjHZQc/6MY9JWEbUtVF1WPBMJ9u1XuFbRrVA== +"@monaco-editor/react@^4.4.0": + version "4.6.0" + resolved "https://registry.yarnpkg.com/@monaco-editor/react/-/react-4.6.0.tgz#bcc68671e358a21c3814566b865a54b191e24119" + integrity sha512-RFkU9/i7cN2bsq/iTkurMWOEErmYcY6JiQI3Jn+WeR/FGISH8JbHERjpS9oRuSOPvDMJI0Z8nJeKkbOs9sBYQw== dependencies: - "@monaco-editor/loader" "^1.3.2" - prop-types "^15.7.2" + "@monaco-editor/loader" "^1.4.0" "@nodelib/fs.scandir@2.1.5": version "2.1.5" @@ -7966,6 +7965,11 @@ moment@^2.29.2: resolved "https://registry.yarnpkg.com/moment/-/moment-2.29.4.tgz#3dbe052889fe7c1b2ed966fcb3a77328964ef108" integrity sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w== +monaco-editor@^0.44.0: + version "0.44.0" + resolved "https://registry.yarnpkg.com/monaco-editor/-/monaco-editor-0.44.0.tgz#3c0fe3655923bbf7dd647057302070b5095b6c59" + integrity sha512-5SmjNStN6bSuSE5WPT2ZV+iYn1/yI9sd4Igtk23ChvqB7kDk9lZbB9F5frsuvpB+2njdIeGGFf2G4gbE6rCC9Q== + ms@2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"