From 8a367f0520f3e1ea592ac0bdcf292cada6e44d1e Mon Sep 17 00:00:00 2001
From: An Phan <me@phanan.net>
Date: Wed, 1 May 2019 22:38:24 +0200
Subject: [PATCH 1/2] chore: better upgrade messages

---
 packages/@vue/cli/lib/util/clearConsole.js | 16 +++++++++++-----
 packages/@vue/cli/package.json             |  1 +
 2 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/packages/@vue/cli/lib/util/clearConsole.js b/packages/@vue/cli/lib/util/clearConsole.js
index a9fa00a5fb..83ce087321 100644
--- a/packages/@vue/cli/lib/util/clearConsole.js
+++ b/packages/@vue/cli/lib/util/clearConsole.js
@@ -16,12 +16,18 @@ exports.generateTitle = async function (checkUpdate) {
   }
   if (checkUpdate && semver.gt(latest, current)) {
     if (process.env.VUE_CLI_API_MODE) {
-      title += chalk.green(` 🌟️ Update available: ${latest}`)
+      title += chalk.green(` 🌟️ New version available: ${latest}`)
     } else {
-      title += chalk.green(`
-┌────────────────────${`─`.repeat(latest.length)}──┐
-│  Update available: ${latest}  │
-└────────────────────${`─`.repeat(latest.length)}──┘`)
+      const upgradeMessage = `New version available ${chalk.magenta(current)} → ${chalk.green(latest)}\n` +
+        `Run ${chalk.yellow(`npm i -g ${require('../../package.json').name}`)} to update!`
+      const upgradeBox = require('boxen')(upgradeMessage, {
+        align: 'center',
+        borderColor: 'green',
+        dimBorder: true,
+        padding: 1
+      })
+
+      title += `\n${upgradeBox}\n`
     }
   }
 
diff --git a/packages/@vue/cli/package.json b/packages/@vue/cli/package.json
index 6013451a8c..f5596058bf 100644
--- a/packages/@vue/cli/package.json
+++ b/packages/@vue/cli/package.json
@@ -28,6 +28,7 @@
     "@vue/cli-ui": "^4.0.0-alpha.0",
     "@vue/cli-ui-addon-webpack": "^4.0.0-alpha.0",
     "@vue/cli-ui-addon-widgets": "^4.0.0-alpha.0",
+    "boxen": "^3.2.0",
     "chalk": "^2.4.1",
     "cmd-shim": "^2.0.2",
     "commander": "^2.20.0",

From 9af329e5f202e044c3b7c5d4cac9f658386813b4 Mon Sep 17 00:00:00 2001
From: Haoqun Jiang <haoqunjiang@gmail.com>
Date: Fri, 11 Oct 2019 15:19:24 +0800
Subject: [PATCH 2/2] feat: try to find the right command to update

---
 packages/@vue/cli/lib/util/clearConsole.js | 41 ++++++++++++++++++++--
 1 file changed, 38 insertions(+), 3 deletions(-)

diff --git a/packages/@vue/cli/lib/util/clearConsole.js b/packages/@vue/cli/lib/util/clearConsole.js
index 83ce087321..10c3632835 100644
--- a/packages/@vue/cli/lib/util/clearConsole.js
+++ b/packages/@vue/cli/lib/util/clearConsole.js
@@ -1,7 +1,29 @@
 const chalk = require('chalk')
+const execa = require('execa')
 const semver = require('semver')
 const getVersions = require('./getVersions')
-const { clearConsole } = require('@vue/cli-shared-utils')
+const { clearConsole, hasYarn, hasPnpm3OrLater } = require('@vue/cli-shared-utils')
+
+async function getInstallationCommand () {
+  if (hasYarn()) {
+    const { stdout: yarnGlobalDir } = await execa('yarn', ['global', 'dir'])
+    if (__dirname.includes(yarnGlobalDir)) {
+      return 'yarn global add'
+    }
+  }
+
+  if (hasPnpm3OrLater()) {
+    const { stdout: pnpmGlobalPrefix } = await execa('pnpm', ['config', 'get', 'prefix'])
+    if (__dirname.includes(pnpmGlobalPrefix) && __dirname.includes('pnpm-global')) {
+      return `pnpm i -g`
+    }
+  }
+
+  const { stdout: npmGlobalPrefix } = await execa('npm', ['config', 'get', 'prefix'])
+  if (__dirname.includes(npmGlobalPrefix)) {
+    return `npm i -g`
+  }
+}
 
 exports.generateTitle = async function (checkUpdate) {
   const { current, latest } = await getVersions()
@@ -18,8 +40,21 @@ exports.generateTitle = async function (checkUpdate) {
     if (process.env.VUE_CLI_API_MODE) {
       title += chalk.green(` 🌟️ New version available: ${latest}`)
     } else {
-      const upgradeMessage = `New version available ${chalk.magenta(current)} → ${chalk.green(latest)}\n` +
-        `Run ${chalk.yellow(`npm i -g ${require('../../package.json').name}`)} to update!`
+      let upgradeMessage = `New version available ${chalk.magenta(current)} → ${chalk.green(latest)}`
+
+      try {
+        const command = await getInstallationCommand()
+        let name = require('../../package.json').name
+        if (semver.prerelease(latest)) {
+          name += '@next'
+        }
+
+        if (command) {
+          upgradeMessage +=
+            `\nRun ${chalk.yellow(`${command} ${name}`)} to update!`
+        }
+      } catch (e) {}
+
       const upgradeBox = require('boxen')(upgradeMessage, {
         align: 'center',
         borderColor: 'green',