Skip to content

Commit 6bbdcc1

Browse files
committed
docs: improve docs
1 parent 26b5ffd commit 6bbdcc1

File tree

4 files changed

+106
-75
lines changed

4 files changed

+106
-75
lines changed

.markdownlint.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@
1919
"html",
2020
"javascript",
2121
"json",
22+
"jsonc",
2223
"markdown",
2324
"powershell",
2425
"text",
File renamed without changes.

README.md

Lines changed: 87 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
[![ci](https://github.com/jonlabelle/SublimeJsPrettier/actions/workflows/ci.yml/badge.svg?branch=master)](https://github.com/jonlabelle/SublimeJsPrettier/actions/workflows/ci.yml)
44
[![Package Control Installs](https://img.shields.io/packagecontrol/dt/JsPrettier.svg?label=installs)](https://packagecontrol.io/packages/JsPrettier)
55
[![Latest Release](https://img.shields.io/github/v/tag/jonlabelle/SublimeJsPrettier.svg?label=version&sort=semver)](https://github.com/jonlabelle/SublimeJsPrettier/tags)
6-
[![MIT License](https://img.shields.io/badge/License-MIT-blue.svg)](https://github.com/jonlabelle/SublimeJsPrettier/blob/master/LICENSE.txt)
6+
[![MIT License](https://img.shields.io/badge/License-MIT-blue.svg)](https://github.com/jonlabelle/SublimeJsPrettier/blob/master/LICENSE)
77

88
> [JsPrettier] is a Sublime Text Plug-in for [Prettier], the opinionated code
99
> formatter.
@@ -25,18 +25,18 @@
2525
- [Install JsPrettier Using Git](#install-jsprettier-using-git)
2626
- [Usage](#usage)
2727
- [Command Scope](#command-scope)
28-
- [Custom Key Binding](#custom-key-binding)
29-
- [Settings](#settings)
30-
- [Sublime Text Settings](#sublime-text-settings)
28+
- [Plug-in Settings and Prettier Options](#plug-in-settings-and-prettier-options)
29+
- [Plug-in Settings](#plug-in-settings)
3130
- [Prettier Options](#prettier-options)
3231
- [Project-level Settings](#project-level-settings)
3332
- [Prettier Configuration Files](#prettier-configuration-files)
3433
- [Prettier Plug-in Support](#prettier-plugin-support)
3534
- [Prettier PHP](#prettier-php)
35+
- [Prettier Community Plugins](#prettier-community-plugins)
3636
- [Issues](#issues)
3737
- [Changes](#changes)
38-
- [Author](#author)
3938
- [License](#license)
39+
- [Author](#author)
4040

4141
</details>
4242

@@ -47,52 +47,66 @@ Operating Systems.
4747

4848
### Requirements
4949

50-
- [Sublime Text] – Text editor for code
51-
- [Node.js] – JavaScript runtime
52-
- [yarn] or [npm] – Package manager for JavaScript
53-
- [Prettier] – Opinionated code formatter (v3 or above)
50+
- [Sublime Text]
51+
- [Node.js]
52+
- [npm], [pnpm], or [yarn]
53+
- [Prettier]
5454

5555
### Install Prettier
5656

57-
If you've already installed [Prettier] \(using one of the [yarn] or [npm]
58-
commands below\), you're all set... otherwise:
57+
If you've already installed [Prettier], you're all set... otherwise:
5958

6059
```bash
61-
# yarn (local):
62-
yarn add prettier --dev
63-
64-
# yarn (global):
65-
yarn global add prettier
66-
67-
# npm (local):
60+
# npm (local)
6861
npm install --save-dev prettier
6962

70-
# npm (global):
63+
# npm (globally)
7164
npm install --global prettier
65+
66+
# or
67+
68+
# pnpm (local)
69+
pnpm add -D prettier
70+
71+
# pnpm (globally)
72+
pnpm add -g prettier
73+
74+
# or
75+
76+
# yarn (local)
77+
yarn add prettier --dev
78+
79+
# yarn (globally)
80+
yarn global add prettier
7281
```
7382

7483
### Install JsPrettier via Package Control
7584

76-
The easiest and recommended way to install JsPrettier is using [Package Control].
85+
The recommended way to install JsPrettier is via [Package Control].
7786

78-
From the **application menu**, navigate to:
87+
From the main application menu:
7988

80-
- `Tools` -> `Command Palette...` -> `Package Control: Install Package`, type
81-
the word **JsPrettier**, then select it to complete the installation.
89+
1. Open the **Tools** Menu
90+
2. Select **Command Palette...**
91+
3. Choose **Package Control: Install Package**
92+
4. Type **JsPrettier** and select it to complete the installation
8293

8394
### Install JsPrettier Manually
8495

85-
1. Download and extract JsPrettier [zip file] to your [Sublime Text Packages directory].
86-
2. Rename the extracted directory from `SublimeJsPrettier-master` to `JsPrettier`.
96+
1. Download the JsPrettier [zip file] from the GitHub repository.
97+
2. Extract the downloaded zip file.
98+
3. Move the extracted directory to your [Sublime Text Packages directory].
99+
4. Rename the extracted directory from `SublimeJsPrettier-master` to `JsPrettier`.
87100

88101
**Default Sublime Text Packages Paths:** <a name="default-st-paths"></a>
89102

90103
- **OS X:** `~/Library/Application Support/Sublime Text [2|3]/Packages`
91104
- **Linux:** `~/.Sublime Text [2|3]/Packages`
92105
- **Windows:** `%APPDATA%/Sublime Text [2|3]/Packages`
93106

94-
> **NOTE** Replace the `[2|3]` part with the appropriate Sublime Text
95-
> version for your installation.
107+
> [!NOTE]
108+
> Replace the `[2|3]` part with the appropriate Sublime Text version for your
109+
> installation.
96110
97111
### Install JsPrettier Using Git
98112

@@ -108,38 +122,38 @@ git clone https://github.com/jonlabelle/SublimeJsPrettier.git "JsPrettier"
108122

109123
## Usage
110124

125+
JsPrettier allows you to format your code using Prettier directly within Sublime Text.
126+
111127
There are three available options to format code:
112128

113129
1. **Command Palette:** From the command palette (<kbd>ctrl/cmd + shift + p</kbd>), type **JsPrettier Format Code**.
114130
2. **Context Menu:** Right-click anywhere in the file to bring up the context menu and select **JsPrettier Format Code**.
115131
3. **Key Binding:** There is no default key binding to run Prettier, but here's how to [add your own].
116132

117-
### Command Scope
133+
## Command Scope
118134

119-
`JsPrettier` will attempt to format selections of code first, then the entire
120-
file. When `auto_format_on_save` is `true`, the **entire file** will be formatted.
135+
JsPrettier formats selected code first; if no selection is made, it formats the
136+
entire file. When `auto_format_on_save` is enabled, the entire file will be
137+
formatted on save.
121138

122-
### Custom Key Binding
123-
124-
To add a [custom key binding], please reference the following example which
125-
binds the `js_prettier` command to <kbd>ctrl + alt + f</kbd>:
139+
To add a [custom key binding], open the Sublime Text key bindings file by
140+
navigating to `Preferences -> Key Bindings` and add the following configuration:
126141

127142
```json
128143
{ "keys": ["ctrl+alt+f"], "command": "js_prettier" }
129144
```
130145

131-
## Settings
146+
## Plug-in Settings and Prettier Options
132147

133-
Plug-in settings and Prettier options can be configured by navigating the
134-
application menu to:
148+
Configure plug-in settings and Prettier options via the application menu:
135149

136150
- **Preferences**
137151
- **Package Settings**
138152
- **JsPrettier**
139153
- **Settings - Default** (to view the defaults)
140154
- **Settings - User** (to override the defaults)
141155

142-
### Sublime Text Settings
156+
### Plug-in Settings
143157

144158
- **debug** (default: ***false***)
145159
When enabled (*true*), debug info will print to the console - useful for
@@ -161,7 +175,7 @@ application menu to:
161175

162176
**Examples:**
163177

164-
```json
178+
```jsonc
165179
{
166180
// macOS and Linux examples:
167181
"prettier_cli_path": "/usr/local/bin/prettier",
@@ -185,7 +199,7 @@ application menu to:
185199

186200
**Examples:**
187201

188-
```json
202+
```jsonc
189203
{
190204
// macOS/Linux:
191205
"node_path": "/usr/local/bin/node",
@@ -253,12 +267,12 @@ application menu to:
253267
254268
- **disable_tab_width_auto_detection** (default: ***false***)
255269
Whether or not to disable the plug-in from automatically setting Prettier's
256-
"[tabWidth / \--tab-width](https://prettier.io/docs/en/options.html#tab-width)"
270+
[--tab-width](https://prettier.io/docs/en/options.html#tab-width)
257271
option, and adhere to the Prettier configured setting.
258272

259273
- **disable_prettier_cursor_offset** (default: ***false***)
260274
There's an apparent (and nasty) defect in Prettier that seems to occur
261-
during Prettier's [cursor offset](https://prettier.io/docs/en/api.html#prettierformatwithcursorsource-options)
275+
during Prettier's [cursor offset](https://prettier.io/docs/en/api.html#prettierformatwithcursorsource--options)
262276
calculation, and when attempting to format large or minimized files (but not limited to just these cases).
263277
The issue effectively results in the CPU spiking to a constant 100%...
264278
indefinitely, or until the node executable/process running Prettier is
@@ -270,19 +284,22 @@ application menu to:
270284
to `true`.
271285

272286
- See related issues: [#147](https://github.com/jonlabelle/SublimeJsPrettier/issues/147), [#168](https://github.com/jonlabelle/SublimeJsPrettier/issues/168)
273-
- [Prettier Cursor Offset Documentation](https://prettier.io/docs/en/api.html#prettierformatwithcursorsource-options)
287+
- [Prettier Cursor Offset Documentation](https://prettier.io/docs/en/api.html#prettierformatwithcursorsource--options)
274288

275289
- **additional_cli_args** (default: {})
276290
A key-value pair of arguments to append to the prettier command.
277291

278292
**Examples:**
279293

280-
```json
294+
```jsonc
281295
{
282296
"additional_cli_args": {
283297
"--config": "~/.prettierrc",
298+
// or
284299
"--config": "$HOME/.prettierrc",
300+
// or
285301
"--config": "${project_path}/.prettierrc",
302+
// or
286303
"--config": "/some/absolute/path/to/.prettierrc",
287304
288305
"--config-precedence": "file-override",
@@ -458,8 +475,8 @@ See the Prettier Options [doc page] for more details and examples.
458475

459476
JsPrettier supports [project-level settings], specified in `<project_name>.sublime-project` files.
460477

461-
In order for your project-level settings to override [previous configurations](#settings),
462-
you'll need to add a new `js_prettier` key and section under `settings`, as [seen below].
478+
To override [previous configurations](#plug-in-settings-and-prettier-options) with your project-level settings,
479+
add a new `js_prettier` key and section under `settings` as shown in the [example below](#example-sublime-text-project-file).
463480

464481
#### Example Sublime Text Project File
465482

@@ -523,8 +540,7 @@ key-value item to `additional_cli_args`. Here's an example:
523540
524541
```json
525542
{
526-
"additional_cli_args":
527-
{
543+
"additional_cli_args": {
528544
"--config": "~/some/path/from/my/home/.prettierrc",
529545
"--config-precedence": "prefer-file",
530546
"--ignore-path": "${project_path}/.prettierignore"
@@ -557,12 +573,12 @@ in the user's home directory.
557573
558574
### Prettier PHP
559575
560-
In most cases, [Prettier PHP] works as drop-in replacement for Prettier.
576+
In most cases, [Prettier PHP] works as a drop-in replacement for Prettier.
561577
However, JsPrettier only detects if you're formatting a PHP file (or PHP selection),
562-
and sets the `--parser` to `php` accordingly. Aside from that, it's up to you ensure your
578+
and sets the `--parser` option to `php` accordingly. Aside from that, it's up to you ensure your
563579
config(s) conform to Prettier PHP [options](https://github.com/prettier/plugin-php#configuration).
564580
565-
To **install Prettier PHP** in your project root, and use it as a drop-in
581+
To **install Prettier PHP** in your project root and use it as a drop-in
566582
replacement for Prettier:
567583
568584
```bash
@@ -573,32 +589,34 @@ npm install @prettier/plugin-php
573589
### Prettier Community Plugins
574590
575591
Here's an [example SublimeText project](https://github.com/jonlabelle/SublimeJsPrettier/files/6498394/jsprettier-and-prettier-community-plugin-example.zip)
576-
\(posted in [Issue #239](https://github.com/jonlabelle/SublimeJsPrettier/issues/239)\)
577-
that uses the Prettier Community Plugin [NiklasPor/prettier-plugin-go-template](https://github.com/NiklasPor/prettier-plugin-go-template)
592+
from [#239](https://github.com/jonlabelle/SublimeJsPrettier/issues/239)
593+
that uses the Prettier Community Plugin [prettier-plugin-go-template](https://github.com/NiklasPor/prettier-plugin-go-template)
578594
to format `*.gohtml` files.
579595
580596
And another [example project](https://github.com/jonlabelle/SublimeJsPrettier/files/6527323/jsprettier-and-prettier-plugin-sort-imports.zip)
581-
that uses [@trivago/prettier-plugin-sort-imports](https://github.com/trivago/prettier-plugin-sort-imports)
582-
to sort imports (posted in [Issue #240](https://github.com/jonlabelle/SublimeJsPrettier/issues/240)\).
597+
from [#240](https://github.com/jonlabelle/SublimeJsPrettier/issues/240) that
598+
uses [prettier-plugin-sort-imports](https://github.com/trivago/prettier-plugin-sort-imports)
599+
to sort imports.
583600
584601
## Issues
585602
586-
To report a bug or a make suggestion, please [open a new issue] selecting the
587-
appropriate Issue Template (**Bug report** or **Feature request**). Be sure to
588-
follow the guidelines outlined in each template... otherwise your submission
589-
will be subject to immediate closure.
603+
To report a bug or make a suggestion, please [open a new issue] selecting the
604+
appropriate issue template: [Bug], [Feature], or [Question].
605+
606+
Be sure to follow the guidelines outlined in each template; otherwise, your
607+
submission may be closed.
590608
591609
## Changes
592610
593611
Please visit the [Changelog] page for a complete list of changes.
594612
595-
## Author
613+
## License
596614
597-
Jon LaBelle
615+
[MIT]
598616
599-
## License
617+
## Author
600618
601-
[MIT License]
619+
[Jon LaBelle](https://github.com/jonlabelle)
602620
603621
[Watch a Quick Demo]: https://github.com/jonlabelle/SublimeJsPrettier/blob/master/screenshots/demo.gif
604622
[Prettier]: https://prettier.io
@@ -611,20 +629,22 @@ Jon LaBelle
611629
[***translate_tabs_to_spaces***]: https://sublime-text-unofficial-documentation.readthedocs.io/en/latest/reference/settings.html#whitespace-and-indentation
612630
[yarn]: https://yarnpkg.com
613631
[npm]: https://www.npmjs.com
632+
[pnpm]: https://pnpm.io
614633
[zip file]: https://github.com/jonlabelle/SublimeJsPrettier/archive/master.zip
615634
[Sublime Text Packages directory]: #default-st-paths
616635
[custom key binding]: https://sublime-text-unofficial-documentation.readthedocs.io/en/latest/customization/key_bindings.html
617636
[Prettier Configuration files]: https://prettier.io/docs/en/configuration.html
618637
[Changelog]: https://github.com/jonlabelle/SublimeJsPrettier/blob/master/CHANGELOG.md
619-
[MIT License]: https://github.com/jonlabelle/SublimeJsPrettier/blob/master/LICENSE.txt
638+
[MIT]: https://github.com/jonlabelle/SublimeJsPrettier/blob/master/LICENSE
620639
[doc page]: https://prettier.io/docs/en/options.html
621-
[`--ignore-path`]: https://prettier.io/docs/en/cli.html#ignore-path
640+
[`--ignore-path`]: https://prettier.io/docs/en/cli.html#--ignore-path
622641
[whitespace-sensitive formatting]: https://prettier.io/blog/2018/11/07/1.15.0.html#whitespace-sensitive-formatting
623642
[`parser`]: https://prettier.io/docs/en/options.html#parser
624643
[`--log-level`]: https://prettier.io/docs/en/cli.html#--log-level
625644
[Prettier PHP]: https://github.com/prettier/plugin-php
626645
[open a new issue]: https://github.com/jonlabelle/SublimeJsPrettier/issues/
627646
[Prettier v1.17+]: https://prettier.io/blog/2019/04/12/1.17.0.html
628-
[seen below]: #example-sublime-text-project-file "See the Sublime Text project file example"
629-
[add your own]: #custom-key-binding "See how to add a custom key binding to run Prettier"
630647
[\.editorconfig]: https://editorconfig.org/
648+
[Bug]: https://github.com/jonlabelle/SublimeJsPrettier/issues/new?assignees=jonlabelle&labels=investigating&projects=&template=bug.yml&title=%5BBug%5D+
649+
[Feature]: https://github.com/jonlabelle/SublimeJsPrettier/issues/new?assignees=jonlabelle&labels=enhancement&projects=&template=feature.yml&title=%5BEnhancement%5D+
650+
[Question]: https://github.com/jonlabelle/SublimeJsPrettier/issues/new?assignees=&labels=question&projects=&template=question.yml&title=%5BQuestion%5D+

messages/install.txt

Lines changed: 18 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -14,18 +14,28 @@
1414

1515
If you've already installed Prettier, you're all set... otherwise:
1616

17-
# yarn (local):
18-
yarn add prettier --dev
19-
20-
# yarn (global):
21-
yarn global add prettier
22-
23-
# npm (local):
17+
# npm (local)
2418
npm install --save-dev prettier
2519

26-
# npm (global):
20+
# npm (globally)
2721
npm install --global prettier
2822

23+
# or
24+
25+
# pnpm (local)
26+
pnpm add -D prettier
27+
28+
# pnpm (globally)
29+
pnpm add -g prettier
30+
31+
# or
32+
33+
# yarn (local)
34+
yarn add prettier --dev
35+
36+
# yarn (globally)
37+
yarn global add prettier
38+
2939
### Usage
3040

3141
There are three ways to format code...

0 commit comments

Comments
 (0)