fix: don't prettify if prettier 3 is detected

vuejs · Aug 23, 2023 · aa2558d · aa2558d
1 parent ed0d284
commit aa2558d
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 3 deletions.
diff --git a/docs/options.md b/docs/options.md
@@ -90,7 +90,7 @@ When both options are specified, enables file-system-based template compilation
 ## prettify
 
 - type: `boolean`
-- default: `true`
+- default: `true` if prettier v1 or v2 is installed, `false` otherwise
 
 In development mode, we use [prettier](https://prettier.io/) to format the compiled render function for ease of debugging by default. However, if you encounter any obscure bug of prettier, such as [exponential compilation time for deeply nested functions](https://github.com/prettier/prettier/issues/4672), you can disable this option to circumvent it.
 

diff --git a/docs/zh/options.md b/docs/zh/options.md
@@ -90,7 +90,7 @@ sidebar: auto
 ## prettify
 
 - 类型：`boolean`
-- 默认值：`true`
+- 默认值：当检测到 prettier v1 或 v2 时为 `true`，否则为 `false`
 
 在开发环境下，我们默认使用 [prettier](https://prettier.io/) 格式化编译后的模板渲染代码，以方便调试。然而，如果你开发时碰到了 prettier 的某些罕见 bug，比如[格式化多层嵌套的函数时运行时间过长](https://github.com/prettier/prettier/issues/4672)，你可以通过禁用这个选项来绕开。
 

diff --git a/lib/loaders/templateLoader.js b/lib/loaders/templateLoader.js
@@ -41,6 +41,17 @@ module.exports = function (source) {
   const descriptor = getDescriptor(filename, options, loaderContext)
   const script = resolveScript(descriptor, id, options, loaderContext)
 
+  // Prettier 3 APIs are all async
+  // but `vue/compiler-sfc` and `@vue/component-compiler-utils` can only use sync function to format code
+  let hasCompatiblePrettier = false
+  try {
+    const prettier = require('prettier/package.json')
+    const major = parseInt(prettier.version.split('.')[0], 10)
+    if (major === 1 || major === 2) {
+      hasCompatiblePrettier = true
+    }
+  } catch (e) {}
+
   // for vue/compiler-sfc OR @vue/component-compiler-utils
   const finalOptions = {
     source,
@@ -53,7 +64,7 @@ module.exports = function (source) {
     isProduction,
     isFunctional,
     optimizeSSR: isServer && options.optimizeSSR !== false,
-    prettify: options.prettify,
+    prettify: options.prettify === undefined ? hasCompatiblePrettier : options.prettify,
     bindings: script ? script.bindings : undefined
   }
 

diff --git a/package.json b/package.json
@@ -46,6 +46,9 @@
     },
     "vue-template-compiler": {
       "optional": true
+    },
+    "prettier": {
+      "optional": true
     }
   },
   "dependencies": {