Add support for double brackets in path and lint-staged

[olivervorasai]

What minimal example or steps are needed to reproduce the bug?

When using lint-staged + husky + stylelint, files that have double brackets in their path throw the following error:

✖ stylelint:
Error: No files matching the pattern "C:/Users/OliverVorasai/Desktop/random/stylelint-bug/test-files/some/long/path/[[id]]/test.css" were found.
    at standalone (C:\Users\OliverVorasai\Desktop\random\stylelint-bug\node_modules\stylelint\lib\standalone.js:261:43)

What minimal configuration is needed to reproduce the bug?

https://github.com/olivervorasai/stylelint-bug

Steps:

1. npm i
2. Modify the test.css file
3. Try to commit the changes

How did you run Stylelint?

pre-commit via husky and lint-staged

Which Stylelint-related dependencies are you using?

{
    "husky": "^8.0.3",
    "lint-staged": "^13.2.3",
    "stylelint": "^15.10.1",
    "stylelint-config-standard": "^34.0.0"
}

What did you expect to happen?

Stylelint to run without problems.

What actually happened?

Stylelint (or lint-staged) was unable to parse the file path.

Notes

Everything works fine for file paths that have single brackets.

For example: some/long/path/[id]/test.css

According this comment https://github.com/stylelint/stylelint/issues/4855#issuecomment-659424327 there are several workarounds relating to globs. However, I may be misunderstanding the comment but I am not using a glob in my example.

Context

I use single and double brackets for automatic page routing in web frameworks like Nuxt.

[shrey714]

The issue you're facing is related to the use of double brackets in file paths when using lint-staged, husky, and stylelint. This error occurs because the file path with double brackets is not being recognized by the underlying file system.

To resolve this issue, you can modify your configuration to escape the double brackets in the file path. Here's the modified configuration for lint-staged in your package.json file:

"lint-staged": { "src/**/*.{js,jsx,ts,tsx,json,css,scss,md}": [ "stylelint --config .stylelintrc.json" ] }

By escaping the double brackets with backslashes (\\), you can ensure that the file path is properly recognized. Here's an example of the modified configuration for your specific file path:

"lint-staged": { "test-files/some/long/path/\\[\\[id\\]\\]/test.css": [ "stylelint --config .stylelintrc.json" ] }

With this modification, lint-staged should be able to find and process files with double brackets in their paths without throwing the "No files matching the pattern" error.

[jeddy3]

@olivervorasai Thanks for the report, for using the template and for the minimal reproducible repo. @shrey714 Thanks for chiming in with your solution.

It sounds like this is an issue with lint-staged rather than Stylelint.

Stylelint can lint the file from the CLI:

jeddy3@mac stylelint-bug-main % npx stylelint "**/*.css"

test-files/some/long/path/[[id]]/test.css
 2:10  ✖  Unexpected invalid hex color "#ff"  color-no-invalid-hex

1 problem (1 error, 0 warnings)

[Mouvedia]

It sounds like this is an issue with lint-staged rather than Stylelint.

okonet/lint-staged#676 is maybe related.

[jeddy3]

And here's the pull request for how Prettier resolved the issue at their end. Shall we do the same?

[olivervorasai]

This is no longer an issue with these updated dependencies:

{
    "husky": "^8.0.3",
    "lint-staged": "^15.2.2",
    "stylelint": "^16.3.0",
    "stylelint-config-standard": "^36.0.0"
}