This commit is contained in:
@@ -73,7 +73,13 @@
|
|||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { Icon } from "@iconify/vue"
|
import { Icon } from "@iconify/vue"
|
||||||
// Prettier 和插件现在使用动态导入
|
//@ts-ignore
|
||||||
|
import * as prettier from "prettier/standalone"
|
||||||
|
import * as htmlParser from "prettier/plugins/html"
|
||||||
|
import * as cssParser from "prettier/plugins/postcss"
|
||||||
|
import * as babelParser from "prettier/plugins/babel"
|
||||||
|
//@ts-ignore
|
||||||
|
import * as estreeParser from "prettier/plugins/estree"
|
||||||
import Editor from "./Editor.vue"
|
import Editor from "./Editor.vue"
|
||||||
import Corner from "./Corner.vue"
|
import Corner from "./Corner.vue"
|
||||||
import { html, css, js, tab, size, reset } from "../store/editors"
|
import { html, css, js, tab, size, reset } from "../store/editors"
|
||||||
@@ -92,34 +98,22 @@ function changeSize(num: number) {
|
|||||||
|
|
||||||
async function format() {
|
async function format() {
|
||||||
try {
|
try {
|
||||||
// 动态导入 Prettier 和插件以避免构建时的模块解析问题
|
|
||||||
const [prettierModule, htmlParserModule, cssParserModule, babelParserModule, estreeParserModule] = await Promise.all([
|
|
||||||
// @ts-ignore
|
|
||||||
import("prettier/standalone"),
|
|
||||||
// @ts-ignore
|
|
||||||
import("prettier/plugins/html"),
|
|
||||||
// @ts-ignore
|
|
||||||
import("prettier/plugins/postcss"),
|
|
||||||
// @ts-ignore
|
|
||||||
import("prettier/plugins/babel"),
|
|
||||||
// @ts-ignore
|
|
||||||
import("prettier/plugins/estree")
|
|
||||||
])
|
|
||||||
|
|
||||||
const [htmlFormatted, cssFormatted, jsFormatted] = await Promise.all([
|
const [htmlFormatted, cssFormatted, jsFormatted] = await Promise.all([
|
||||||
prettierModule.format(html.value, {
|
prettier.format(html.value, {
|
||||||
parser: "html",
|
|
||||||
plugins: [htmlParserModule, babelParserModule, cssParserModule],
|
|
||||||
tabWidth: 4,
|
|
||||||
}),
|
|
||||||
prettierModule.format(css.value, {
|
|
||||||
parser: "css",
|
|
||||||
plugins: [cssParserModule],
|
|
||||||
tabWidth: 4,
|
|
||||||
}),
|
|
||||||
prettierModule.format(js.value, {
|
|
||||||
parser: "babel",
|
parser: "babel",
|
||||||
plugins: [babelParserModule, estreeParserModule],
|
//@ts-ignore
|
||||||
|
plugins: [htmlParser, babelParser, estreeParser, cssParser],
|
||||||
|
tabWidth: 4,
|
||||||
|
}),
|
||||||
|
prettier.format(css.value, {
|
||||||
|
parser: "css",
|
||||||
|
plugins: [cssParser],
|
||||||
|
tabWidth: 4,
|
||||||
|
}),
|
||||||
|
prettier.format(js.value, {
|
||||||
|
parser: "babel",
|
||||||
|
//@ts-ignore
|
||||||
|
plugins: [babelParser, estreeParser],
|
||||||
tabWidth: 2,
|
tabWidth: 2,
|
||||||
}),
|
}),
|
||||||
])
|
])
|
||||||
|
|||||||
Reference in New Issue
Block a user