From 6d14b01b36bc3c4a3517fcfa4826d227edd59776 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 13 Jan 2022 00:11:14 +0100 Subject: [PATCH] [INFRA] Simplify demo CSS watch configuration tailwindcss can now notify postcss to regenerate the css file when the index.html changes. This let us use the standard postcss watch mode and remove the hack we set up with chokidar. --- docs/contributors/demo-page-css.md | 6 +- package-lock.json | 304 ----------------------------- package.json | 2 - rollup.config.js | 2 +- 4 files changed, 3 insertions(+), 311 deletions(-) diff --git a/docs/contributors/demo-page-css.md b/docs/contributors/demo-page-css.md index 5e21e832ba..b6000ace70 100644 --- a/docs/contributors/demo-page-css.md +++ b/docs/contributors/demo-page-css.md @@ -4,10 +4,8 @@ The project demo page uses [tailwindcss](https://tailwindcss.com/docs). To process the CSS rules and get an output `tailwind.css` file, which is used in demo page: run: `npm run demo` -Sub job `demo:css` does the trick, it uses postcss. Feel free to preview config files: +The `demo:css` npm script does the trick, it uses postcss. Feel free to preview config files: - [postcss.config.js](postcss.config.js) - [tailwind.config.js](tailwind.config.js) -The Rollup build is updated to handle livereload, there are 2 scripts in [package.json](../../package.json) that permits that: \ -1. Build the output tailwind.css file: `demo:css` -2. Watch for the changes in html and styles.css. `watch:css` +The Rollup build handles the livereload and the html/css resources watch. diff --git a/package-lock.json b/package-lock.json index 1e6076658f..d8630d25c0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -30,7 +30,6 @@ "@typescript-eslint/parser": "^5.9.1", "asciidoctor": "^2.2.5", "autoprefixer": "^10.4.2", - "chokidar-cli": "^3.0.0", "clipboardy": "^3.0.0", "cross-env": "^7.0.3", "cssnano": "^5.0.15", @@ -3529,183 +3528,6 @@ "fsevents": "~2.3.2" } }, - "node_modules/chokidar-cli": { - "version": "3.0.0", - "dev": true, - "license": "MIT", - "dependencies": { - "chokidar": "^3.5.2", - "lodash.debounce": "^4.0.8", - "lodash.throttle": "^4.1.1", - "yargs": "^13.3.0" - }, - "bin": { - "chokidar": "index.js" - }, - "engines": { - "node": ">= 8.10.0" - } - }, - "node_modules/chokidar-cli/node_modules/ansi-regex": { - "version": "4.1.0", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=6" - } - }, - "node_modules/chokidar-cli/node_modules/ansi-styles": { - "version": "3.2.1", - "dev": true, - "license": "MIT", - "dependencies": { - "color-convert": "^1.9.0" - }, - "engines": { - "node": ">=4" - } - }, - "node_modules/chokidar-cli/node_modules/cliui": { - "version": "5.0.0", - "dev": true, - "license": "ISC", - "dependencies": { - "string-width": "^3.1.0", - "strip-ansi": "^5.2.0", - "wrap-ansi": "^5.1.0" - } - }, - "node_modules/chokidar-cli/node_modules/color-convert": { - "version": "1.9.3", - "dev": true, - "license": "MIT", - "dependencies": { - "color-name": "1.1.3" - } - }, - "node_modules/chokidar-cli/node_modules/color-name": { - "version": "1.1.3", - "dev": true, - "license": "MIT" - }, - "node_modules/chokidar-cli/node_modules/emoji-regex": { - "version": "7.0.3", - "dev": true, - "license": "MIT" - }, - "node_modules/chokidar-cli/node_modules/find-up": { - "version": "3.0.0", - "dev": true, - "license": "MIT", - "dependencies": { - "locate-path": "^3.0.0" - }, - "engines": { - "node": ">=6" - } - }, - "node_modules/chokidar-cli/node_modules/is-fullwidth-code-point": { - "version": "2.0.0", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=4" - } - }, - "node_modules/chokidar-cli/node_modules/locate-path": { - "version": "3.0.0", - "dev": true, - "license": "MIT", - "dependencies": { - "p-locate": "^3.0.0", - "path-exists": "^3.0.0" - }, - "engines": { - "node": ">=6" - } - }, - "node_modules/chokidar-cli/node_modules/p-locate": { - "version": "3.0.0", - "dev": true, - "license": "MIT", - "dependencies": { - "p-limit": "^2.0.0" - }, - "engines": { - "node": ">=6" - } - }, - "node_modules/chokidar-cli/node_modules/path-exists": { - "version": "3.0.0", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=4" - } - }, - "node_modules/chokidar-cli/node_modules/string-width": { - "version": "3.1.0", - "dev": true, - "license": "MIT", - "dependencies": { - "emoji-regex": "^7.0.1", - "is-fullwidth-code-point": "^2.0.0", - "strip-ansi": "^5.1.0" - }, - "engines": { - "node": ">=6" - } - }, - "node_modules/chokidar-cli/node_modules/strip-ansi": { - "version": "5.2.0", - "dev": true, - "license": "MIT", - "dependencies": { - "ansi-regex": "^4.1.0" - }, - "engines": { - "node": ">=6" - } - }, - "node_modules/chokidar-cli/node_modules/wrap-ansi": { - "version": "5.1.0", - "dev": true, - "license": "MIT", - "dependencies": { - "ansi-styles": "^3.2.0", - "string-width": "^3.0.0", - "strip-ansi": "^5.0.0" - }, - "engines": { - "node": ">=6" - } - }, - "node_modules/chokidar-cli/node_modules/yargs": { - "version": "13.3.2", - "dev": true, - "license": "MIT", - "dependencies": { - "cliui": "^5.0.0", - "find-up": "^3.0.0", - "get-caller-file": "^2.0.1", - "require-directory": "^2.1.1", - "require-main-filename": "^2.0.0", - "set-blocking": "^2.0.0", - "string-width": "^3.0.0", - "which-module": "^2.0.0", - "y18n": "^4.0.0", - "yargs-parser": "^13.1.2" - } - }, - "node_modules/chokidar-cli/node_modules/yargs-parser": { - "version": "13.1.2", - "dev": true, - "license": "ISC", - "dependencies": { - "camelcase": "^5.0.0", - "decamelize": "^1.2.0" - } - }, "node_modules/ci-info": { "version": "3.3.0", "dev": true, @@ -14590,132 +14412,6 @@ "readdirp": "~3.6.0" } }, - "chokidar-cli": { - "version": "3.0.0", - "dev": true, - "requires": { - "chokidar": "^3.5.2", - "lodash.debounce": "^4.0.8", - "lodash.throttle": "^4.1.1", - "yargs": "^13.3.0" - }, - "dependencies": { - "ansi-regex": { - "version": "4.1.0", - "dev": true - }, - "ansi-styles": { - "version": "3.2.1", - "dev": true, - "requires": { - "color-convert": "^1.9.0" - } - }, - "cliui": { - "version": "5.0.0", - "dev": true, - "requires": { - "string-width": "^3.1.0", - "strip-ansi": "^5.2.0", - "wrap-ansi": "^5.1.0" - } - }, - "color-convert": { - "version": "1.9.3", - "dev": true, - "requires": { - "color-name": "1.1.3" - } - }, - "color-name": { - "version": "1.1.3", - "dev": true - }, - "emoji-regex": { - "version": "7.0.3", - "dev": true - }, - "find-up": { - "version": "3.0.0", - "dev": true, - "requires": { - "locate-path": "^3.0.0" - } - }, - "is-fullwidth-code-point": { - "version": "2.0.0", - "dev": true - }, - "locate-path": { - "version": "3.0.0", - "dev": true, - "requires": { - "p-locate": "^3.0.0", - "path-exists": "^3.0.0" - } - }, - "p-locate": { - "version": "3.0.0", - "dev": true, - "requires": { - "p-limit": "^2.0.0" - } - }, - "path-exists": { - "version": "3.0.0", - "dev": true - }, - "string-width": { - "version": "3.1.0", - "dev": true, - "requires": { - "emoji-regex": "^7.0.1", - "is-fullwidth-code-point": "^2.0.0", - "strip-ansi": "^5.1.0" - } - }, - "strip-ansi": { - "version": "5.2.0", - "dev": true, - "requires": { - "ansi-regex": "^4.1.0" - } - }, - "wrap-ansi": { - "version": "5.1.0", - "dev": true, - "requires": { - "ansi-styles": "^3.2.0", - "string-width": "^3.0.0", - "strip-ansi": "^5.0.0" - } - }, - "yargs": { - "version": "13.3.2", - "dev": true, - "requires": { - "cliui": "^5.0.0", - "find-up": "^3.0.0", - "get-caller-file": "^2.0.1", - "require-directory": "^2.1.1", - "require-main-filename": "^2.0.0", - "set-blocking": "^2.0.0", - "string-width": "^3.0.0", - "which-module": "^2.0.0", - "y18n": "^4.0.0", - "yargs-parser": "^13.1.2" - } - }, - "yargs-parser": { - "version": "13.1.2", - "dev": true, - "requires": { - "camelcase": "^5.0.0", - "decamelize": "^1.2.0" - } - } - } - }, "ci-info": { "version": "3.3.0", "dev": true diff --git a/package.json b/package.json index e653796815..6d57940052 100644 --- a/package.json +++ b/package.json @@ -61,7 +61,6 @@ "docs:api": "typedoc --tsconfig ./tsconfig.typedoc.json src/bpmn-visualization.ts", "start": "rollup -c --silent --environment devMode:true", "watch": "rollup -cw --environment devLiveReloadMode:true", - "watch:css": "chokidar \"dev/public/static/css/styles.css\" \"dev/public/*.html\" --command \"npm run demo:css\" --verbose", "lint": "eslint \"*/**/*.{js,ts}\" NOTICE --max-warnings 0 --quiet --fix", "lint-check": "eslint \"*/**/*.{js,ts}\" NOTICE --max-warnings 0", "test": "run-s test:unit test:integration test:e2e", @@ -106,7 +105,6 @@ "@typescript-eslint/parser": "^5.9.1", "asciidoctor": "^2.2.5", "autoprefixer": "^10.4.2", - "chokidar-cli": "^3.0.0", "clipboardy": "^3.0.0", "cross-env": "^7.0.3", "cssnano": "^5.0.15", diff --git a/rollup.config.js b/rollup.config.js index 2241cb5968..139d344463 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -150,7 +150,7 @@ function pluginsForDevelopment() { if (devMode || demoMode) { plugins.push(execute('npm run demo:css', true)); // sync to ensure the execution is linked to the main rollup process if (devLiveReloadMode) { - plugins.push(execute('npm run watch:css')); + plugins.push(execute('npm run demo:css -- --watch --verbose')); } const copyTargets = [];