Skip to content

Commit 8cd9c43

Browse files
committed
readme: enhancements and adjustments
1 parent a7a2d92 commit 8cd9c43

File tree

1 file changed

+35
-25
lines changed

1 file changed

+35
-25
lines changed

README.md

Lines changed: 35 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -4,15 +4,15 @@ An ESLint plugin for Svelte v3 components.
44

55
## Features
66

7-
- Svelte compiler errors and warnings are exposed as ESLint messages
7+
- Svelte compiler errors and warnings are exposed as ESLint errors and warnings
88
- Variables referred to in your template won't be marked as unused in your scripts
99
- References to store auto-subscriptions are considered references to the underlying variables
1010
- Messages about self-assignments are suppressed, as this is an official pattern for manually triggering reactive updates
1111
- Messages about unused labels called `$` are suppressed, as this is the syntax for reactive assignments
1212

1313
## Installation
1414

15-
For now, this is not published to npm. Install from Git tags. See [the documentation on `npm install`](https://docs.npmjs.com/cli/install) for how to do this.
15+
For now, this is not published to npm. You can still install it from Git tags. See the [`npm install` documentation](https://docs.npmjs.com/cli/install) for how to do this.
1616

1717
Untagged releases may depend on unreleased Svelte 3 features. Tagged releases should always work with the specified Svelte version. The latest tagged version requires at least Svelte 3.0.0-alpha21.
1818

@@ -51,19 +51,29 @@ If you are linting a Sapper project, you'll need to change the `svelte3/extensio
5151

5252
You'll need the [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) extension installed.
5353

54-
If you're using a different extension than `.html` for your Svelte components, you'll need to configure `files.associations` to associate it with the `html` language.
55-
56-
Then, you'll need to tell the ESLint extension to also lint files with language `html` and to enable automatically fixable problems. The default languages it lints are `javascript` and `javascriptreact`, so put this in your `settings.json`:
54+
If you're using an extension other than `.html` for your Svelte components, you'll need to configure `files.associations` to associate it with the `html` language. In your `settings.json`:
5755

56+
```json
57+
{
58+
"files.associations": {
59+
"*.your-extension": "html"
60+
}
61+
}
5862
```
59-
"eslint.validate": [
60-
"javascript",
61-
"javascriptreact",
62-
{
63-
"language": "html",
64-
"autoFix": true,
65-
},
66-
],
63+
64+
Then, you'll need to tell the ESLint extension to also lint files with language `html` and to enable autofixing problems. If you haven't adjusted the `eslint.validate` setting, it defaults to `javascript` and `javascriptreact`, so put this in your `settings.json`:
65+
66+
```json
67+
{
68+
"eslint.validate": [
69+
"javascript",
70+
"javascriptreact",
71+
{
72+
"language": "html",
73+
"autoFix": true
74+
}
75+
]
76+
}
6777
```
6878

6979
Reload VS Code and give it a go!
@@ -72,14 +82,14 @@ Reload VS Code and give it a go!
7282

7383
You'll need the [linter](https://atom.io/packages/linter) and [linter-eslint](https://atom.io/packages/linter-eslint) packages installed.
7484

75-
If you're using a different extension than `.html` for your Svelte components, you'll need to configure `core.customFileTypes` to associate it with the `test.html.basic` language. In `config.cson`:
85+
If you're using an extension other than `.html` for your Svelte components, you'll need to configure `*.core.customFileTypes` to associate it with the `test.html.basic` language. In your `config.cson`:
7686

77-
```
87+
```cson
7888
"*":
7989
core:
8090
customFileTypes:
8191
"text.html.basic": [
82-
"svelte"
92+
"your-extension"
8393
]
8494
```
8595

@@ -89,19 +99,19 @@ Reload Atom and give it a go!
8999

90100
### Sublime Text
91101

92-
You'll need the [SublimeLinter](https://github.com/SublimeLinter/SublimeLinter) and [SublimeLinter-eslint](https://github.com/SublimeLinter/SublimeLinter-eslint) package installed.
102+
You'll need the [SublimeLinter](https://github.com/SublimeLinter/SublimeLinter) and [SublimeLinter-eslint](https://github.com/SublimeLinter/SublimeLinter-eslint) packages installed.
93103

94-
If you're using a different extension than `.html` for your Svelte components, you'll need to configure Sublime to associate it with the `text.html` syntax.
104+
If you're using an extension other than `.html` for your Svelte components, you'll need to configure Sublime to associate it with the `text.html` syntax. Go to `View > Syntax > Open all with current extension as... > HTML`.
95105

96-
Then, you'll need to tell SublimeLinter-eslint to lint entire files with the `text.html` syntax, and not just the contents of their `<script>` tags (which is the default). In your SublimeLinter configuration, you'll need to add `text.html` to `linters.eslint.selector`. Starting with the default values, this would mean:
106+
Then, you'll need to tell SublimeLinter-eslint to lint entire files with the `text.html` syntax, and not just the contents of their `<script>` tags (which is the default). In your SublimeLinter configuration, you'll need to add `text.html` to `linters.eslint.selector`. If you're starting with the default values, this would mean:
97107

98-
```
108+
```json
99109
{
100-
"linters": {
101-
"eslint": {
102-
"selector": "source.js - meta.attribute-with-value, text.html"
103-
}
104-
}
110+
"linters": {
111+
"eslint": {
112+
"selector": "source.js - meta.attribute-with-value, text.html"
113+
}
114+
}
105115
}
106116
```
107117

0 commit comments

Comments
 (0)