feat(app): auto install HBuilderX plugins

packages/uni-cli-nvue/package.json

@@ -32,7 +32,6 @@
     "de-indent": "^1.0.2",
     "escodegen": "^1.8.1",
     "file-loader": "^6.2.0",
-    "friendly-errors-webpack-plugin": "^1.7.0",
     "hash-sum": "^2.0.0",
     "he": "^1.1.0",
     "indexes-of": "^1.0.1",

packages/uni-cli-nvue/src/webpack/index.ts

@@ -12,6 +12,7 @@ import {
 import { createConfig } from './config'
 import { initModuleAlias } from './alias'
 import { NVueCompilerOptions } from '../types'
+import { formatErrors } from './utils'
 
 const initModuleAliasOnce = once(initModuleAlias)
 
@@ -27,22 +28,24 @@ function runWebpack(
       if (err) {
         return reject(err.stack || err)
       }
-      if (stats!.hasErrors()) {
-        return reject(stats!.toString())
-      }
-      if (stats!.hasWarnings()) {
-        const info = stats!.toJson({ all: false, warnings: true })
-        console.warn(info.warnings)
-      }
-      if (process.env.DEBUG) {
-        console.log(
-          stats!.toString({
-            all: false,
-            assets: true,
-            colors: true, // 在控制台展示颜色
-            // timings: true,
-          })
-        )
+      if (stats) {
+        if (stats.hasErrors()) {
+          return reject(formatErrors(stats.compilation.errors))
+        }
+        if (stats.hasWarnings()) {
+          const info = stats.toJson({ all: false, warnings: true })
+          console.warn(info.warnings)
+        }
+        if (process.env.DEBUG) {
+          console.log(
+            stats.toString({
+              all: false,
+              assets: true,
+              colors: true, // 在控制台展示颜色
+              // timings: true,
+            })
+          )
+        }
       }
       resolve(compiler)
     })

packages/uni-cli-nvue/src/webpack/utils.ts

+import { WebpackError } from 'webpack'
+import {
+  installHBuilderXPlugin,
+  formatInstallHBuilderXPluginTips,
+  isInHBuilderX,
+} from '@dcloudio/uni-cli-shared'
+const preprocessors = ['compile-dart-sass', 'compile-less', 'compile-stylus']
+export function formatErrors(errors: WebpackError[]) {
+  return errors
+    .filter(({ message }) => {
+      if (isInHBuilderX()) {
+        const preprocessor = preprocessors.find((preprocessor) =>
+          message.includes(preprocessor)
+        )
+        if (preprocessor) {
+          installHBuilderXPlugin(preprocessor)
+          const langs = preprocessor.split('-')
+          console.error(
+            formatInstallHBuilderXPluginTips(
+              langs[langs.length - 1],
+              preprocessor
+            )
+          )
+          return false
+        }
+      }
+      return true
+    })
+    .join('\n')
+}

packages/uni-cli-shared/src/hbx/alias.ts

@@ -29,8 +29,13 @@ function supportAutoInstallPlugin() {
   return true
 }
 
-function sendSignal(lang: string) {
-  return console.error(`%HXRunUniAPPPluginName%${lang}%HXRunUniAPPPluginName%`)
+export function installHBuilderXPlugin(plugin: string) {
+  if (!supportAutoInstallPlugin()) {
+    return
+  }
+  return console.error(
+    `%HXRunUniAPPPluginName%${plugin}%HXRunUniAPPPluginName%`
+  )
 }
 
 export const moduleAliasFormatter: Formatter = {
@@ -51,13 +56,19 @@ export const moduleAliasFormatter: Formatter = {
       preprocessor = 'compile-stylus'
     }
     if (lang) {
-      const autoInstall = supportAutoInstallPlugin()
-      autoInstall && sendSignal(preprocessor)
-      return `预编译器错误：代码使用了${lang}语言，但未安装相应的编译器插件，${
-        autoInstall ? '正在从' : '请前往'
-      }插件市场安装该插件:
-https://ext.dcloud.net.cn/plugin?name=${preprocessor}`
+      installHBuilderXPlugin(preprocessor)
+      return formatInstallHBuilderXPluginTips(lang, preprocessor)
     }
     return msg
   },
 }
+
+export function formatInstallHBuilderXPluginTips(
+  lang: string,
+  preprocessor: string
+) {
+  return `预编译器错误：代码使用了${lang}语言，但未安装相应的编译器插件，${
+    supportAutoInstallPlugin() ? '正在从' : '请前往'
+  }插件市场安装该插件:
+https://ext.dcloud.net.cn/plugin?name=${preprocessor}`
+}

packages/uni-cli-shared/src/hbx/index.ts

 export * from './env'
-export { initModuleAlias } from './alias'
+export {
+  initModuleAlias,
+  installHBuilderXPlugin,
+  formatInstallHBuilderXPluginTips,
+} from './alias'

packages/uni-h5-vite/src/plugin/config.ts

@@ -43,20 +43,6 @@ export function createConfig(options: {
         rollupOptions: {
           // resolveSSRExternal 会判定package.json，hbx 工程可能没有，通过 rollup 来配置
           external: isSsr(env.command, config) ? external : [],
-          onwarn(warning, warn) {
-            if (warning.code === 'UNUSED_EXTERNAL_IMPORT') {
-              const { message } = warning
-              // ignore
-              if (
-                message.includes('"vue"') ||
-                message.includes('"resolveComponent"') ||
-                message.includes('"@dcloudio/uni-h5"')
-              ) {
-                return
-              }
-            }
-            warn(warning)
-          },
           output: {
             chunkFileNames(chunkInfo) {
               const { assetsDir } = options.resolvedConfig!.build

packages/vite-plugin-uni/src/config/build.ts

@@ -22,5 +22,21 @@ export function createBuild(
         : process.env.NODE_ENV === 'production'
         ? 'terser'
         : false,
+    rollupOptions: {
+      onwarn(warning, warn) {
+        if (warning.code === 'UNUSED_EXTERNAL_IMPORT') {
+          const { message } = warning
+          // ignore
+          if (
+            message.includes('"vue"') ||
+            message.includes('"resolveComponent"') ||
+            message.includes('"@dcloudio/uni-h5"')
+          ) {
+            return
+          }
+        }
+        warn(warning)
+      },
+    },
   }
 }

pnpm-lock.yaml

@@ -269,7 +269,6 @@ importers:
       de-indent: ^1.0.2
       escodegen: ^1.8.1
       file-loader: ^6.2.0
-      friendly-errors-webpack-plugin: ^1.7.0
       hash-sum: ^2.0.0
       he: ^1.1.0
       indexes-of: ^1.0.1
@@ -309,7 +308,6 @@ importers:
       de-indent: 1.0.2
       escodegen: 1.14.3
       file-loader: 6.2.0_webpack@5.64.1
-      friendly-errors-webpack-plugin: 1.7.0_webpack@5.64.1
       hash-sum: 2.0.0
       he: 1.2.0
       indexes-of: 1.0.1
@@ -3212,26 +3210,11 @@ packages:
       type-fest: 0.21.3
     dev: true
 
-  /ansi-regex/2.1.1:
-    resolution: {integrity: sha1-w7M6te42DYbg5ijwRorn7yfWVN8=}
-    engines: {node: '>=0.10.0'}
-    dev: false
-
-  /ansi-regex/3.0.0:
-    resolution: {integrity: sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=}
-    engines: {node: '>=4'}
-    dev: false
-
   /ansi-regex/5.0.1:
     resolution: {integrity: sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==}
     engines: {node: '>=8'}
     dev: true
 
-  /ansi-styles/2.2.1:
-    resolution: {integrity: sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=}
-    engines: {node: '>=0.10.0'}
-    dev: false
-
   /ansi-styles/3.2.1:
     resolution: {integrity: sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==}
     engines: {node: '>=4'}
@@ -3699,17 +3682,6 @@ packages:
     resolution: {integrity: sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw=}
     dev: true
 
-  /chalk/1.1.3:
-    resolution: {integrity: sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=}
-    engines: {node: '>=0.10.0'}
-    dependencies:
-      ansi-styles: 2.2.1
-      escape-string-regexp: 1.0.5
-      has-ansi: 2.0.0
-      strip-ansi: 3.0.1
-      supports-color: 2.0.0
-    dev: false
-
   /chalk/2.4.2:
     resolution: {integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==}
     engines: {node: '>=4'}
@@ -4387,12 +4359,6 @@ packages:
     dependencies:
       is-arrayish: 0.2.1
 
-  /error-stack-parser/2.0.6:
-    resolution: {integrity: sha512-d51brTeqC+BHlwF0BhPtcYgF5nlzf9ZZ0ZIUQNZpc9ZB9qw5IJ2diTrBY9jlCJkTLITYPjmiX6OWCwH+fuyNgQ==}
-    dependencies:
-      stackframe: 1.2.0
-    dev: false
-
   /es-module-lexer/0.9.3:
     resolution: {integrity: sha512-1HQ2M2sPtxwnvOvT1ZClHyQDiggdNjURWpY2we6aMKCQiUVxTmVs2UYPLIrD84sS+kMdUwfBSylbJPwNnBrnHQ==}
     dev: false
@@ -5009,17 +4975,6 @@ packages:
     resolution: {integrity: sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac=}
     engines: {node: '>= 0.6'}
 
-  /friendly-errors-webpack-plugin/1.7.0_webpack@5.64.1:
-    resolution: {integrity: sha512-K27M3VK30wVoOarP651zDmb93R9zF28usW4ocaK3mfQeIEI5BPht/EzZs5E8QLLwbLRJQMwscAjDxYPb1FuNiw==}
-    peerDependencies:
-      webpack: ^2.0.0 || ^3.0.0 || ^4.0.0
-    dependencies:
-      chalk: 1.1.3
-      error-stack-parser: 2.0.6
-      string-width: 2.1.1
-      webpack: 5.64.1
-    dev: false
-
   /fs-extra/10.0.0:
     resolution: {integrity: sha512-C5owb14u9eJwizKGdchcDUQeFtlSHHthBk8pbX9Vc1PFZrLombudjDnNns88aYslCyF6IY5SUw3Roz6xShcEIQ==}
     engines: {node: '>=12'}
@@ -5213,13 +5168,6 @@ packages:
       har-schema: 2.0.0
     dev: true
 
-  /has-ansi/2.0.0:
-    resolution: {integrity: sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=}
-    engines: {node: '>=0.10.0'}
-    dependencies:
-      ansi-regex: 2.1.1
-    dev: false
-
   /has-flag/3.0.0:
     resolution: {integrity: sha1-tdRU3CGZriJWmfNGfloH87lVuv0=}
     engines: {node: '>=4'}
@@ -5496,11 +5444,6 @@ packages:
     resolution: {integrity: sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=}
     engines: {node: '>=0.10.0'}
 
-  /is-fullwidth-code-point/2.0.0:
-    resolution: {integrity: sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=}
-    engines: {node: '>=4'}
-    dev: false
-
   /is-fullwidth-code-point/3.0.0:
     resolution: {integrity: sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==}
     engines: {node: '>=8'}
@@ -7876,10 +7819,6 @@ packages:
       escape-string-regexp: 2.0.0
     dev: true
 
-  /stackframe/1.2.0:
-    resolution: {integrity: sha512-GrdeshiRmS1YLMYgzF16olf2jJ/IzxXY9lhKOskuVziubpTYcYqyOwYeJKzQkwy7uN0fYSsbsC4RQaXf9LCrYA==}
-    dev: false
-
   /statuses/1.5.0:
     resolution: {integrity: sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow=}
     engines: {node: '>= 0.6'}
@@ -7901,14 +7840,6 @@ packages:
     resolution: {integrity: sha1-qJPtNH5yKZvIO++78qaSqNI51d0=}
     dev: true
 
-  /string-width/2.1.1:
-    resolution: {integrity: sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==}
-    engines: {node: '>=4'}
-    dependencies:
-      is-fullwidth-code-point: 2.0.0
-      strip-ansi: 4.0.0
-    dev: false
-
   /string-width/4.2.3:
     resolution: {integrity: sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==}
     engines: {node: '>=8'}
@@ -7943,20 +7874,6 @@ packages:
       is-regexp: 1.0.0
     dev: true
 
-  /strip-ansi/3.0.1:
-    resolution: {integrity: sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=}
-    engines: {node: '>=0.10.0'}
-    dependencies:
-      ansi-regex: 2.1.1
-    dev: false
-
-  /strip-ansi/4.0.0:
-    resolution: {integrity: sha1-qEeQIusaw2iocTibY1JixQXuNo8=}
-    engines: {node: '>=4'}
-    dependencies:
-      ansi-regex: 3.0.0
-    dev: false
-
   /strip-ansi/6.0.1:
     resolution: {integrity: sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==}
     engines: {node: '>=8'}
@@ -8001,11 +7918,6 @@ packages:
       webpack: 5.64.1
     dev: false
 
-  /supports-color/2.0.0:
-    resolution: {integrity: sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=}
-    engines: {node: '>=0.8.0'}
-    dev: false
-
   /supports-color/5.5.0:
     resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==}
     engines: {node: '>=4'}