Release 2.4.0
This commit is contained in:
sosukesuzuki committed
1 parent
62a2629743
commit
e49951e5a3
9 files changed
+76
-31
No files matched your search
@@ -26,7 +26,7 @@ Don't fill the form below manually! Let a program create a report for you:
|
||||
|
||||
-->
|
||||
|
||||
**Prettier 2.3.2**
|
||||
**Prettier 2.4.0**
|
||||
[Playground link](https://prettier.io/playground/#.....)
|
||||
|
||||
```sh
|
||||
|
||||
@@ -20,7 +20,7 @@ BEFORE SUBMITTING AN ISSUE:
|
||||
|
||||
**Environments:**
|
||||
|
||||
- Prettier Version: 2.3.2
|
||||
- Prettier Version: 2.4.0
|
||||
- Running Prettier via: <!-- CLI, Node.js API, Browser API, etc. -->
|
||||
- Runtime: <!-- Node.js v14, Chrome v83, etc. -->
|
||||
- Operating System: <!-- Windows, Linux, macOS, etc. -->
|
||||
|
||||
@@ -1,3 +1,9 @@
|
||||
# 2.4.0
|
||||
|
||||
[diff](https://github.com/prettier/prettier/compare/2.3.2...2.4.0)
|
||||
|
||||
🔗 [Release Notes](https://prettier.io/blog/2021/09/09/2.4.0.html)
|
||||
|
||||
# 2.3.2
|
||||
|
||||
[diff](https://github.com/prettier/prettier/compare/2.3.1...2.3.2)
|
||||
|
||||
+13
-13
@@ -32,8 +32,8 @@ See below for examples.
|
||||
### Global
|
||||
|
||||
```html
|
||||
<script src="https://unpkg.com/prettier@2.3.2/standalone.js"></script>
|
||||
<script src="https://unpkg.com/prettier@2.3.2/parser-graphql.js"></script>
|
||||
<script src="https://unpkg.com/prettier@2.4.0/standalone.js"></script>
|
||||
<script src="https://unpkg.com/prettier@2.4.0/parser-graphql.js"></script>
|
||||
<script>
|
||||
prettier.format("type Query { hello: String }", {
|
||||
parser: "graphql",
|
||||
@@ -48,8 +48,8 @@ Note that the [`unpkg` field](https://unpkg.com/#examples) in Prettier’s `pack
|
||||
|
||||
```html
|
||||
<script type="module">
|
||||
import prettier from "https://unpkg.com/prettier@2.3.2/esm/standalone.mjs";
|
||||
import parserGraphql from "https://unpkg.com/prettier@2.3.2/esm/parser-graphql.mjs";
|
||||
import prettier from "https://unpkg.com/prettier@2.4.0/esm/standalone.mjs";
|
||||
import parserGraphql from "https://unpkg.com/prettier@2.4.0/esm/parser-graphql.mjs";
|
||||
|
||||
prettier.format("type Query { hello: String }", {
|
||||
parser: "graphql",
|
||||
@@ -62,8 +62,8 @@ Note that the [`unpkg` field](https://unpkg.com/#examples) in Prettier’s `pack
|
||||
|
||||
```js
|
||||
define([
|
||||
"https://unpkg.com/prettier@2.3.2/standalone.js",
|
||||
"https://unpkg.com/prettier@2.3.2/parser-graphql.js",
|
||||
"https://unpkg.com/prettier@2.4.0/standalone.js",
|
||||
"https://unpkg.com/prettier@2.4.0/parser-graphql.js",
|
||||
], (prettier, ...plugins) => {
|
||||
prettier.format("type Query { hello: String }", {
|
||||
parser: "graphql",
|
||||
@@ -88,8 +88,8 @@ This syntax doesn’t necessarily work in the browser, but it can be used when b
|
||||
### Worker
|
||||
|
||||
```js
|
||||
importScripts("https://unpkg.com/prettier@2.3.2/standalone.js");
|
||||
importScripts("https://unpkg.com/prettier@2.3.2/parser-graphql.js");
|
||||
importScripts("https://unpkg.com/prettier@2.4.0/standalone.js");
|
||||
importScripts("https://unpkg.com/prettier@2.4.0/parser-graphql.js");
|
||||
prettier.format("type Query { hello: String }", {
|
||||
parser: "graphql",
|
||||
plugins: prettierPlugins,
|
||||
@@ -102,8 +102,8 @@ If you want to format [embedded code](options.md#embedded-language-formatting),
|
||||
|
||||
```html
|
||||
<script type="module">
|
||||
import prettier from "https://unpkg.com/prettier@2.3.2/esm/standalone.mjs";
|
||||
import parserBabel from "https://unpkg.com/prettier@2.3.2/esm/parser-babel.mjs";
|
||||
import prettier from "https://unpkg.com/prettier@2.4.0/esm/standalone.mjs";
|
||||
import parserBabel from "https://unpkg.com/prettier@2.4.0/esm/parser-babel.mjs";
|
||||
|
||||
console.log(
|
||||
prettier.format("const html=/* HTML */ `<DIV> </DIV>`", {
|
||||
@@ -119,9 +119,9 @@ The HTML code embedded in JavaScript stays unformatted because the `html` parser
|
||||
|
||||
```html
|
||||
<script type="module">
|
||||
import prettier from "https://unpkg.com/prettier@2.3.2/esm/standalone.mjs";
|
||||
import parserBabel from "https://unpkg.com/prettier@2.3.2/esm/parser-babel.mjs";
|
||||
import parserHtml from "https://unpkg.com/prettier@2.3.2/esm/parser-html.mjs";
|
||||
import prettier from "https://unpkg.com/prettier@2.4.0/esm/standalone.mjs";
|
||||
import parserBabel from "https://unpkg.com/prettier@2.4.0/esm/parser-babel.mjs";
|
||||
import parserHtml from "https://unpkg.com/prettier@2.4.0/esm/parser-html.mjs";
|
||||
|
||||
console.log(
|
||||
prettier.format("const html=/* HTML */ `<DIV> </DIV>`", {
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "prettier",
|
||||
"version": "2.4.0-dev",
|
||||
"version": "2.4.0",
|
||||
"description": "Prettier is an opinionated code formatter",
|
||||
"bin": "./bin/prettier.js",
|
||||
"repository": "prettier/prettier",
|
||||
|
||||
@@ -33,8 +33,8 @@ See below for examples.
|
||||
### Global
|
||||
|
||||
```html
|
||||
<script src="https://unpkg.com/prettier@2.3.2/standalone.js"></script>
|
||||
<script src="https://unpkg.com/prettier@2.3.2/parser-graphql.js"></script>
|
||||
<script src="https://unpkg.com/prettier@2.4.0/standalone.js"></script>
|
||||
<script src="https://unpkg.com/prettier@2.4.0/parser-graphql.js"></script>
|
||||
<script>
|
||||
prettier.format("type Query { hello: String }", {
|
||||
parser: "graphql",
|
||||
@@ -49,8 +49,8 @@ Note that the [`unpkg` field](https://unpkg.com/#examples) in Prettier’s `pack
|
||||
|
||||
```html
|
||||
<script type="module">
|
||||
import prettier from "https://unpkg.com/prettier@2.3.2/esm/standalone.mjs";
|
||||
import parserGraphql from "https://unpkg.com/prettier@2.3.2/esm/parser-graphql.mjs";
|
||||
import prettier from "https://unpkg.com/prettier@2.4.0/esm/standalone.mjs";
|
||||
import parserGraphql from "https://unpkg.com/prettier@2.4.0/esm/parser-graphql.mjs";
|
||||
|
||||
prettier.format("type Query { hello: String }", {
|
||||
parser: "graphql",
|
||||
@@ -63,8 +63,8 @@ Note that the [`unpkg` field](https://unpkg.com/#examples) in Prettier’s `pack
|
||||
|
||||
```js
|
||||
define([
|
||||
"https://unpkg.com/prettier@2.3.2/standalone.js",
|
||||
"https://unpkg.com/prettier@2.3.2/parser-graphql.js",
|
||||
"https://unpkg.com/prettier@2.4.0/standalone.js",
|
||||
"https://unpkg.com/prettier@2.4.0/parser-graphql.js",
|
||||
], (prettier, ...plugins) => {
|
||||
prettier.format("type Query { hello: String }", {
|
||||
parser: "graphql",
|
||||
@@ -89,8 +89,8 @@ This syntax doesn’t necessarily work in the browser, but it can be used when b
|
||||
### Worker
|
||||
|
||||
```js
|
||||
importScripts("https://unpkg.com/prettier@2.3.2/standalone.js");
|
||||
importScripts("https://unpkg.com/prettier@2.3.2/parser-graphql.js");
|
||||
importScripts("https://unpkg.com/prettier@2.4.0/standalone.js");
|
||||
importScripts("https://unpkg.com/prettier@2.4.0/parser-graphql.js");
|
||||
prettier.format("type Query { hello: String }", {
|
||||
parser: "graphql",
|
||||
plugins: prettierPlugins,
|
||||
@@ -103,8 +103,8 @@ If you want to format [embedded code](options.md#embedded-language-formatting),
|
||||
|
||||
```html
|
||||
<script type="module">
|
||||
import prettier from "https://unpkg.com/prettier@2.3.2/esm/standalone.mjs";
|
||||
import parserBabel from "https://unpkg.com/prettier@2.3.2/esm/parser-babel.mjs";
|
||||
import prettier from "https://unpkg.com/prettier@2.4.0/esm/standalone.mjs";
|
||||
import parserBabel from "https://unpkg.com/prettier@2.4.0/esm/parser-babel.mjs";
|
||||
|
||||
console.log(
|
||||
prettier.format("const html=/* HTML */ `<DIV> </DIV>`", {
|
||||
@@ -120,9 +120,9 @@ The HTML code embedded in JavaScript stays unformatted because the `html` parser
|
||||
|
||||
```html
|
||||
<script type="module">
|
||||
import prettier from "https://unpkg.com/prettier@2.3.2/esm/standalone.mjs";
|
||||
import parserBabel from "https://unpkg.com/prettier@2.3.2/esm/parser-babel.mjs";
|
||||
import parserHtml from "https://unpkg.com/prettier@2.3.2/esm/parser-html.mjs";
|
||||
import prettier from "https://unpkg.com/prettier@2.4.0/esm/standalone.mjs";
|
||||
import parserBabel from "https://unpkg.com/prettier@2.4.0/esm/parser-babel.mjs";
|
||||
import parserHtml from "https://unpkg.com/prettier@2.4.0/esm/parser-html.mjs";
|
||||
|
||||
console.log(
|
||||
prettier.format("const html=/* HTML */ `<DIV> </DIV>`", {
|
||||
|
||||
@@ -121,6 +121,8 @@ For example, you can do the following to have Prettier run before each commit:
|
||||
|
||||
<!--END_DOCUSAURUS_CODE_TABS-->
|
||||
|
||||
> Note: npm **set-script** command requires at least **npm v7.x**. See https://docs.npmjs.com/cli/v7/commands/npm-set-script.
|
||||
|
||||
2. Add the following to your `package.json`:
|
||||
|
||||
```json
|
||||
|
||||
@@ -30,7 +30,7 @@ Options that are easier to motivate include:
|
||||
- `--end-of-line` makes it easier for teams to keep CRLFs out of their git repositories.
|
||||
- `--quote-props` is important for advanced usage of the Google Closure Compiler.
|
||||
|
||||
But other options are harder to motivate in hindsight: `--arrow-parens`, `--jsx-single-quote`, `--jsx-bracket-same-line` and `--no-bracket-spacing` are not the type of options we’re happy to have. They cause a lot of [bike-shedding](https://en.wikipedia.org/wiki/Law_of_triviality) in teams, and we’re sorry for that. Difficult to remove now, these options exist as a historical artifact and should not motivate adding more options (“If _those_ options exist, why can’t this one?”).
|
||||
But other options are harder to motivate in hindsight: `--arrow-parens`, `--jsx-single-quote`, `--bracket-same-line` and `--no-bracket-spacing` are not the type of options we’re happy to have. They cause a lot of [bike-shedding](https://en.wikipedia.org/wiki/Law_of_triviality) in teams, and we’re sorry for that. Difficult to remove now, these options exist as a historical artifact and should not motivate adding more options (“If _those_ options exist, why can’t this one?”).
|
||||
|
||||
For a long time, we left option requests open in order to let discussions play out and collect feedback. What we’ve learned during those years is that it’s really hard to measure demand. Prettier has grown a lot in usage. What was “great demand” back in the day is not as much today. GitHub reactions and Twitter polls became unrepresentative. What about all silent users? It looked easy to add “just one more” option. But where should we have stopped? When is one too many? Even after adding “that one final option”, there would always be a “top issue” in the issue tracker.
|
||||
|
||||
|
||||
@@ -136,7 +136,44 @@ Valid options:
|
||||
| ------- | ---------------------- | ------------------------ |
|
||||
| `true` | `--no-bracket-spacing` | `bracketSpacing: <bool>` |
|
||||
|
||||
## JSX Brackets
|
||||
## Bracket Line
|
||||
|
||||
Put the `>` of a multi-line HTML (HTML, JSX, Vue, Angular) element at the end of the last line instead of being alone on the next line (does not apply to self closing elements).
|
||||
|
||||
Valid options:
|
||||
|
||||
- `true` - Example:
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```html
|
||||
<button
|
||||
className="prettier-class"
|
||||
id="prettier-id"
|
||||
onClick={this.handleClick}>
|
||||
Click Here
|
||||
</button>
|
||||
```
|
||||
|
||||
- `false` - Example:
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```html
|
||||
<button
|
||||
className="prettier-class"
|
||||
id="prettier-id"
|
||||
onClick={this.handleClick}
|
||||
>
|
||||
Click Here
|
||||
</button>
|
||||
```
|
||||
|
||||
| Default | CLI Override | API Override |
|
||||
| ------- | --------------------- | ------------------------- |
|
||||
| `false` | `--bracket-same-line` | `bracketSameLine: <bool>` |
|
||||
|
||||
## [Deprecated] JSX Brackets
|
||||
|
||||
_This option has been deprecated in v2.4.0, use --bracket-same-line instead_
|
||||
|
||||
Put the `>` of a multi-line JSX element at the end of the last line instead of being alone on the next line (does not apply to self closing elements).
|
||||
|
||||
|
||||
Reference in new issue
Block a user