Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Commit 62a9155

Browse filesBrowse files
authored
feat: add prettify option (#1461)
* fix: fix duplicate object key in package.json * chore: update deps * feat: add `prettify` option closes #1426
1 parent 4e90784 commit 62a9155
Copy full SHA for 62a9155

File tree

Expand file treeCollapse file tree

7 files changed

+460
-907
lines changed
Filter options
Expand file treeCollapse file tree

7 files changed

+460
-907
lines changed

‎docs/options.md

Copy file name to clipboardExpand all lines: docs/options.md
+7Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -85,3 +85,10 @@ When both options are specified, enables file-system-based template compilation
8585
::: tip
8686
Interaction between `vue-loader` and `cache-loader` uses [inline loader import syntax](https://webpack.js.org/concepts/loaders/#inline) under the hook, the `!` will be treated as the separator between different loaders, so please ensure `cacheDirectory` doesn't contain `!`.
8787
:::
88+
89+
## prettify
90+
91+
- type: `boolean`
92+
- default: `true`
93+
94+
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.

‎docs/zh/options.md

Copy file name to clipboardExpand all lines: docs/zh/options.md
+7Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -85,3 +85,10 @@ sidebar: auto
8585
::: tip 注意
8686
在内部,`vue-loader``cache-loader` 之间的交互使用了 [loader 的内联 import 语法](https://webpack.js.org/concepts/loaders/#inline)`!` 将会被认为是不同 loaders 之间的分隔符,所以请确保你的 `cacheDirectory` 路径中不包含 `!`
8787
:::
88+
89+
## prettify
90+
91+
- 类型:`boolean`
92+
- 默认值:`true`
93+
94+
在开发环境下,我们默认使用 [prettier](https://prettier.io/) 格式化编译后的模板渲染代码,以方便调试。然而,如果你开发时碰到了 prettier 的某些罕见 bug,比如[格式化多层嵌套的函数时运行时间过长](https://github.com/prettier/prettier/issues/4672),你可以通过禁用这个选项来绕开。

‎lib/loaders/templateLoader.js

Copy file name to clipboardExpand all lines: lib/loaders/templateLoader.js
+2-1Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,8 @@ module.exports = function (source) {
3636
transformAssetUrls: options.transformAssetUrls || true,
3737
isProduction,
3838
isFunctional,
39-
optimizeSSR: isServer && options.optimizeSSR !== false
39+
optimizeSSR: isServer && options.optimizeSSR !== false,
40+
prettify: options.prettify
4041
}
4142

4243
const compiled = compileTemplate(finalOptions)

‎package.json

Copy file name to clipboardExpand all lines: package.json
+4-6Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -33,10 +33,11 @@
3333
]
3434
},
3535
"peerDependencies": {
36-
"css-loader": "*"
36+
"css-loader": "*",
37+
"webpack": "^4.1.0"
3738
},
3839
"dependencies": {
39-
"@vue/component-compiler-utils": "^2.0.0",
40+
"@vue/component-compiler-utils": "^2.4.0",
4041
"hash-sum": "^1.0.2",
4142
"loader-utils": "^1.1.0",
4243
"vue-hot-reload-api": "^2.3.0",
@@ -80,12 +81,9 @@
8081
"vuepress": "^0.14.2",
8182
"vuepress-theme-vue": "^1.1.0",
8283
"webpack": "^4.1.0",
83-
"webpack-cli": "^2.0.10",
84+
"webpack-cli": "^3.2.0",
8485
"webpack-dev-server": "^3.1.1",
8586
"webpack-merge": "^4.1.2",
8687
"yorkie": "^1.0.3"
87-
},
88-
"peerDependencies": {
89-
"webpack": "^4.1.0"
9088
}
9189
}

‎test/fixtures/prettier-bug.vue

Copy file name to clipboard
+69Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
<template>
2+
<div>
3+
<div>
4+
<div>
5+
<div>
6+
<div>
7+
<div>
8+
<div>
9+
<div>
10+
<div>
11+
<div>
12+
<div>
13+
<div>
14+
<div>
15+
<div>
16+
<div>
17+
<div>
18+
<div>
19+
<div>
20+
<div>
21+
<div>
22+
<div>
23+
<div>
24+
<div>
25+
<div>
26+
<div>
27+
<div>
28+
<div>
29+
<div>
30+
<div>
31+
<div>
32+
<div></div>
33+
</div>
34+
</div>
35+
</div>
36+
</div>
37+
</div>
38+
</div>
39+
</div>
40+
</div>
41+
</div>
42+
</div>
43+
</div>
44+
</div>
45+
</div>
46+
</div>
47+
</div>
48+
</div>
49+
</div>
50+
</div>
51+
</div>
52+
</div>
53+
</div>
54+
</div>
55+
</div>
56+
</div>
57+
</div>
58+
</div>
59+
</div>
60+
</div>
61+
</div>
62+
</div>
63+
</template>
64+
65+
<script>
66+
export default {
67+
name: "entry-view"
68+
};
69+
</script>

‎test/template.spec.js

Copy file name to clipboardExpand all lines: test/template.spec.js
+13Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -292,3 +292,16 @@ test('separate loader configuration for template lang and js imports', done => {
292292
done()
293293
})
294294
})
295+
296+
// #1426
297+
test('disable prettify', done => {
298+
mockBundleAndRun({
299+
entry: 'prettier-bug.vue',
300+
vue: {
301+
productionMode: false,
302+
prettify: false
303+
}
304+
}, () => {
305+
done()
306+
})
307+
})

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.