prettier-plugin-embed 0.1.0 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.bak +211 -0
- package/README.md +61 -36
- package/dist/embedded/css/embedded-language.d.ts +6 -0
- package/dist/embedded/css/embedder.d.ts +9 -0
- package/dist/embedded/css/index.d.ts +3 -0
- package/dist/embedded/css/options.d.ts +37 -0
- package/dist/embedded/es/options.d.ts +12 -8
- package/dist/embedded/glsl/embedded-language.d.ts +6 -0
- package/dist/embedded/glsl/embedder.d.ts +9 -0
- package/dist/embedded/glsl/index.d.ts +3 -0
- package/dist/embedded/glsl/options.d.ts +37 -0
- package/dist/embedded/html/options.d.ts +10 -6
- package/dist/embedded/index.d.ts +1 -0
- package/dist/embedded/markdown/embedded-language.d.ts +6 -0
- package/dist/embedded/markdown/embedder.d.ts +9 -0
- package/dist/embedded/markdown/index.d.ts +3 -0
- package/dist/embedded/markdown/options.d.ts +38 -0
- package/dist/embedded/noop/options.d.ts +6 -3
- package/dist/embedded/php/options.d.ts +15 -11
- package/dist/embedded/register.d.ts +11 -7
- package/dist/embedded/ruby/embedded-language.d.ts +6 -0
- package/dist/embedded/ruby/embedder.d.ts +9 -0
- package/dist/embedded/ruby/index.d.ts +3 -0
- package/dist/embedded/ruby/options.d.ts +60 -0
- package/dist/embedded/sql/options.d.ts +9 -6
- package/dist/embedded/ts/options.d.ts +12 -8
- package/dist/embedded/utils.d.ts +4 -2
- package/dist/embedded/xml/options.d.ts +12 -8
- package/dist/index.js +814 -524
- package/dist/options.d.ts +53 -10
- package/package.json +17 -10
- package/dist/prettier-plugin-embed-wide-dark.svg +0 -309
- package/dist/prettier-plugin-embed-wide-light.svg +0 -309
package/README.bak
ADDED
|
@@ -0,0 +1,211 @@
|
|
|
1
|
+
<div align="center">
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
# Prettier Plugin Embed
|
|
7
|
+
|
|
8
|
+
[](https://www.npmjs.com/package/prettier-plugin-embed/v/latest) [](https://www.npmjs.com/package/prettier-plugin-embed/v/latest) [](https://cdn.jsdelivr.net/npm/prettier-plugin-embed@latest/)
|
|
9
|
+
|
|
10
|
+
A Configurable [Prettier](https://prettier.io/) [Plugin](https://prettier.io/docs/en/plugins.html) to Format [Embedded Languages](https://prettier.io/docs/en/options.html#embedded-language-formatting) in `js`/`ts` Files.
|
|
11
|
+
|
|
12
|
+
```bash
|
|
13
|
+
npm i -D prettier-plugin-embed
|
|
14
|
+
```
|
|
15
|
+
|
|
16
|
+
</div>
|
|
17
|
+
|
|
18
|
+
## Introduction
|
|
19
|
+
|
|
20
|
+
### What?
|
|
21
|
+
|
|
22
|
+
This Prettier plugin (namely [`prettier-plugin-embed`](https://github.com/Sec-ant/prettier-plugin-embed)) provides a configurable solution for formatting embedded languages in the form of [template literals](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Template_literals) within JavaScript or TypeScript files.
|
|
23
|
+
|
|
24
|
+
### Why?
|
|
25
|
+
|
|
26
|
+
Although Prettier has introduced the [`embedded-language-formatting`](https://prettier.io/docs/en/options.html#embedded-language-formatting) option for formatting embedded languages, it only supports two modes: `auto` and `off`. Therefore it doesn't allow for individual formatting adjustments for specific languages, nor does it support customizing the languages that require formatting and identifiers for identification. These limitations restrict the usability of this feature. For more detailed discussions, refer to: https://github.com/prettier/prettier/issues/4424 and https://github.com/prettier/prettier/issues/5588.
|
|
27
|
+
|
|
28
|
+
### How?
|
|
29
|
+
|
|
30
|
+
By leveraging Prettier's plugin system, this plugin overrides the default [`embed`](https://prettier.io/docs/en/plugins#optional-embed) function of the `estree` printer, so varieties of new languages can be hooked in through this function. Check [this file](./src/printers.ts) to get an idea of how this is accomplished.
|
|
31
|
+
|
|
32
|
+
## Features
|
|
33
|
+
|
|
34
|
+
- **Support for Additional Languages:** Extend the embedded language formatting capability to include languages such as XML, SQL, PHP, and more.
|
|
35
|
+
|
|
36
|
+
- **Dual Identification Modes:** Identify embedded languages by tags `` identifier`...` `` or comments `` /* identifier */ `...` `` preceding the template literals.
|
|
37
|
+
|
|
38
|
+
- **Customizable Language Identifiers:** Customize the identifiers used for identifying the embedded languages.
|
|
39
|
+
|
|
40
|
+
- **Formatting Opt-out Mechanism:** Offer the capability to deactivate formatting for certain identifiers, including the default ones (`html`, `css`...) supported by the `embedded-language-formatting` option.
|
|
41
|
+
|
|
42
|
+
- **Configurable Formatting Style:** Provide additional options to tailor the formatting style for embedded languages.
|
|
43
|
+
|
|
44
|
+
- **Strongly Typed API:** Benefit from comprehensive type support for configuring this plugin's options when employing the [Prettier API](https://prettier.io/docs/en/api) in TypeScript.
|
|
45
|
+
|
|
46
|
+
- **Easy Integration:** Integrate with the existing Prettier setup seamlessly, requiring minimal configuration to get started.
|
|
47
|
+
|
|
48
|
+
## Installation
|
|
49
|
+
|
|
50
|
+
```bash
|
|
51
|
+
npm i -D prettier-plugin-embed
|
|
52
|
+
```
|
|
53
|
+
|
|
54
|
+
## Usage
|
|
55
|
+
|
|
56
|
+
### Getting Started
|
|
57
|
+
|
|
58
|
+
This is a Prettier plugin, which follows the [standard usage pattern](https://prettier.io/docs/en/plugins.html#using-plugins) of many other Prettier plugins:
|
|
59
|
+
|
|
60
|
+
#### [CLI](https://prettier.io/docs/en/cli):
|
|
61
|
+
|
|
62
|
+
Via `--plugin`:
|
|
63
|
+
|
|
64
|
+
```bash
|
|
65
|
+
prettier --write main.ts --plugin=prettier-plugin-embed
|
|
66
|
+
```
|
|
67
|
+
|
|
68
|
+
#### [API](https://prettier.io/docs/en/api):
|
|
69
|
+
|
|
70
|
+
Via the `plugins` options:
|
|
71
|
+
|
|
72
|
+
```ts
|
|
73
|
+
await prettier.format(code, {
|
|
74
|
+
filepath: "main.ts",
|
|
75
|
+
plugins: ["prettier-plugin-embed"],
|
|
76
|
+
});
|
|
77
|
+
```
|
|
78
|
+
|
|
79
|
+
#### [Configuration File](https://prettier.io/docs/en/configuration):
|
|
80
|
+
|
|
81
|
+
```json
|
|
82
|
+
{
|
|
83
|
+
"plugins": ["prettier-plugin-embed"]
|
|
84
|
+
}
|
|
85
|
+
```
|
|
86
|
+
|
|
87
|
+
### An Overview of the Philosophy
|
|
88
|
+
|
|
89
|
+
To use this plugin, [`embedded-language-formatting`](https://prettier.io/docs/en/options.html#embedded-language-formatting) option must be set to `auto` (which is the default setting as of now), because this option serves as the main switch for activating embedded language formatting.
|
|
90
|
+
|
|
91
|
+
This plugin does not aim to implement parsers or printers to support every newly added embedded language. Instead, ideally, it makes use of existing [Prettier plugins](https://prettier.io/docs/en/plugins.html#official-plugins) for those languages and only adds formatting support when they are embedded in template literals.
|
|
92
|
+
|
|
93
|
+
Therefore, to enable formatting for a specific embedded language, the corresponding Prettier plugin for that language must also be loaded. For example, if you wish to format embedded XML code, you will need to load both this plugin and [`@prettier/plugin-xml`](https://github.com/prettier/plugin-xml). To find out which other plugins are required when using this plugin, please refer to the [Language-Specific Options](#language-specific-options) section below.
|
|
94
|
+
|
|
95
|
+
Embedded languages to be formatted are required to be enclosed in the template literals, and are identified by the preceding [tags](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#tagged_templates) `` identifier`...` `` or [block comments](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#block_comments) `` /* identifier */ `...` ``. This plugin comes pre-configured with a built-in set of identifiers for identifying various embedded languages. For instance, using identifiers like `xml` or `svg` will trigger automatic formatting for the embedded XML code. You can specify an alternative list of identifiers using the `embeddedXmlIdentifiers` option. The naming convention for these options follows the pattern of `embedded<Language>Identifiers` for other languages as well. Further details on these options and how to configure them are also available in the [Language-Specific Options](#language-specific-options) section.
|
|
96
|
+
|
|
97
|
+
To exclude certain identifiers from being identified, including the default ones supported by the [`embedded-language-formatting`](https://prettier.io/docs/en/options.html#embedded-language-formatting) option, add them to the list of the `embeddedNoopIdentifiers` option. Any matching identifiers listed in this option will take precedence over other `embedded<Language>Identifiers` options, effectively disabling their formatting.
|
|
98
|
+
|
|
99
|
+
### Language-Specific Options
|
|
100
|
+
|
|
101
|
+
<details>
|
|
102
|
+
<summary>
|
|
103
|
+
Click Here
|
|
104
|
+
</summary>
|
|
105
|
+
|
|
106
|
+
#### NOOP
|
|
107
|
+
|
|
108
|
+
| Option | Default | Description |
|
|
109
|
+
| :-----------------------: | :-----: | ----------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
110
|
+
| `embeddedNoopIdentifiers` | `[]` | Tag or comment identifiers that prevent their subsequent template literals from being identified as embedded languages and from being formatted |
|
|
111
|
+
|
|
112
|
+
This doesn't require other plugins and can override the native embedded language formatting for ECMAScript code. It serves as a way to turn off embedded language formatting for specific language identifiers.
|
|
113
|
+
|
|
114
|
+
#### CSS
|
|
115
|
+
|
|
116
|
+
| Option | Default | Description |
|
|
117
|
+
| :----------------------: | :--------------------------------------: | ------------------------------------------------------------------------------------------------- |
|
|
118
|
+
| `embeddedCssIdentifiers` | [`[...]`](./src/embedded/css/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as CSS code |
|
|
119
|
+
|
|
120
|
+
Formatting embedded CSS code doesn't require other plugins and uses the parsers and printers provided by Prettier natively. This can override the native embedded language formatting for CSS code.
|
|
121
|
+
|
|
122
|
+
#### ES
|
|
123
|
+
|
|
124
|
+
| Option | Default | Description |
|
|
125
|
+
| :---------------------: | :---------------------------------------: | --------------------------------------------------------------------------------------------------------------------- |
|
|
126
|
+
| `embeddedEsIdentifiers` | [`[...]`](./src/embedded/es/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as ECMAScript (JavaScript) code |
|
|
127
|
+
| `embeddedEsParser` | [`"babel"`](./src/embedded/es/options.ts) | The parser used to parse the ECMASCript (JavaScript) code |
|
|
128
|
+
|
|
129
|
+
Formatting embedded ECMAScript code doesn't require other plugins and uses the parsers and printers provided by Prettier natively. This can override the native embedded language formatting for ECMAScript code.
|
|
130
|
+
|
|
131
|
+
#### HTML
|
|
132
|
+
|
|
133
|
+
| Option | Default | Description |
|
|
134
|
+
| :-----------------------: | :---------------------------------------: | --------------------------------------------------------------------------------------------------------------------- |
|
|
135
|
+
| `embeddedHtmlIdentifiers` | [`[...]`](./src/embedded/html/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as ECMAScript (JavaScript) code |
|
|
136
|
+
|
|
137
|
+
Formatting embedded HTML code doesn't require other plugins and uses the parsers and printers provided by Prettier natively. This can override the native embedded language formatting for HTML code.
|
|
138
|
+
|
|
139
|
+
#### Markdown
|
|
140
|
+
|
|
141
|
+
| Option | Default | Description |
|
|
142
|
+
| :---------------------------: | :-------------------------------------------: | ------------------------------------------------------------------------------------------------------ |
|
|
143
|
+
| `embeddedMarkdownIdentifiers` | [`[...]`](./src/embedded/markdown/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as Markdown code |
|
|
144
|
+
|
|
145
|
+
Formatting embedded Markdown code doesn't require other plugins and uses the parsers and printers provided by Prettier natively. This can override the native embedded language formatting for Markdown code.
|
|
146
|
+
|
|
147
|
+
#### PHP
|
|
148
|
+
|
|
149
|
+
| Option | Default | Description |
|
|
150
|
+
| :----------------------: | :--------------------------------------: | ------------------------------------------------------------------------------------------------- |
|
|
151
|
+
| `embeddedPhpIdentifiers` | [`[...]`](./src/embedded/php/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as PHP code |
|
|
152
|
+
|
|
153
|
+
Formatting embedded PHP code requires [`@prettier/plugin-php`](https://github.com/prettier/plugin-php) to be loaded as well. And [options](https://github.com/prettier/plugin-php#configuration) supported by `@prettier/plugin-php` can therefore be used to further control the formatting behavior.
|
|
154
|
+
|
|
155
|
+
#### Ruby
|
|
156
|
+
|
|
157
|
+
| Option | Default | Description |
|
|
158
|
+
| :-----------------------: | :---------------------------------------: | -------------------------------------------------------------------------------------------------- |
|
|
159
|
+
| `embeddedRubyIdentifiers` | [`[...]`](./src/embedded/ruby/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as Ruby code |
|
|
160
|
+
|
|
161
|
+
Formatting embedded Ruby code requires [`@prettier/plugin-ruby`](https://github.com/prettier/plugin-ruby) to be loaded and [its dependencies to be installed](https://github.com/prettier/plugin-ruby#getting-started) as well. And [options](https://github.com/prettier/plugin-ruby#configuration) supported by `@prettier/plugin-php` can therefore be used to further control the formatting behavior.
|
|
162
|
+
|
|
163
|
+
#### SQL
|
|
164
|
+
|
|
165
|
+
| Option | Default | Description |
|
|
166
|
+
| :----------------------: | :--------------------------------------: | ------------------------------------------------------------------------------------------------- |
|
|
167
|
+
| `embeddedSqlIdentifiers` | [`[...]`](./src/embedded/sql/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as SQL code |
|
|
168
|
+
|
|
169
|
+
Formatting embedded SQL code requires [`prettier-plugin-sql`](https://github.com/un-ts/prettier/tree/master/packages/sql#readme) to be loaded as well. And [options](https://github.com/un-ts/prettier/tree/master/packages/sql#parser-options) supported by `prettier-plugin-sql` can therefore be used to further control the formatting behavior.
|
|
170
|
+
|
|
171
|
+
Note that `prettier-plugin-sql` supports many different SQL dialects, and there's a one-to-one correspondence between the dialects and the identifiers. To support custom identifiers for a specific dialect, put the identifiers after that specific dialect in the identifier list in option `embeddedSql`.
|
|
172
|
+
|
|
173
|
+
#### TS
|
|
174
|
+
|
|
175
|
+
| Option | Default | Description |
|
|
176
|
+
| :---------------------: | :--------------------------------------------: | -------------------------------------------------------------------------------------------------------- |
|
|
177
|
+
| `embeddedTsIdentifiers` | [`[...]`](./src/embedded/ts/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as TypeScript code |
|
|
178
|
+
| `embeddedTsParser` | [`"typescript"`](./src/embedded/ts/options.ts) | The parser used to parse the TypeScript code |
|
|
179
|
+
|
|
180
|
+
Formatting embedded TypeScript code doesn't require other plugins and uses the parsers and printers provided by Prettier natively. This can override the native embedded language formatting for TypeScript code.
|
|
181
|
+
|
|
182
|
+
#### XML
|
|
183
|
+
|
|
184
|
+
| Option | Default | Description |
|
|
185
|
+
| :----------------------: | :--------------------------------------: | ------------------------------------------------------------------------------------------------- |
|
|
186
|
+
| `embeddedXmlIdentifiers` | [`[...]`](./src/embedded/xml/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as XML code |
|
|
187
|
+
|
|
188
|
+
Formatting embedded XML code requires [`@prettier/plugin-xml`](https://github.com/prettier/plugin-xml) to be loaded as well. And [options](https://github.com/prettier/plugin-xml#configuration) supported by `@prettier/plugin-xml` can therefore be used to further control the formatting behavior.
|
|
189
|
+
|
|
190
|
+
</details>
|
|
191
|
+
|
|
192
|
+
### Language-Agnostic Options
|
|
193
|
+
|
|
194
|
+
| Option | Default | Description |
|
|
195
|
+
| :-----------------------------------: | :-----: | ------------------------------------------------------------------------------------------------------------------------------ |
|
|
196
|
+
| `noEmbeddedIdentificationByComment` | `[]` | Turns off `` /* identifier */ `...` `` comment-based language identification for the specified identifiers |
|
|
197
|
+
| `noEmbeddedIdentificationByTag` | `[]` | Turns off `` identifier`...` `` tag-based language identification for the specified identifiers |
|
|
198
|
+
| `preserveEmbeddedExteriorWhitespaces` | `[]` | Preserves leading and trailing whitespaces in the formatting results for the specified identifiers |
|
|
199
|
+
| `noEmbeddedMultiLineIndentation` | `[]` | Turns off auto indentation in the formatting results when they are formatted to span multi lines for the specified identifiers |
|
|
200
|
+
|
|
201
|
+
## Demos
|
|
202
|
+
|
|
203
|
+
TBD.
|
|
204
|
+
|
|
205
|
+
## Contributing
|
|
206
|
+
|
|
207
|
+
Bug fixes, new language support and tests are welcome. Please have a look at the project structure before getting started. Feel free to leave questions or suggestions.
|
|
208
|
+
|
|
209
|
+
## License
|
|
210
|
+
|
|
211
|
+
MIT
|
package/README.md
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
<div align="center">
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
|
|
5
4
|
|
|
6
5
|
# Prettier Plugin Embed
|
|
7
6
|
|
|
7
|
+
[](https://www.npmjs.com/package/prettier-plugin-embed/v/latest) [](https://www.npmjs.com/package/prettier-plugin-embed/v/latest) [](https://cdn.jsdelivr.net/npm/prettier-plugin-embed@latest/)
|
|
8
|
+
|
|
8
9
|
A Configurable [Prettier](https://prettier.io/) [Plugin](https://prettier.io/docs/en/plugins.html) to Format [Embedded Languages](https://prettier.io/docs/en/options.html#embedded-language-formatting) in `js`/`ts` Files.
|
|
9
10
|
|
|
10
11
|
```bash
|
|
@@ -84,15 +85,15 @@ await prettier.format(code, {
|
|
|
84
85
|
|
|
85
86
|
### An Overview of the Philosophy
|
|
86
87
|
|
|
87
|
-
To use this plugin, `embedded-language-formatting` option must be set to `auto` (which is the default setting as of now), because this option serves as the main switch for activating embedded language formatting.
|
|
88
|
+
To use this plugin, [`embedded-language-formatting`](https://prettier.io/docs/en/options.html#embedded-language-formatting) option must be set to `auto` (which is the default setting as of now), because this option serves as the main switch for activating embedded language formatting.
|
|
88
89
|
|
|
89
|
-
This plugin does not aim to implement parsers or printers to support every newly added embedded language. Instead, ideally, it makes use of existing [Prettier plugins](https://prettier.io/docs/en/plugins.html#official-plugins) for those languages and only adds formatting support when they are embedded.
|
|
90
|
+
This plugin does not aim to implement parsers or printers to support every newly added embedded language. Instead, ideally, it makes use of existing [Prettier plugins](https://prettier.io/docs/en/plugins.html#official-plugins) for those languages and only adds formatting support when they are embedded in template literals.
|
|
90
91
|
|
|
91
92
|
Therefore, to enable formatting for a specific embedded language, the corresponding Prettier plugin for that language must also be loaded. For example, if you wish to format embedded XML code, you will need to load both this plugin and [`@prettier/plugin-xml`](https://github.com/prettier/plugin-xml). To find out which other plugins are required when using this plugin, please refer to the [Language-Specific Options](#language-specific-options) section below.
|
|
92
93
|
|
|
93
|
-
Embedded languages to be formatted are required to be enclosed in the template literals, and are identified by the preceding [tags](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#tagged_templates) `` identifier`...` `` or block comments `` /* identifier */ `...` ``. This plugin comes pre-configured with a built-in set of identifiers for identifying various embedded languages. For instance, using identifiers like `xml` or `svg` will trigger automatic formatting for the embedded XML code. You can specify an alternative list of identifiers using the `
|
|
94
|
+
Embedded languages to be formatted are required to be enclosed in the template literals, and are identified by the preceding [tags](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#tagged_templates) `` identifier`...` `` or [block comments](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#block_comments) `` /* identifier */ `...` ``. This plugin comes pre-configured with a built-in set of identifiers for identifying various embedded languages. For instance, using identifiers like `xml` or `svg` will trigger automatic formatting for the embedded XML code. You can specify an alternative list of identifiers using the `embeddedXmlIdentifiers` option. The naming convention for these options follows the pattern of `embedded<Language>Identifiers` for other languages as well. Further details on these options and how to configure them are also available in the [Language-Specific Options](#language-specific-options) section.
|
|
94
95
|
|
|
95
|
-
To exclude certain identifiers from being identified, including the default ones supported by the `embedded-language-formatting` option, add them to the list of the `
|
|
96
|
+
To exclude certain identifiers from being identified, including the default ones supported by the [`embedded-language-formatting`](https://prettier.io/docs/en/options.html#embedded-language-formatting) option, add them to the list of the `embeddedNoopIdentifiers` option. Any matching identifiers listed in this option will take precedence over other `embedded<Language>Identifiers` options, effectively disabling their formatting.
|
|
96
97
|
|
|
97
98
|
### Language-Specific Options
|
|
98
99
|
|
|
@@ -103,42 +104,66 @@ Click Here
|
|
|
103
104
|
|
|
104
105
|
#### NOOP
|
|
105
106
|
|
|
106
|
-
|
|
|
107
|
-
|
|
|
108
|
-
| `
|
|
107
|
+
| Option | Default | Description |
|
|
108
|
+
| :-----------------------: | :-----: | ----------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
109
|
+
| `embeddedNoopIdentifiers` | `[]` | Tag or comment identifiers that prevent their subsequent template literals from being identified as embedded languages and from being formatted |
|
|
109
110
|
|
|
110
111
|
This doesn't require other plugins and can override the native embedded language formatting for ECMAScript code. It serves as a way to turn off embedded language formatting for specific language identifiers.
|
|
111
112
|
|
|
113
|
+
#### CSS
|
|
114
|
+
|
|
115
|
+
| Option | Default | Description |
|
|
116
|
+
| :----------------------: | :--------------------------------------: | ------------------------------------------------------------------------------------------------- |
|
|
117
|
+
| `embeddedCssIdentifiers` | [`[...]`](./src/embedded/css/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as CSS code |
|
|
118
|
+
|
|
119
|
+
Formatting embedded CSS code doesn't require other plugins and uses the parsers and printers provided by Prettier natively. This can override the native embedded language formatting for CSS code.
|
|
120
|
+
|
|
112
121
|
#### ES
|
|
113
122
|
|
|
114
|
-
|
|
|
115
|
-
|
|
|
116
|
-
|
|
|
117
|
-
|
|
|
123
|
+
| Option | Default | Description |
|
|
124
|
+
| :---------------------: | :---------------------------------------: | --------------------------------------------------------------------------------------------------------------------- |
|
|
125
|
+
| `embeddedEsIdentifiers` | [`[...]`](./src/embedded/es/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as ECMAScript (JavaScript) code |
|
|
126
|
+
| `embeddedEsParser` | [`"babel"`](./src/embedded/es/options.ts) | The parser used to parse the ECMASCript (JavaScript) code |
|
|
118
127
|
|
|
119
128
|
Formatting embedded ECMAScript code doesn't require other plugins and uses the parsers and printers provided by Prettier natively. This can override the native embedded language formatting for ECMAScript code.
|
|
120
129
|
|
|
121
130
|
#### HTML
|
|
122
131
|
|
|
123
|
-
|
|
|
124
|
-
|
|
|
125
|
-
| `
|
|
132
|
+
| Option | Default | Description |
|
|
133
|
+
| :-----------------------: | :---------------------------------------: | --------------------------------------------------------------------------------------------------------------------- |
|
|
134
|
+
| `embeddedHtmlIdentifiers` | [`[...]`](./src/embedded/html/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as ECMAScript (JavaScript) code |
|
|
126
135
|
|
|
127
136
|
Formatting embedded HTML code doesn't require other plugins and uses the parsers and printers provided by Prettier natively. This can override the native embedded language formatting for HTML code.
|
|
128
137
|
|
|
138
|
+
#### Markdown
|
|
139
|
+
|
|
140
|
+
| Option | Default | Description |
|
|
141
|
+
| :---------------------------: | :-------------------------------------------: | ------------------------------------------------------------------------------------------------------ |
|
|
142
|
+
| `embeddedMarkdownIdentifiers` | [`[...]`](./src/embedded/markdown/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as Markdown code |
|
|
143
|
+
|
|
144
|
+
Formatting embedded Markdown code doesn't require other plugins and uses the parsers and printers provided by Prettier natively. This can override the native embedded language formatting for Markdown code.
|
|
145
|
+
|
|
129
146
|
#### PHP
|
|
130
147
|
|
|
131
|
-
|
|
|
132
|
-
|
|
|
133
|
-
| `
|
|
148
|
+
| Option | Default | Description |
|
|
149
|
+
| :----------------------: | :--------------------------------------: | ------------------------------------------------------------------------------------------------- |
|
|
150
|
+
| `embeddedPhpIdentifiers` | [`[...]`](./src/embedded/php/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as PHP code |
|
|
134
151
|
|
|
135
152
|
Formatting embedded PHP code requires [`@prettier/plugin-php`](https://github.com/prettier/plugin-php) to be loaded as well. And [options](https://github.com/prettier/plugin-php#configuration) supported by `@prettier/plugin-php` can therefore be used to further control the formatting behavior.
|
|
136
153
|
|
|
154
|
+
#### Ruby
|
|
155
|
+
|
|
156
|
+
| Option | Default | Description |
|
|
157
|
+
| :-----------------------: | :---------------------------------------: | -------------------------------------------------------------------------------------------------- |
|
|
158
|
+
| `embeddedRubyIdentifiers` | [`[...]`](./src/embedded/ruby/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as Ruby code |
|
|
159
|
+
|
|
160
|
+
Formatting embedded Ruby code requires [`@prettier/plugin-ruby`](https://github.com/prettier/plugin-ruby) to be loaded and [its dependencies to be installed](https://github.com/prettier/plugin-ruby#getting-started) as well. And [options](https://github.com/prettier/plugin-ruby#configuration) supported by `@prettier/plugin-php` can therefore be used to further control the formatting behavior.
|
|
161
|
+
|
|
137
162
|
#### SQL
|
|
138
163
|
|
|
139
|
-
|
|
|
140
|
-
|
|
|
141
|
-
| `
|
|
164
|
+
| Option | Default | Description |
|
|
165
|
+
| :----------------------: | :--------------------------------------: | ------------------------------------------------------------------------------------------------- |
|
|
166
|
+
| `embeddedSqlIdentifiers` | [`[...]`](./src/embedded/sql/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as SQL code |
|
|
142
167
|
|
|
143
168
|
Formatting embedded SQL code requires [`prettier-plugin-sql`](https://github.com/un-ts/prettier/tree/master/packages/sql#readme) to be loaded as well. And [options](https://github.com/un-ts/prettier/tree/master/packages/sql#parser-options) supported by `prettier-plugin-sql` can therefore be used to further control the formatting behavior.
|
|
144
169
|
|
|
@@ -146,18 +171,18 @@ Note that `prettier-plugin-sql` supports many different SQL dialects, and there'
|
|
|
146
171
|
|
|
147
172
|
#### TS
|
|
148
173
|
|
|
149
|
-
|
|
|
150
|
-
|
|
|
151
|
-
|
|
|
152
|
-
|
|
|
174
|
+
| Option | Default | Description |
|
|
175
|
+
| :---------------------: | :--------------------------------------------: | -------------------------------------------------------------------------------------------------------- |
|
|
176
|
+
| `embeddedTsIdentifiers` | [`[...]`](./src/embedded/ts/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as TypeScript code |
|
|
177
|
+
| `embeddedTsParser` | [`"typescript"`](./src/embedded/ts/options.ts) | The parser used to parse the TypeScript code |
|
|
153
178
|
|
|
154
179
|
Formatting embedded TypeScript code doesn't require other plugins and uses the parsers and printers provided by Prettier natively. This can override the native embedded language formatting for TypeScript code.
|
|
155
180
|
|
|
156
181
|
#### XML
|
|
157
182
|
|
|
158
|
-
|
|
|
159
|
-
|
|
|
160
|
-
| `
|
|
183
|
+
| Option | Default | Description |
|
|
184
|
+
| :----------------------: | :--------------------------------------: | ------------------------------------------------------------------------------------------------- |
|
|
185
|
+
| `embeddedXmlIdentifiers` | [`[...]`](./src/embedded/xml/options.ts) | Tag or comment identifiers that make their subsequent template literals be identified as XML code |
|
|
161
186
|
|
|
162
187
|
Formatting embedded XML code requires [`@prettier/plugin-xml`](https://github.com/prettier/plugin-xml) to be loaded as well. And [options](https://github.com/prettier/plugin-xml#configuration) supported by `@prettier/plugin-xml` can therefore be used to further control the formatting behavior.
|
|
163
188
|
|
|
@@ -165,12 +190,12 @@ Formatting embedded XML code requires [`@prettier/plugin-xml`](https://github.co
|
|
|
165
190
|
|
|
166
191
|
### Language-Agnostic Options
|
|
167
192
|
|
|
168
|
-
| Option | Default | Description
|
|
169
|
-
| :-----------------------------------: | :-----: |
|
|
170
|
-
| `noEmbeddedIdentificationByComment` | `[]` | Turns off `` /* identifier */ `...` `` comment-based language identification for the specified identifiers
|
|
171
|
-
| `noEmbeddedIdentificationByTag` | `[]` | Turns off `` identifier`...` `` tag-based language identification for the specified identifiers
|
|
172
|
-
| `preserveEmbeddedExteriorWhitespaces` | `[]` | Preserves leading and trailing whitespaces in the formatting results for the specified identifiers
|
|
173
|
-
| `noEmbeddedMultiLineIndentation` | `[]` |
|
|
193
|
+
| Option | Default | Description |
|
|
194
|
+
| :-----------------------------------: | :-----: | ------------------------------------------------------------------------------------------------------------------------------ |
|
|
195
|
+
| `noEmbeddedIdentificationByComment` | `[]` | Turns off `` /* identifier */ `...` `` comment-based language identification for the specified identifiers |
|
|
196
|
+
| `noEmbeddedIdentificationByTag` | `[]` | Turns off `` identifier`...` `` tag-based language identification for the specified identifiers |
|
|
197
|
+
| `preserveEmbeddedExteriorWhitespaces` | `[]` | Preserves leading and trailing whitespaces in the formatting results for the specified identifiers |
|
|
198
|
+
| `noEmbeddedMultiLineIndentation` | `[]` | Turns off auto indentation in the formatting results when they are formatted to span multi lines for the specified identifiers |
|
|
174
199
|
|
|
175
200
|
## Demos
|
|
176
201
|
|
|
@@ -178,7 +203,7 @@ TBD.
|
|
|
178
203
|
|
|
179
204
|
## Contributing
|
|
180
205
|
|
|
181
|
-
|
|
206
|
+
Bug fixes, new language support and tests are welcome. Please have a look at the project structure before getting started. Feel free to leave questions or suggestions.
|
|
182
207
|
|
|
183
208
|
## License
|
|
184
209
|
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { type Options } from "prettier";
|
|
2
|
+
import type { Embedder } from "../../types.js";
|
|
3
|
+
import { embeddedLanguage } from "./embedded-language.js";
|
|
4
|
+
export declare const embedder: Embedder<Options>;
|
|
5
|
+
declare module "../types.js" {
|
|
6
|
+
interface EmbeddedEmbedders {
|
|
7
|
+
[embeddedLanguage]: typeof embedder;
|
|
8
|
+
}
|
|
9
|
+
}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { type AutocompleteStringList, type StringListToInterfaceKey } from "../utils.js";
|
|
2
|
+
/** References:
|
|
3
|
+
* - https://github.com/microsoft/vscode/blob/de0121cf0e05d1673903551b6dbb2871556bfae9/extensions/css/package.json#L22
|
|
4
|
+
* - https://github.com/github-linguist/linguist/blob/7ca3799b8b5f1acde1dd7a8dfb7ae849d3dfb4cd/lib/linguist/languages.yml#L887
|
|
5
|
+
*/
|
|
6
|
+
declare const DEFAULT_IDENTIFIERS: readonly ["css"];
|
|
7
|
+
type Identifiers = AutocompleteStringList<typeof DEFAULT_IDENTIFIERS>;
|
|
8
|
+
type DefaultIdentifiersHolder = StringListToInterfaceKey<typeof DEFAULT_IDENTIFIERS>;
|
|
9
|
+
declare const embeddedLanguageIdentifiersOptionName: "embeddedCssIdentifiers";
|
|
10
|
+
export interface PrettierPluginDepsOptions {
|
|
11
|
+
}
|
|
12
|
+
export declare const options: {
|
|
13
|
+
embeddedCssIdentifiers: {
|
|
14
|
+
category: "Global";
|
|
15
|
+
type: "string";
|
|
16
|
+
array: true;
|
|
17
|
+
default: {
|
|
18
|
+
value: "css"[];
|
|
19
|
+
}[];
|
|
20
|
+
description: string;
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
|
+
type Options = typeof options;
|
|
24
|
+
declare module "../types.js" {
|
|
25
|
+
interface EmbeddedOptions extends Options {
|
|
26
|
+
}
|
|
27
|
+
interface EmbeddedDefaultIdentifiersHolder extends DefaultIdentifiersHolder {
|
|
28
|
+
}
|
|
29
|
+
interface PrettierPluginEmbedOptions {
|
|
30
|
+
[embeddedLanguageIdentifiersOptionName]?: Identifiers;
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
declare module "prettier" {
|
|
34
|
+
interface Options extends PrettierPluginDepsOptions {
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
export {};
|
|
@@ -1,15 +1,19 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { type AutocompleteStringList, type StringListToInterfaceKey } from "../utils.js";
|
|
2
|
+
/** References:
|
|
3
|
+
* - https://github.com/microsoft/vscode/blob/de0121cf0e05d1673903551b6dbb2871556bfae9/extensions/javascript/package.json#L37
|
|
4
|
+
* - https://github.com/github-linguist/linguist/blob/7ca3799b8b5f1acde1dd7a8dfb7ae849d3dfb4cd/lib/linguist/languages.yml#L3314
|
|
5
|
+
*/
|
|
3
6
|
declare const DEFAULT_IDENTIFIERS: readonly ["js", "es", "es6", "mjs", "cjs", "pac", "javascript"];
|
|
4
|
-
type Identifiers =
|
|
5
|
-
type DefaultIdentifiersHolder =
|
|
7
|
+
type Identifiers = AutocompleteStringList<typeof DEFAULT_IDENTIFIERS>;
|
|
8
|
+
type DefaultIdentifiersHolder = StringListToInterfaceKey<typeof DEFAULT_IDENTIFIERS>;
|
|
6
9
|
declare const DEFAULT_ES_PARSERS: readonly ["babel", "babel-flow", "acorn", "espree", "flow", "meriyah"];
|
|
7
10
|
type EsParser = (typeof DEFAULT_ES_PARSERS)[number];
|
|
8
|
-
declare const
|
|
11
|
+
declare const embeddedLanguageIdentifiersOptionName: "embeddedEsIdentifiers";
|
|
12
|
+
declare const embeddedLanguageParserOptionName: "embeddedEsParser";
|
|
9
13
|
export interface PrettierPluginDepsOptions {
|
|
10
14
|
}
|
|
11
15
|
export declare const options: {
|
|
12
|
-
|
|
16
|
+
embeddedEsIdentifiers: {
|
|
13
17
|
category: "Global";
|
|
14
18
|
type: "string";
|
|
15
19
|
array: true;
|
|
@@ -33,8 +37,8 @@ declare module "../types.js" {
|
|
|
33
37
|
interface EmbeddedDefaultIdentifiersHolder extends DefaultIdentifiersHolder {
|
|
34
38
|
}
|
|
35
39
|
interface PrettierPluginEmbedOptions {
|
|
36
|
-
[
|
|
37
|
-
[
|
|
40
|
+
[embeddedLanguageIdentifiersOptionName]?: Identifiers;
|
|
41
|
+
[embeddedLanguageParserOptionName]?: EsParser;
|
|
38
42
|
}
|
|
39
43
|
}
|
|
40
44
|
declare module "prettier" {
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { Options } from "prettier";
|
|
2
|
+
import type { Embedder } from "../../types.js";
|
|
3
|
+
import { embeddedLanguage } from "./embedded-language.js";
|
|
4
|
+
export declare const embedder: Embedder<Options>;
|
|
5
|
+
declare module "../types.js" {
|
|
6
|
+
interface EmbeddedEmbedders {
|
|
7
|
+
[embeddedLanguage]: typeof embedder;
|
|
8
|
+
}
|
|
9
|
+
}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { type AutocompleteStringList, type StringListToInterfaceKey } from "../utils.js";
|
|
2
|
+
/** References:
|
|
3
|
+
* - https://github.com/NaridaL/glsl-language-toolkit/blob/a7bd08d3f31355b335ae002b6a44c2999998b952/packages/prettier-plugin-glsl/src/prettier-plugin.ts#L88
|
|
4
|
+
* - https://github.com/github-linguist/linguist/blob/7ca3799b8b5f1acde1dd7a8dfb7ae849d3dfb4cd/lib/linguist/languages.yml#L2180
|
|
5
|
+
*/
|
|
6
|
+
declare const DEFAULT_IDENTIFIERS: readonly ["glsl", "fp", "frag", "frg", "fs", "fsh", "fshader", "geo", "geom", "glslf", "glslv", "gs", "gshader", "rchit", "rmiss", "shader", "tesc", "tese", "vert", "vrx", "vsh", "vshader"];
|
|
7
|
+
type Identifiers = AutocompleteStringList<typeof DEFAULT_IDENTIFIERS>;
|
|
8
|
+
type DefaultIdentifiersHolder = StringListToInterfaceKey<typeof DEFAULT_IDENTIFIERS>;
|
|
9
|
+
declare const embeddedLanguageIdentifiers: "embeddedGlslIdentifiers";
|
|
10
|
+
export interface PrettierPluginDepsOptions {
|
|
11
|
+
}
|
|
12
|
+
export declare const options: {
|
|
13
|
+
embeddedGlslIdentifiers: {
|
|
14
|
+
category: "Global";
|
|
15
|
+
type: "string";
|
|
16
|
+
array: true;
|
|
17
|
+
default: {
|
|
18
|
+
value: ("glsl" | "fp" | "frag" | "frg" | "fs" | "fsh" | "fshader" | "geo" | "geom" | "glslf" | "glslv" | "gs" | "gshader" | "rchit" | "rmiss" | "shader" | "tesc" | "tese" | "vert" | "vrx" | "vsh" | "vshader")[];
|
|
19
|
+
}[];
|
|
20
|
+
description: string;
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
|
+
type Options = typeof options;
|
|
24
|
+
declare module "../types.js" {
|
|
25
|
+
interface EmbeddedOptions extends Options {
|
|
26
|
+
}
|
|
27
|
+
interface EmbeddedDefaultIdentifiersHolder extends DefaultIdentifiersHolder {
|
|
28
|
+
}
|
|
29
|
+
interface PrettierPluginEmbedOptions {
|
|
30
|
+
[embeddedLanguageIdentifiers]?: Identifiers;
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
declare module "prettier" {
|
|
34
|
+
interface Options extends PrettierPluginDepsOptions {
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
export {};
|
|
@@ -1,12 +1,16 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { type AutocompleteStringList, type StringListToInterfaceKey } from "../utils.js";
|
|
2
|
+
/** References
|
|
3
|
+
* - https://github.com/microsoft/vscode/blob/de0121cf0e05d1673903551b6dbb2871556bfae9/extensions/html/package.json#L18
|
|
4
|
+
* - https://github.com/github-linguist/linguist/blob/7ca3799b8b5f1acde1dd7a8dfb7ae849d3dfb4cd/lib/linguist/languages.yml#L2684
|
|
5
|
+
*/
|
|
3
6
|
declare const DEFAULT_IDENTIFIERS: readonly ["html", "htm", "shtml", "xhtml", "xht", "mdoc", "jsp", "asp", "aspx", "jshtm", "volt", "rhtml"];
|
|
4
|
-
type Identifiers =
|
|
5
|
-
type DefaultIdentifiersHolder =
|
|
7
|
+
type Identifiers = AutocompleteStringList<typeof DEFAULT_IDENTIFIERS>;
|
|
8
|
+
type DefaultIdentifiersHolder = StringListToInterfaceKey<typeof DEFAULT_IDENTIFIERS>;
|
|
9
|
+
declare const embeddedLanguageIdentifiers: "embeddedHtmlIdentifiers";
|
|
6
10
|
export interface PrettierPluginDepsOptions {
|
|
7
11
|
}
|
|
8
12
|
export declare const options: {
|
|
9
|
-
|
|
13
|
+
embeddedHtmlIdentifiers: {
|
|
10
14
|
category: "Global";
|
|
11
15
|
type: "string";
|
|
12
16
|
array: true;
|
|
@@ -23,7 +27,7 @@ declare module "../types.js" {
|
|
|
23
27
|
interface EmbeddedDefaultIdentifiersHolder extends DefaultIdentifiersHolder {
|
|
24
28
|
}
|
|
25
29
|
interface PrettierPluginEmbedOptions {
|
|
26
|
-
[
|
|
30
|
+
[embeddedLanguageIdentifiers]?: Identifiers;
|
|
27
31
|
}
|
|
28
32
|
}
|
|
29
33
|
declare module "prettier" {
|
package/dist/embedded/index.d.ts
CHANGED
|
@@ -1,2 +1,3 @@
|
|
|
1
1
|
export * from "./register.js";
|
|
2
2
|
export type { EmbeddedLanguage, EmbeddedParsers, EmbeddedEmbedders, EmbeddedOptions, EmbeddedDefaultIdentifier, PrettierPluginEmbedOptions, } from "./types.js";
|
|
3
|
+
export { makeIdentifiersOptionName as makeIdentifiersName, type AutocompleteStringList, } from "./utils.js";
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { type Options } from "prettier";
|
|
2
|
+
import type { Embedder } from "../../types.js";
|
|
3
|
+
import { embeddedLanguage } from "./embedded-language.js";
|
|
4
|
+
export declare const embedder: Embedder<Options>;
|
|
5
|
+
declare module "../types.js" {
|
|
6
|
+
interface EmbeddedEmbedders {
|
|
7
|
+
[embeddedLanguage]: typeof embedder;
|
|
8
|
+
}
|
|
9
|
+
}
|