Simple CLI for running grafana in dev env

package.json

@@ -17,7 +17,9 @@
     "@babel/preset-react": "^7.0.0",
     "@babel/preset-typescript": "^7.1.0",
     "@rtsao/plugin-proposal-class-properties": "^7.0.1-patch.1",
+    "@types/chalk": "^2.2.0",
     "@types/classnames": "^2.2.6",
+    "@types/commander": "^2.12.2",
     "@types/d3": "^4.10.1",
     "@types/enzyme": "^3.1.13",
     "@types/jest": "^23.3.2",
@@ -36,6 +38,7 @@
     "babel-jest": "^23.6.0",
     "babel-loader": "^8.0.4",
     "babel-plugin-angularjs-annotate": "^0.9.0",
+    "chalk": "^2.4.2",
     "clean-webpack-plugin": "^0.1.19",
     "concurrently": "^4.1.0",
     "css-loader": "^0.28.7",
@@ -114,7 +117,9 @@
   },
   "scripts": {
     "dev": "webpack --progress --colors --mode development --config scripts/webpack/webpack.dev.js",
-    "start": "node ./scripts/cli/start.js",
+    "start": "ts-node --project ./scripts/cli/tsconfig.json ./scripts/cli/index.ts --theme",
+    "start:hot": "ts-node --project ./scripts/cli/tsconfig.json ./scripts/cli/index.ts --hot --theme",
+    "start:ignoreTheme": "ts-node --project ./scripts/cli/tsconfig.json ./scripts/cli/index.ts --hot",
     "watch": "webpack --progress --colors --watch --mode development --config scripts/webpack/webpack.dev.js",
     "build": "grunt build",
     "test": "grunt test",

scripts/cli/index.ts

@@ -0,0 +1,22 @@
+import program from 'commander';
+import { startTask } from './start';
+import chalk from 'chalk';
+
+program
+  .option('-h, --hot', 'Runs front-end with hot reload enabled')
+  .option('-t, --theme', 'Watches for theme changes and regenerates variables.scss files')
+  .option('-d, --depreciate <scripts>', 'Inform about npm script deprecation', v => v.split(','))
+  .parse(process.argv);
+
+if (program.depreciate && program.depreciate.length === 2) {
+  console.log(
+    chalk.yellow.bold(
+      `[NPM script depreciation] ${program.depreciate[0]} is deprecated! Use ${program.depreciate[1]} instead!`
+    )
+  );
+}
+
+startTask({
+  watchThemes: !!program.theme,
+  hot: !!program.hot,
+});

scripts/cli/start.js

@@ -1,23 +0,0 @@
-const concurrently = require('concurrently');
-
-const startTask = async () => {
-  try {
-    const res = await concurrently([
-      {
-        command: 'nodemon -e ts -w ./packages/grafana-ui/src/themes -x yarn run themes:generate',
-        name: 'SASS variables generator',
-      },
-      {
-        command: 'webpack-dev-server --progress --colors --mode development --config scripts/webpack/webpack.hot.js',
-        name: 'Dev server',
-      },
-    ], {
-      killOthers: ['failure', 'failure'],
-  });
-  } catch (e) {
-    console.error(e);
-    process.exit(1);
-  }
-};
-
-startTask();

scripts/cli/start.ts

@@ -0,0 +1,32 @@
+const concurrently = require('concurrently');
+
+export const startTask = async ({ watchThemes, hot }: { watchThemes: boolean; hot: boolean }) => {
+  const jobs = [];
+  if (watchThemes) {
+    jobs.push({
+      command: 'nodemon -e ts -w ./packages/grafana-ui/src/themes -x yarn run themes:generate',
+      name: 'SASS variables generator',
+    });
+  }
+
+  if (!hot) {
+    jobs.push({
+      command: 'webpack --progress --colors --watch --mode development --config scripts/webpack/webpack.dev.js',
+      name: 'Webpack',
+    });
+  } else {
+    jobs.push({
+      command: 'webpack-dev-server --progress --colors --mode development --config scripts/webpack/webpack.hot.js',
+      name: 'Dev server',
+    });
+  }
+
+  try {
+    await concurrently(jobs, {
+      killOthers: ['failure', 'failure'],
+    });
+  } catch (e) {
+    console.error(e);
+    process.exit(1);
+  }
+};

yarn.lock

@@ -1501,6 +1501,13 @@
     react-input-autosize "^2.2.1"
     react-transition-group "^2.2.1"
 
+"@types/chalk@^2.2.0":
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/@types/chalk/-/chalk-2.2.0.tgz#b7f6e446f4511029ee8e3f43075fb5b73fbaa0ba"
+  integrity sha512-1zzPV9FDe1I/WHhRkf9SNgqtRJWZqrBWgu7JGveuHmmyR9CnAPCie2N/x+iHrgnpYBIcCJWHBoMRv2TRWktsvw==
+  dependencies:
+    chalk "*"
+
 "@types/cheerio@*":
   version "0.22.10"
   resolved "https://registry.yarnpkg.com/@types/cheerio/-/cheerio-0.22.10.tgz#780d552467824be4a241b29510a7873a7432c4a6"
@@ -1511,6 +1518,13 @@
   resolved "https://registry.yarnpkg.com/@types/classnames/-/classnames-2.2.7.tgz#fb68cc9be8487e6ea5b13700e759bfbab7e0fefd"
   integrity sha512-rzOhiQ55WzAiFgXRtitP/ZUT8iVNyllEpylJ5zHzR4vArUvMB39GTk+Zon/uAM0JxEFAWnwsxC2gH8s+tZ3Myg==
 
+"@types/commander@^2.12.2":
+  version "2.12.2"
+  resolved "https://registry.yarnpkg.com/@types/commander/-/commander-2.12.2.tgz#183041a23842d4281478fa5d23c5ca78e6fd08ae"
+  integrity sha512-0QEFiR8ljcHp9bAbWxecjVRuAMr16ivPiGOw6KFQBVrVd0RQIcM3xKdRisH2EDWgVWujiYtHwhSkSUoAAGzH7Q==
+  dependencies:
+    commander "*"
+
 "@types/d3-array@*":
   version "1.2.5"
   resolved "https://registry.yarnpkg.com/@types/d3-array/-/d3-array-1.2.5.tgz#7f87eccfe53396d48700294a518c379be14c8254"
@@ -4596,6 +4610,15 @@ center-align@^0.1.1:
     align-text "^0.1.3"
     lazy-cache "^1.0.3"
 
+chalk@*, chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.3.0, chalk@^2.3.1, chalk@^2.3.2, chalk@^2.4.1, chalk@^2.4.2:
+  version "2.4.2"
+  resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424"
+  integrity sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==
+  dependencies:
+    ansi-styles "^3.2.1"
+    escape-string-regexp "^1.0.5"
+    supports-color "^5.3.0"
+
 chalk@2.4.1:
   version "2.4.1"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.1.tgz#18c49ab16a037b6eb0152cc83e3471338215b66e"
@@ -4616,15 +4639,6 @@ chalk@^1.0.0, chalk@^1.1.1, chalk@^1.1.3, chalk@~1.1.1:
     strip-ansi "^3.0.0"
     supports-color "^2.0.0"
 
-chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.3.0, chalk@^2.3.1, chalk@^2.3.2, chalk@^2.4.1, chalk@^2.4.2:
-  version "2.4.2"
-  resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424"
-  integrity sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==
-  dependencies:
-    ansi-styles "^3.2.1"
-    escape-string-regexp "^1.0.5"
-    supports-color "^5.3.0"
-
 chalk@~0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-0.4.0.tgz#5199a3ddcd0c1efe23bc08c1b027b06176e0c64f"
@@ -5102,7 +5116,7 @@ comma-separated-tokens@^1.0.0:
   dependencies:
     trim "0.0.1"
 
-commander@2, commander@^2.12.1, commander@^2.13.0, commander@^2.14.1, commander@^2.19.0, commander@^2.8.1, commander@^2.9.0:
+commander@*, commander@2, commander@^2.12.1, commander@^2.13.0, commander@^2.14.1, commander@^2.19.0, commander@^2.8.1, commander@^2.9.0:
   version "2.19.0"
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.19.0.tgz#f6198aa84e5b83c46054b94ddedbfed5ee9ff12a"
   integrity sha512-6tvAOO+D6OENvRAh524Dh9jcfKTYDQAqvqezbCW82xj5X0pSrcpxtvRKHLG0yBY6SD7PSDrJaj+0AiOcKVd1Xg==