add intermediate proxy script for Vue CLI bin that fixes typescript error linesvue-typescript-error-lines

2 files changed, 59 insertions, 4 deletions

diff --git a/plugins/CoreVue/Commands/Build.php b/plugins/CoreVue/Commands/Build.php
index 5242c97d8b..8fed4035b9 100644
--- a/plugins/CoreVue/Commands/Build.php
+++ b/plugins/CoreVue/Commands/Build.php
@@ -111,7 +111,7 @@ class Build extends ConsoleCommand
     private function watch($plugins, $printBuildCommand, OutputInterface $output)
     {
         $commandSingle = "BROWSERSLIST_IGNORE_OLD_DATA=1 FORCE_COLOR=1 MATOMO_CURRENT_PLUGIN=%1\$s "
-            . self::getVueCliServiceBin() . ' build --mode=development --target lib --name '
+            . 'node ' . self::getVueCliServiceProxyBin() . ' build --mode=development --target lib --name '
             . "%1\$s --filename=%1\$s.development --no-clean ./plugins/%1\$s/vue/src/index.ts --dest ./plugins/%1\$s/vue/dist --watch &";
 
         $command = '';
@@ -123,13 +123,14 @@ class Build extends ConsoleCommand
             $output->writeln("<comment>$command</comment>");
             return;
         }
-        passthru($command);
+
+        passthru($commandSingle);
     }
 
     private function buildFiles(OutputInterface $output, $plugin, $printBuildCommand)
     {
         $command = "BROWSERSLIST_IGNORE_OLD_DATA=1 FORCE_COLOR=1 MATOMO_CURRENT_PLUGIN=$plugin "
-            . self::getVueCliServiceBin() . ' build --target lib --name ' . $plugin
+            . 'node ' . self::getVueCliServiceProxyBin() . ' build --target lib --name ' . $plugin
             . " ./plugins/$plugin/vue/src/index.ts --dest ./plugins/$plugin/vue/dist";
 
         if ($printBuildCommand) {
@@ -141,7 +142,7 @@ class Build extends ConsoleCommand
 
         $output->writeln("<comment>Building $plugin...</comment>");
         if ($output->getVerbosity() >= OutputInterface::VERBOSITY_VERBOSE) {
-            passthru($command, $returnCode);
+            passthru($command);
         } else {
             exec($command, $cmdOutput, $returnCode);
             if ($returnCode != 0
@@ -206,6 +207,11 @@ class Build extends ConsoleCommand
         return PIWIK_INCLUDE_PATH . "/node_modules/@vue/cli-service/bin/vue-cli-service.js";
     }
 
+    public static function getVueCliServiceProxyBin()
+    {
+        return PIWIK_INCLUDE_PATH . "/plugins/CoreVue/scripts/cli-service-proxy.js";
+    }
+
     public static function checkVueCliServiceAvailable()
     {
         $vueCliBin = self::getVueCliServiceBin();
diff --git a/plugins/CoreVue/scripts/cli-service-proxy.js b/plugins/CoreVue/scripts/cli-service-proxy.js
new file mode 100644
index 0000000000..e86ddf8d22
--- /dev/null
+++ b/plugins/CoreVue/scripts/cli-service-proxy.js
@@ -0,0 +1,49 @@
+/*!
+ * Matomo - free/libre analytics platform
+ *
+ * @link https://matomo.org
+ * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+ */
+
+const fs = require('fs');
+const readline = require('readline');
+
+const middlePositions = {};
+function getMiddlePosition(file) {
+  if (!middlePositions[file] && fs.existsSync(file)) {
+    const fileContents = fs.readFileSync(file).toString('utf-8');
+    const scriptIndex = fileContents.indexOf('<script lang="ts"');
+    if (scriptIndex !== -1) {
+      middlePositions[file] = (fileContents.substring(0, scriptIndex).match(/\n/g) || []).length;
+    }
+  }
+  return middlePositions[file];
+}
+
+function interceptWrite(originalWrite) {
+  return function (chunk, encoding, cb) {
+    if (typeof chunk === 'string' && /tsl.*?ERROR/.test(chunk)) {
+      chunk = chunk.replace(/(\/(?:.(?!\())+.)\((\d+)(,\d+\))/g, (m, file, line, rest) => {
+        if (/.vue.ts$/.test(file)) {
+          file = file.substring(0, file.length - 3);
+          const middleLine = getMiddlePosition(file);
+          return `${file}(${middleLine + parseInt(line, 10)}${rest}`;
+        }
+        return m;
+      });
+    }
+
+    return originalWrite.call(this, chunk, encoding, cb);
+  };
+}
+
+process.stdout.clearLine = readline.clearLine.bind(null, process.stdout);
+process.stdout.cursorTo = readline.cursorTo.bind(null, process.stdout);
+
+process.stderr.clearLine = readline.clearLine.bind(null, process.stderr);
+process.stderr.cursorTo = readline.cursorTo.bind(null, process.stderr);
+
+process.stdout.write = interceptWrite(process.stdout.write);
+process.stderr.write = interceptWrite(process.stderr.write);
+
+require('../../../node_modules/@vue/cli-service/bin/vue-cli-service.js');