docs: add tabs to cli code blocks #18784
Conversation
|
Hi @Jay-Karia!, thanks for the Pull Request The pull request title isn't properly formatted. We ask that you update the pull request title to match this format, as we use it to generate changelogs and automate releases.
To Fix: You can fix this problem by clicking 'Edit' next to the pull request title at the top of this page. Read more about contributing to ESLint here |
✅ Deploy Preview for docs-eslint ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
|
While parsing the Tried using Characters like What should we do here. |
The pages are Tests, PRs, Custom Parsers, Integration Tutorials, flags, config files and debug.
|
You should mark the content as safe to disable encoding. |
|
The linting errors are due to the commands being wrapped within |
nzakas
left a comment
There was a problem hiding this comment.
Thanks for taking a look at this. This isn't quite what I had in mind. What I think we need is a separate component that deals with just commands. Something like this:
{{{ install_tabs({
global: true,
package: "eslint"
}) }}
{{{ npx_tabs({
package: "eslint",
args: ["--fix"]
}) }}
And then the tabs are automatically generated for npm, Yarn, pnpm, and Bun.
We should not be making any changes where we tell people to run npm test, because that's what we use in our repos. Other package managers might not work and there's no need to use them.
|
@nzakas |
|
There would be two types of tabs for code blocks one being installation and another being the runner. The installation one takes multiple params like if it needs to be global installation, what package to install, if it is a dev dep etc.. so basically this code: will be resolved to similarly for runners we will have the command that has to be run and the args that command takes. So we should auto generate it for all type of runners npx, bunx etc.. |
|
There's a library npm-to-yarn which can convert commands. Is there any other solutions you have thought about ? |
|
These are also very simple mappings from one package manager to another. We don't need any other packages to do the translation for us. |
|
Should we add |
Added two other macro components
|
@nzakas Added |
Prerequisites checklist
What is the purpose of this pull request? (put an "X" next to an item)
[x] Documentation update
[ ] Bug fix (template)
[ ] New rule (template)
[ ] Changes an existing rule (template)
[ ] Add autofix to a rule
[ ] Add a CLI option
[ ] Add something to the core
[ ] Other, please explain:
Closes #18783
What changes did you make? (Give an overview)
Adds tabs to cli code blocks for multiple package mangers (yarn, pnpm, and bun).
There's a command:
npx eslint [options] [file|dir|glob]*innpm, the code tabs allows users to get the equivalent command inyarn,pnpm, andbun.