UNPKG

4.55 kBMarkdownView Raw
1# declaration-empty-line-before
2
3Require or disallow an empty line before declarations.
4
5<!-- prettier-ignore -->
6```css
7a {
8 --foo: pink;
9 /* ← */
10 top: 15px; /* ↑ */
11} /* ↑ */
12/** ↑
13 * This line */
14```
15
16This rule only applies to standard property declarations. Use the [`custom-property-empty-line-before`](../custom-property-empty-line-before/README.md) rule for custom property declarations.
17
18The [`fix` option](../../../docs/user-guide/usage/options.md#fix) can automatically fix all of the problems reported by this rule. We recommend to enable [`indentation`](../indentation/README.md) rule for better autofixing results with this rule.
19
20## Options
21
22`string`: `"always"|"never"`
23
24### `"always"`
25
26The following patterns are considered violations:
27
28<!-- prettier-ignore -->
29```css
30a {
31 --foo: pink;
32 top: 5px;
33}
34```
35
36<!-- prettier-ignore -->
37```css
38a {
39 bottom: 15px;
40 top: 5px;
41}
42```
43
44The following patterns are _not_ considered violations:
45
46<!-- prettier-ignore -->
47```css
48a {
49 --foo: pink;
50
51 top: 5px;
52}
53```
54
55<!-- prettier-ignore -->
56```css
57a {
58
59 bottom: 15px;
60
61 top: 5px;
62}
63```
64
65### `"never"`
66
67The following patterns are considered violations:
68
69<!-- prettier-ignore -->
70```css
71a {
72 --foo: pink;
73
74 bottom: 15px;
75}
76```
77
78<!-- prettier-ignore -->
79```css
80a {
81
82 bottom: 15px;
83
84 top: 5px;
85}
86```
87
88The following patterns are _not_ considered violations:
89
90<!-- prettier-ignore -->
91```css
92a {
93 --foo: pink;
94 bottom: 15px;
95}
96```
97
98<!-- prettier-ignore -->
99```css
100a {
101 bottom: 15px;
102 top: 5px;
103}
104```
105
106## Optional secondary options
107
108### `except: ["after-comment", "after-declaration", "first-nested"]`
109
110#### `"after-comment"`
111
112Reverse the primary option for declarations that follow a comment.
113
114Shared-line comments do not trigger this option.
115
116For example, with `"always"`:
117
118The following patterns are considered violations:
119
120<!-- prettier-ignore -->
121```css
122a {
123 /* comment */
124
125 top: 5px;
126}
127```
128
129<!-- prettier-ignore -->
130```css
131a {
132 bottom: 5px; /* comment */
133 top: 5px;
134}
135```
136
137The following patterns are _not_ considered violations:
138
139<!-- prettier-ignore -->
140```css
141a {
142 /* comment */
143 top: 5px;
144}
145
146```
147
148<!-- prettier-ignore -->
149```css
150a {
151 bottom: 5px; /* comment */
152
153 top: 5px;
154}
155
156```
157
158#### `"after-declaration"`
159
160Reverse the primary option for declarations that follow another declaration.
161
162Shared-line comments do not affect this option.
163
164For example, with `"always"`:
165
166The following patterns are considered violations:
167
168<!-- prettier-ignore -->
169```css
170a {
171
172 bottom: 15px;
173
174 top: 5px;
175}
176```
177
178<!-- prettier-ignore -->
179```css
180a {
181
182 bottom: 15px; /* comment */
183
184 top: 5px;
185}
186```
187
188The following patterns are _not_ considered violations:
189
190<!-- prettier-ignore -->
191```css
192a {
193
194 bottom: 15px;
195 top: 5px;
196}
197```
198
199<!-- prettier-ignore -->
200```css
201a {
202
203 bottom: 15px; /* comment */
204 top: 5px;
205}
206```
207
208#### `"first-nested"`
209
210Reverse the primary option for declarations that are nested and the first child of their parent node.
211
212For example, with `"always"`:
213
214The following patterns are considered violations:
215
216<!-- prettier-ignore -->
217```css
218a {
219
220 bottom: 15px;
221
222 top: 5px;
223}
224```
225
226The following patterns are _not_ considered violations:
227
228<!-- prettier-ignore -->
229```css
230a {
231 bottom: 15px;
232
233 top: 5px;
234}
235```
236
237### `ignore: ["after-comment", "after-declaration", "first-nested", "inside-single-line-block"]`
238
239#### `"after-comment"`
240
241Ignore declarations that follow a comment.
242
243For example, with `"always"`:
244
245The following patterns are _not_ considered violations:
246
247<!-- prettier-ignore -->
248```css
249a {
250 /* comment */
251 bottom: 15px;
252}
253```
254
255#### `"after-declaration"`
256
257Ignore declarations that follow another declaration.
258
259For example, with `"always"`:
260
261The following patterns are _not_ considered violations:
262
263<!-- prettier-ignore -->
264```css
265a {
266
267 bottom: 15px;
268 top: 15px;
269}
270```
271
272<!-- prettier-ignore -->
273```css
274a {
275
276 bottom: 15px;
277
278 top: 15px;
279}
280```
281
282<!-- prettier-ignore -->
283```css
284a {
285
286 color: orange;
287 text-decoration: none;
288
289 bottom: 15px;
290 top: 15px;
291}
292```
293
294#### `"first-nested"`
295
296Ignore declarations that are nested and the first child of their parent node.
297
298For example, with `"always"`:
299
300The following patterns are _not_ considered violations:
301
302<!-- prettier-ignore -->
303```css
304a {
305 bottom: 15px;
306
307 top: 5px;
308}
309```
310
311#### `"inside-single-line-block"`
312
313Ignore declarations that are inside single-line blocks.
314
315For example, with `"always"`:
316
317The following patterns are _not_ considered violations:
318
319<!-- prettier-ignore -->
320```css
321a { bottom: 15px; top: 5px; }
322```