--autoprefixer.browsers 'last ... versions' breaks on windows
See original GitHub issueIt looks like autoprefixer relies on bash-specific syntax (or at least nx-specific syntax) for its autoprefix.browsers
flag that lets you specify how many versions to support. As this affects all devs that have to work on cross-platform codebases that rely on either autoprefixer
or even postcss
in general, this feels like something worth examining to see if the bash syntax can be turned into something node can execute instead (since node’s API is guaranteed cross-platform compatible)
Minimal broken example:
input.css
body {
margin: 0;
padding: 0;
}
package.json
{
"name": "test",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"with": "postcss --use autoprefixer --autoprefixer.browsers 'last 3 versions' -o result.css input.css",
"without": "postcss --use autoprefixer -o result.css input.css"
},
"author": "",
"license": "PD",
"dependencies": {
"autoprefixer": "^6.4.0",
"postcss-cli-simple": "^1.0.1"
}
}
Guaranteed broken on Windows 7, 8, 8.1 and 10 (not tested older versions, as only Vista SP2 is not EOL yet, but I will horribly generalize and say I don’t really expect anyone on Vista to be a node developer…):
$> npm run with
Not broken:
$> npm run without
Issue Analytics
- State:
- Created 7 years ago
- Comments:12 (2 by maintainers)
Top Results From Across the Web
last 2 versions autoprefixer browserslist - Stack Overflow
I am wondering can I easily see on caniuse.com what exact browser versions: last 2 versions , last 3 versions , last 4...
Read more >Is Vendor Prefixing Dead? - CSS-Tricks
The solution was to use box-decoration-break: clone . Most browsers require the -webkit prefixed version of this property, so you need to use ......
Read more >Vendor Prefix - MDN Web Docs Glossary
Browser vendors used to add prefixes to experimental or nonstandard CSS properties and JavaScript APIs, so developers could experiment with ...
Read more >Tweets with replies by Autoprefixer (@Autoprefixer ... - Twitter
The latest Can I Use update broke Autoprefixer. ... create PR with browsers DB update and your `last 2 version` or `>1%` queries...
Read more >Say Goodbye to Vendor Prefixes
There are no vendor prefixes or browser inconsistencies, ... Microsoft can add a new CSS property grid without breaking pages that depend on ......
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
windows needs backslashes! this script is tested and it works. “prefix:css”: “postcss --use autoprefixer -b "last 10 versions" -o css/style.prefix.css css/style.css”
Conclusion: windows only supports double quotes in the standard command interpreter for quoted arguments (singles quotes will not work), and because NPM scripts area already in double quotes, if you want quoted arguments in an NPM script, you need to escape your double quotes.
This is effectively a general cross-platform issue around NPM scripts that work in Windows as well as in linux/macos, rather than an autoprefixer or even postcss-cli issue.