From 7f3135b82b1cdaf6014c0cc6805316cecc6c1318 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=B1=AA=E6=9D=B1=E9=99=BD?= Date: Sun, 25 Dec 2022 18:22:22 +0800 Subject: [PATCH 1/5] chore(vite): enhance error message when can't find css preprocessor dependency --- packages/vite/src/node/plugins/css.ts | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts index 142a696662f5e3..329c7bc5035ac2 100644 --- a/packages/vite/src/node/plugins/css.ts +++ b/packages/vite/src/node/plugins/css.ts @@ -1504,8 +1504,16 @@ function loadPreprocessor( return (loadedPreprocessors[lang] = _require(resolved)) } catch (e) { if (e.code === 'MODULE_NOT_FOUND') { + const preprocessorPackage = { + [PreprocessLang.scss]: 'sass', + [PreprocessLang.sass]: 'sass', + [PreprocessLang.less]: 'less', + [PreprocessLang.styl]: 'stylus', + [PreprocessLang.stylus]: 'stylus', + [PostCssDialectLang.sss]: 'sugarss', + } throw new Error( - `Preprocessor dependency "${lang}" not found. Did you install it?`, + `Preprocessor dependency "${lang}" not found. Did you install it? Try \`npm i -D ${preprocessorPackage[lang]}\`.`, ) } else { const message = new Error( From f3f55c829ea73b20d30e999422f90278bf9c8553 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=B1=AA=E6=9D=B1=E9=99=BD?= Date: Mon, 26 Dec 2022 22:13:40 +0800 Subject: [PATCH 2/5] chore(css): use the `lang` variable directly as the package name --- packages/vite/src/node/plugins/css.ts | 10 +--------- 1 file changed, 1 insertion(+), 9 deletions(-) diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts index 329c7bc5035ac2..c624e3fe160721 100644 --- a/packages/vite/src/node/plugins/css.ts +++ b/packages/vite/src/node/plugins/css.ts @@ -1504,16 +1504,8 @@ function loadPreprocessor( return (loadedPreprocessors[lang] = _require(resolved)) } catch (e) { if (e.code === 'MODULE_NOT_FOUND') { - const preprocessorPackage = { - [PreprocessLang.scss]: 'sass', - [PreprocessLang.sass]: 'sass', - [PreprocessLang.less]: 'less', - [PreprocessLang.styl]: 'stylus', - [PreprocessLang.stylus]: 'stylus', - [PostCssDialectLang.sss]: 'sugarss', - } throw new Error( - `Preprocessor dependency "${lang}" not found. Did you install it? Try \`npm i -D ${preprocessorPackage[lang]}\`.`, + `Preprocessor dependency "${lang}" not found. Did you install it? Try \`npm i -D ${lang}\`.`, ) } else { const message = new Error( From c925c9d139a568c85fb92907663c3fd612441202 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=B1=AA=E6=9D=B1=E9=99=BD?= Date: Mon, 26 Dec 2022 22:28:13 +0800 Subject: [PATCH 3/5] chore(css): add package manager from user land --- packages/vite/src/node/plugins/css.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts index c624e3fe160721..a1c3ad4cb7cae3 100644 --- a/packages/vite/src/node/plugins/css.ts +++ b/packages/vite/src/node/plugins/css.ts @@ -1504,8 +1504,10 @@ function loadPreprocessor( return (loadedPreprocessors[lang] = _require(resolved)) } catch (e) { if (e.code === 'MODULE_NOT_FOUND') { + const packageManager = + process.env.npm_config_user_agent?.split(' ')[0].split('/')[0] || 'npm' throw new Error( - `Preprocessor dependency "${lang}" not found. Did you install it? Try \`npm i -D ${lang}\`.`, + `Preprocessor dependency "${lang}" not found. Did you install it? Try \`${packageManager} i -D ${lang}\`.`, ) } else { const message = new Error( From d6728f0e2c9288968a583594577ca64b80157e56 Mon Sep 17 00:00:00 2001 From: Michael Wang Date: Fri, 28 Jul 2023 18:45:24 +0800 Subject: [PATCH 4/5] feat: add `getPackageManagerCommand` util --- packages/vite/src/node/plugins/css.ts | 6 +++--- packages/vite/src/node/utils.ts | 20 ++++++++++++++++++++ 2 files changed, 23 insertions(+), 3 deletions(-) diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts index a93ba0692ce126..61318a58cf3279 100644 --- a/packages/vite/src/node/plugins/css.ts +++ b/packages/vite/src/node/plugins/css.ts @@ -45,6 +45,7 @@ import { emptyCssComments, generateCodeFrame, getHash, + getPackageManagerCommand, isDataUrl, isExternalUrl, isObject, @@ -1694,10 +1695,9 @@ function loadPreprocessor( return (loadedPreprocessors[lang] = _require(resolved)) } catch (e) { if (e.code === 'MODULE_NOT_FOUND') { - const packageManager = - process.env.npm_config_user_agent?.split(' ')[0].split('/')[0] || 'npm' + const installCommand = getPackageManagerCommand('install') throw new Error( - `Preprocessor dependency "${lang}" not found. Did you install it? Try \`${packageManager} i -D ${lang}\`.`, + `Preprocessor dependency "${lang}" not found. Did you install it? Try \`${installCommand} -D ${lang}\`.`, ) } else { const message = new Error( diff --git a/packages/vite/src/node/utils.ts b/packages/vite/src/node/utils.ts index 9ddc8c3a1f7791..75dffe6121058c 100644 --- a/packages/vite/src/node/utils.ts +++ b/packages/vite/src/node/utils.ts @@ -1257,3 +1257,23 @@ const escapeRegexRE = /[-/\\^$*+?.()|[\]{}]/g export function escapeRegex(str: string): string { return str.replace(escapeRegexRE, '\\$&') } + +type CommandType = 'install' | 'uninstall' | 'update' +export function getPackageManagerCommand( + type: CommandType = 'install', +): string { + const packageManager = + process.env.npm_config_user_agent?.split(' ')[0].split('/')[0] || 'npm' + switch (type) { + case 'install': + return packageManager === 'npm' ? 'npm install' : `${packageManager} add` + case 'uninstall': + return packageManager === 'npm' + ? 'npm uninstall' + : `${packageManager} remove` + case 'update': + return packageManager === 'yarn' + ? 'yarn upgrade' + : `${packageManager} update` + } +} From c55ae7b8edeaabd8451d376d0cadbaff416b9b2d Mon Sep 17 00:00:00 2001 From: Michael Wang Date: Mon, 31 Jul 2023 02:41:16 +0800 Subject: [PATCH 5/5] feat: should handle default case --- packages/vite/src/node/utils.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/vite/src/node/utils.ts b/packages/vite/src/node/utils.ts index 75dffe6121058c..82e83d9a95989b 100644 --- a/packages/vite/src/node/utils.ts +++ b/packages/vite/src/node/utils.ts @@ -1275,5 +1275,7 @@ export function getPackageManagerCommand( return packageManager === 'yarn' ? 'yarn upgrade' : `${packageManager} update` + default: + throw new TypeError(`Unknown command type: ${type}`) } }