Help with glob syntax (Next.js special routes related)
milos-sikic-nimbus-tech opened this issue · comments
Hi there!
I've been trying to make a glob pattern that would match what this regex matches for a while:
^(?:\[[a-z]+(?:-[a-z]+)*]|(?:[a-z]+(?:-[a-z]+)*))$
But unfortunately, I can't figure it out.
I have seen #20 and I agree with you that it should not be part of the library, but I would like to ask for your help for a glob that would match what's needed, if it's possible. If not, would you consider supporting regexes?
Test data
Should pass
some
some-string
[some-string]
[some]
Should not pass
[some-string
some-string]
[some]-string
Thank you for the tool. I would happily submit a PR that documents these custom globs for Next.js if we can make some.
Hi @milos-sikic-nimbus-tech, I have created a glob for your case @(+([a-z])*(-+([a-z]))|\[+([a-z])*(-+([a-z]))\])
, it looks a bit complex. You can test it to see if it fits your needs.
This glob combines different patterns to match either a word without brackets or a word enclosed in square brackets, allowing hyphens within the words:
+([a-z])*(-+([a-z]))
is used to match a word\[+([a-z])*(-+([a-z]))\]
is used to match a word enclosed in square brackets
Hello, @dukeluo, thank you very much for the prompt response!
Unfortunately, the pattern seems to not match anything when I use it like this.
...
'check-file/folder-naming-convention': [
'error',
{
'src/**/': '@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])',
'app/**/': '@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])',
'pages/**/': '@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])',
},
],
...
Output:
$ ESLINT_USE_FLAT_CONFIG=true eslint -c eslint.config.mjs .
/projects/nextjs-template/src/app/[locale]/error.tsx
1:1 error The folder "app" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/app/[locale]/example-route/page.tsx
1:1 error The folder "app" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/app/[locale]/example-route/styles.module.scss.d.ts
1:1 error The folder "app" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/app/[locale]/layout.tsx
1:1 error The folder "app" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/app/[locale]/loader.tsx
1:1 error The folder "app" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/app/[locale]/loading.module.scss.d.ts
1:1 error The folder "app" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/app/[locale]/loading.tsx
1:1 error The folder "app" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/app/[locale]/locale.props.ts
13:1 error The folder "app" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/app/[locale]/page.module.scss.d.ts
1:1 error The folder "app" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/app/[locale]/page.tsx
1:1 error The folder "app" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/app/[locale]/providers.tsx
1:1 error The folder "app" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/app/[locale]/routes.ts
1:1 error The folder "app" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/assets/icons/index.ts
1:1 error The folder "assets" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/components/component-example/component-example.module.scss.d.ts
1:1 error The folder "components" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/components/component-example/component-example.tsx
1:1 error The folder "components" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/translations/client-translations.ts
1:1 error The folder "translations" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/translations/server-translations.ts
1:1 error The folder "translations" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
/projects/nextjs-template/src/translations/settings.ts
1:1 error The folder "translations" does not match the "@(+([a-z])*(-+([a-z]))|[+([a-z])*(-+([a-z]))])" pattern check-file/folder-naming-convention
✖ 18 problems (18 errors, 0 warnings)
I also tried with using just the app
matcher inside of eslint.config.mjs
, but it just failed to match the [locale]
folder then.
Let me know if I can help out somehow, and again, thank you for your time!
@milos-sikic-nimbus-tech The point is that you need escape first. The following is my .eslintrc
file, and it works well on my side with your case.
{
"plugins": [
"check-file"
],
"rules": {
"check-file/folder-naming-convention": [
"error",
{
"src/**/": "@(+([a-z])*(-+([a-z]))|\\[+([a-z])*(-+([a-z]))\\])"
}
]
}
}
Thank you very much, @dukeluo, that works for me, too. I was sure that I tried with only the first rule, but it seems I didn't.
Would https://github.com/DukeLuo/eslint-plugin-check-file/blob/main/docs/rules/folder-naming-convention.md be a good page to add a Next.js example? Or maybe a new page with various examples?
Thank you very much, @dukeluo, that works for me, too. I was sure that I tried with only the first rule, but it seems I didn't.
Would https://github.com/DukeLuo/eslint-plugin-check-file/blob/main/docs/rules/folder-naming-convention.md be a good page to add a Next.js example? Or maybe a new page with various examples?
That's cool, glad to hear it. I think it's a good idea to include a Next.js example on the original page. If someone needs this glob, it's easier to find.
Sorry @dukeluo, but I'm not sure what page you're referring to when you say original. Just send me a link to the page where you'd like me to add the example and I'll send a PR!
Sorry @dukeluo, but I'm not sure what page you're referring to when you say original. Just send me a link to the page where you'd like me to add the example and I'll send a PR!
Yes, I mean https://github.com/DukeLuo/eslint-plugin-check-file/blob/main/docs/rules/folder-naming-convention.md. Thanks for your PR!
NEXT_JS_APP_ROUTER_CASE
was released in v2.5.0.