Skip to content

Commit 589ebf6

Browse files
fiskerfisker
authored
Add pure css parser (prettier#7933)
1 parent c85ff01 commit 589ebf6

14 files changed

Lines changed: 92 additions & 22 deletions

File tree

‎changelog_unreleased/css/pr-7933.md‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
#### [BREAKING] Add pure css parser ([#7933](https://github.com/prettier/prettier/pull/7933) by [@fisker](https://github.com/fisker))
2+
3+
Previously when `--parser=css` passed, we try `postcss-scss`/`postcss-less` to parse content, this cause confusion, and hard to check syntax error. Now `--parser=css` only works on css syntax.
4+
5+
_If you're setting `parser="css"` for your `.less`/`.scss` file, you'll need update it to correct parser, or let prettier decide._
6+
7+
<!-- prettier-ignore -->
8+
```less
9+
/* Input */
10+
/* Less Syntax with `--parser=css` */
11+
a {.bordered();}
12+
13+
/* Prettier stable */
14+
/* Less Syntax with `--parser=css` */
15+
a {
16+
.bordered();
17+
}
18+
19+
/* Prettier master */
20+
SyntaxError: (postcss) CssSyntaxError Unknown word (2:4)
21+
1 | /* Less Syntax with `--parser=css` */
22+
> 2 | a {.bordered();}
23+
```
24+
25+
<!-- prettier-ignore -->
26+
```scss
27+
/* Input */
28+
/* Scss Syntax with `--parser=css` */
29+
::before {content: #{$foo}}
30+
31+
/* Prettier stable */
32+
/* Scss Syntax with `--parser=css` */
33+
::before {
34+
content: #{$foo};
35+
}
36+
37+
/* Prettier master */
38+
SyntaxError: (postcss) CssSyntaxError Unknown word (2:22)
39+
1 | /* Scss Syntax with `--parser=css` */
40+
> 2 | ::before {content: #{$foo}}
41+
```

‎docs/options.md‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -211,9 +211,9 @@ Valid options:
211211
- `"babel-ts"` (similar to `"typescript"` but uses Babel and its TypeScript plugin) _First available in v2.0.0_
212212
- `"flow"` (via [flow-parser](https://github.com/facebook/flow/tree/master/src/parser))
213213
- `"typescript"` (via [@typescript-eslint/typescript-estree](https://github.com/typescript-eslint/typescript-eslint)) _First available in v1.4.0_
214-
- `"css"` (via [postcss-scss](https://github.com/postcss/postcss-scss) and [postcss-less](https://github.com/shellscape/postcss-less), autodetects which to use) _First available in v1.7.1_
215-
- `"scss"` (same parsers as `"css"`, prefers postcss-scss) _First available in v1.7.1_
216-
- `"less"` (same parsers as `"css"`, prefers postcss-less) _First available in v1.7.1_
214+
- `"css"` (via [postcss](https://github.com/postcss/postcss)) _First available in v1.7.1_
215+
- `"scss"` (via [postcss-scss](https://github.com/postcss/postcss-scss)) _First available in v1.7.1_
216+
- `"less"` (via [postcss-less](https://github.com/shellscape/postcss-less) _First available in v1.7.1_
217217
- `"json"` (via [@babel/parser parseExpression](https://babeljs.io/docs/en/next/babel-parser.html#babelparserparseexpressioncode-options)) _First available in v1.5.0_
218218
- `"json5"` (same parser as `"json"`, but outputs as [json5](https://json5.org/)) _First available in v1.13.0_
219219
- `"json-stringify"` (same parser as `"json"`, but outputs like `JSON.stringify`) _First available in v1.13.0_

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,7 @@
6464
"outdent": "0.7.1",
6565
"parse-srcset": "ikatyang/parse-srcset#54eb9c1cb21db5c62b4d0e275d7249516df6f0ee",
6666
"please-upgrade-node": "3.2.0",
67+
"postcss": "7.0.30",
6768
"postcss-less": "3.1.4",
6869
"postcss-media-query-parser": "0.2.3",
6970
"postcss-scss": "2.1.1",

‎src/language-css/parser-postcss.js‎

Lines changed: 2 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -606,26 +606,9 @@ function parseWithParser(parse, text, options) {
606606
return result;
607607
}
608608

609-
// TODO: make this only work on css
610609
function parseCss(text, parsers, options) {
611-
const isSCSSParser = isSCSS(options.parser, text);
612-
const parseFunctions = isSCSSParser
613-
? [parseScss, parseLess]
614-
: [parseLess, parseScss];
615-
616-
let error;
617-
for (const parse of parseFunctions) {
618-
try {
619-
return parse(text, parsers, options);
620-
} catch (parseError) {
621-
error = error || parseError;
622-
}
623-
}
624-
625-
/* istanbul ignore next */
626-
if (error) {
627-
throw error;
628-
}
610+
const { parse } = require("postcss");
611+
return parseWithParser(parse, text, options);
629612
}
630613

631614
function parseLess(text, parsers, options) {

‎tests/misc/errors/css/__snapshots__/jsfmt.spec.js.snap‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`less-syntax.css error test 1`] = `
4+
"(postcss) CssSyntaxError Unknown word (1:4)
5+
> 1 | a {.bordered();}
6+
| ^
7+
2 | "
8+
`;
9+
10+
exports[`scss-syntax.css error test 1`] = `
11+
"(postcss) CssSyntaxError Unknown word (1:15)
12+
> 1 | a {content: #{$foo}}
13+
| ^
14+
2 | "
15+
`;

‎tests/misc/errors/css/jsfmt.spec.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
run_spec(__dirname, ["css"]);

‎tests/misc/errors/css/less-syntax.css‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
a {.bordered();}

‎tests/misc/errors/css/scss-syntax.css‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
a {content: #{$foo}}

‎tests/misc/errors/less/__snapshots__/jsfmt.spec.js.snap‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,3 +28,10 @@ exports[`open-sigle-quote.less error test 1`] = `
2828
3 | }
2929
4 | "
3030
`;
31+
32+
exports[`scss-syntax.css error test 1`] = `
33+
"(postcss) CssSyntaxError Unknown word (1:15)
34+
> 1 | a {content: #{$foo}}
35+
| ^
36+
2 | "
37+
`;

‎tests/misc/errors/less/scss-syntax.css‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
a {content: #{$foo}}

0 commit comments

Comments
 (0)