Skip to content

Commit d091759

Browse files
adamDilgeradamDilger
committed
(#218) format both script and script setup tags if they exist
1 parent ea89211 commit d091759

File tree

3 files changed

+171
-6
lines changed

3 files changed

+171
-6
lines changed

‎src/preprocessors/vue-preprocessor.ts‎

Lines changed: 23 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,14 +5,31 @@ export function vuePreprocessor(code: string, options: PrettierOptions) {
55
const { parse } = require('@vue/compiler-sfc');
66
const { descriptor } = parse(code);
77

8-
const content = (descriptor.script ?? descriptor.scriptSetup)?.content;
9-
if (!content) {
8+
const scriptContent = descriptor.script?.content;
9+
const scriptSetupContent = descriptor.scriptSetup?.content;
10+
11+
if (!scriptContent && !scriptSetupContent) {
1012
return code;
1113
}
1214

13-
// 'replacer' is a function so it returns the preprocessed code as-is.
14-
// If it were passed as just a string and the string contained special groups (like $&, $`, $', $n, $<n>, etc.) this would produce invalid results
15-
const replacer = () => `\n${preprocessor(content, options)}\n`;
15+
let transformedCode = code;
16+
17+
const replacer = (content: string) => {
18+
// we pass the second argument as a function to avoid issues with the replacement string
19+
// if string contained special groups (like $&, $`, $', $n, $<n>, etc.) this would produce invalid results
20+
return transformedCode.replace(
21+
content,
22+
() => `\n${preprocessor(content, options)}\n`,
23+
);
24+
};
25+
26+
if (scriptContent) {
27+
transformedCode = replacer(scriptContent);
28+
}
29+
30+
if (scriptSetupContent) {
31+
transformedCode = replacer(scriptSetupContent);
32+
}
1633

17-
return code.replace(content, replacer);
34+
return transformedCode;
1835
}

‎tests/Vue/__snapshots__/ppsi.spec.js.snap‎

Lines changed: 103 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,109 @@ function add(a, b) {
5757
5858
`;
5959

60+
exports[`setupAndScript.vue - vue-verify: setupAndScript.vue 1`] = `
61+
<script>
62+
// I am top level comment in this file.
63+
import z from 'z';
64+
import threeLevelRelativePath from "../../../threeLevelRelativePath";
65+
import sameLevelRelativePath from "./sameLevelRelativePath";
66+
import thirdParty from "third-party";
67+
import oneLevelRelativePath from "../oneLevelRelativePath";
68+
import otherthing from "@core/otherthing";
69+
import abc from "@core/abc";
70+
import twoLevelRelativePath from "../../twoLevelRelativePath";
71+
import component from "@ui/hello";
72+
import fourLevelRelativePath from "../../../../fourLevelRelativePath";
73+
import something from "@server/something";
74+
import xyz from "@ui/xyz";
75+
import { defineComponent } from 'vue'
76+
77+
function firstAdd(a,b) {
78+
return a + b;
79+
}
80+
</script>
81+
82+
<script setup>
83+
// I am top level comment in this file.
84+
import z from 'z';
85+
import threeLevelRelativePath from "../../../threeLevelRelativePath";
86+
import sameLevelRelativePath from "./sameLevelRelativePath";
87+
import thirdParty from "third-party";
88+
import oneLevelRelativePath from "../oneLevelRelativePath";
89+
import otherthing from "@core/otherthing";
90+
import abc from "@core/abc";
91+
import twoLevelRelativePath from "../../twoLevelRelativePath";
92+
import component from "@ui/hello";
93+
import fourLevelRelativePath from "../../../../fourLevelRelativePath";
94+
import something from "@server/something";
95+
import xyz from "@ui/xyz";
96+
import { defineComponent } from 'vue'
97+
98+
function add(a,b) {
99+
return a + b;
100+
}
101+
</script>
102+
103+
<template>
104+
<div></div>
105+
</template>
106+
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
107+
<script>
108+
// I am top level comment in this file.
109+
import thirdParty from "third-party";
110+
import { defineComponent } from "vue";
111+
import z from "z";
112+
113+
import abc from "@core/abc";
114+
import otherthing from "@core/otherthing";
115+
116+
import something from "@server/something";
117+
118+
import component from "@ui/hello";
119+
import xyz from "@ui/xyz";
120+
121+
import fourLevelRelativePath from "../../../../fourLevelRelativePath";
122+
import threeLevelRelativePath from "../../../threeLevelRelativePath";
123+
import twoLevelRelativePath from "../../twoLevelRelativePath";
124+
import oneLevelRelativePath from "../oneLevelRelativePath";
125+
import sameLevelRelativePath from "./sameLevelRelativePath";
126+
127+
function firstAdd(a, b) {
128+
return a + b;
129+
}
130+
</script>
131+
132+
<script setup>
133+
// I am top level comment in this file.
134+
import thirdParty from "third-party";
135+
import { defineComponent } from "vue";
136+
import z from "z";
137+
138+
import abc from "@core/abc";
139+
import otherthing from "@core/otherthing";
140+
141+
import something from "@server/something";
142+
143+
import component from "@ui/hello";
144+
import xyz from "@ui/xyz";
145+
146+
import fourLevelRelativePath from "../../../../fourLevelRelativePath";
147+
import threeLevelRelativePath from "../../../threeLevelRelativePath";
148+
import twoLevelRelativePath from "../../twoLevelRelativePath";
149+
import oneLevelRelativePath from "../oneLevelRelativePath";
150+
import sameLevelRelativePath from "./sameLevelRelativePath";
151+
152+
function add(a, b) {
153+
return a + b;
154+
}
155+
</script>
156+
157+
<template>
158+
<div></div>
159+
</template>
160+
161+
`;
162+
60163
exports[`sfc.vue - vue-verify: sfc.vue 1`] = `
61164
<script>
62165
// I am top level comment in this file.

‎tests/Vue/setupAndScript.vue‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
<script>
2+
// I am top level comment in this file.
3+
import z from 'z';
4+
import threeLevelRelativePath from "../../../threeLevelRelativePath";
5+
import sameLevelRelativePath from "./sameLevelRelativePath";
6+
import thirdParty from "third-party";
7+
import oneLevelRelativePath from "../oneLevelRelativePath";
8+
import otherthing from "@core/otherthing";
9+
import abc from "@core/abc";
10+
import twoLevelRelativePath from "../../twoLevelRelativePath";
11+
import component from "@ui/hello";
12+
import fourLevelRelativePath from "../../../../fourLevelRelativePath";
13+
import something from "@server/something";
14+
import xyz from "@ui/xyz";
15+
import { defineComponent } from 'vue'
16+
17+
function firstAdd(a,b) {
18+
return a + b;
19+
}
20+
</script>
21+
22+
<script setup>
23+
// I am top level comment in this file.
24+
import z from 'z';
25+
import threeLevelRelativePath from "../../../threeLevelRelativePath";
26+
import sameLevelRelativePath from "./sameLevelRelativePath";
27+
import thirdParty from "third-party";
28+
import oneLevelRelativePath from "../oneLevelRelativePath";
29+
import otherthing from "@core/otherthing";
30+
import abc from "@core/abc";
31+
import twoLevelRelativePath from "../../twoLevelRelativePath";
32+
import component from "@ui/hello";
33+
import fourLevelRelativePath from "../../../../fourLevelRelativePath";
34+
import something from "@server/something";
35+
import xyz from "@ui/xyz";
36+
import { defineComponent } from 'vue'
37+
38+
function add(a,b) {
39+
return a + b;
40+
}
41+
</script>
42+
43+
<template>
44+
<div></div>
45+
</template>

0 commit comments

Comments
 (0)