Skip to content

嵌入式格式

🌐 Embedded Formatting

WARNING

尚未完全实现。请参见跟踪问题

格式化嵌入在 JS/TS 文件中的代码(模板字符串中的 CSS、模板字符串中的 GraphQL、Markdown 中的 JavaScript/TypeScript/CSS 等)。

🌐 Formats code embedded in JS/TS files (CSS in template literals, GraphQL in template literals, JavaScript/TypeScript/CSS/etc in Markdown).

配置

🌐 Configuration

.oxfmtrc.json
json
{
  "embeddedLanguageFormatting": "auto"
}

🌐 Values

  • "auto" —(默认)格式化嵌入部分
  • "off" — 跳过嵌入的格式

例子

🌐 Examples

带标签的模板字面量中的 CSS:

🌐 CSS inside a tagged template literal:

js
const styles = css`
  .container {
    background: blue;
    color: red;
  }
`;

带标签的模板字面量中的 HTML:

🌐 HTML inside a tagged template literal:

js
const template = html`
  <div class="container">
    <h1>Hello</h1>
    <p>World</p>
  </div>
`;

Markdown 文件中的 JavaScript 代码块:

🌐 JavaScript code blocks inside a Markdown file:

md
This is an example Markdown file with JavaScript code blocks:

```js
const x = 1; // This will be formatted if embedded formatting is enabled.
```

Wow!

Vue 文件中的 CSS:

🌐 CSS inside a Vue file:

vue
<style>
/* This CSS will be formatted if embedded formatting is enabled. */
.container {
  background: blue;
  color: red;
}
</style>