style: format code with ESLint + Prettier Add Prettier configuration and apply code formatting#20
style: format code with ESLint + Prettier Add Prettier configuration and apply code formatting#20IO-Fire wants to merge 3 commits into
Conversation
📝 WalkthroughWalkthroughThe PR adds Prettier configuration and integrates eslint-plugin-prettier, updates related dev-dependencies and workspace trust policy, and applies formatting changes across source, tests, fixtures and config files to align with the new code style. Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes 🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches🧪 Generate unit tests (beta)
📜 Recent review detailsConfiguration used: Organization UI Review profile: ASSERTIVE Plan: Pro ⛔ Files ignored due to path filters (1)
📒 Files selected for processing (1)
🔇 Additional comments (2)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
🤖 Fix all issues with AI agents
In @.prettierignore:
- Around line 10-13: Update the .prettierignore file to also exclude other
lockfiles so Prettier won’t format alternative package manager files; add
entries for package-lock.json and yarn.lock alongside the existing
pnpm-lock.yaml, node_modules, and .pnpm-store entries so all common lockfiles
are ignored.
In @eslint.config.mjs:
- Around line 1-4: Remove the duplicate @ts-check directive: in the top of the
file where two "// @ts-check" lines appear, keep a single "// @ts-check" and
delete the second one (the second occurrence just above the import of
eslintPluginPrettierRecommended) so the file has only one @ts-check comment.
- Around line 21-30: The rules block is redundantly disabling @stylistic rules
that eslint-config-prettier already turns off via the
eslint-plugin-prettier/recommended preset; remove the six entries
('@stylistic/comma-dangle', '@stylistic/operator-linebreak',
'@stylistic/brace-style', '@stylistic/arrow-parens',
'@stylistic/indent-binary-ops', '@stylistic/indent') from the rules object so
the config is cleaner, then run the suggested check (npx eslint-config-prettier
eslint.config.mjs) to confirm those rules are reported as conflicts and the
manual disables are unnecessary.
📜 Review details
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (15)
.prettierignore.prettierrceslint.config.mjspackage.jsonplayground/app/app.vueplayground/nuxt.config.tspnpm-workspace.yamlsrc/module.tssrc/runtime/nitro/plugins/nitro-resource-link.tstest/basic.test.tstest/fixtures/basic/app.vuetest/fixtures/basic/nuxt.config.tstest/fixtures/image/app.vuetest/fixtures/image/nuxt.config.tstest/image.test.ts
🔇 Additional comments (16)
test/fixtures/image/nuxt.config.ts (1)
4-10: LGTM! Formatting changes applied correctly.The Prettier formatting has been applied consistently—modules array collapsed to a single line and trailing commas adjusted per the new style guide. No functional changes detected.
src/module.ts (1)
1-66: LGTM! Consistent formatting applied throughout.The Prettier formatting has been applied consistently across imports, object literals, and function calls. All changes are cosmetic with no functional impact.
src/runtime/nitro/plugins/nitro-resource-link.ts (1)
1-229: LGTM! Formatting applied consistently.The Prettier formatting has been applied throughout the file, improving readability of imports, conditionals, and complex expressions. No functional changes detected.
playground/nuxt.config.ts (1)
5-5: LGTM! Trailing comma removed per Prettier configuration.The removal of the trailing comma aligns with the new Prettier configuration (
"trailingComma": "none"). This is a formatting-only change with no functional impact..prettierrc (1)
1-5: LGTM! Sensible Prettier configuration.The Prettier configuration choices are reasonable and widely adopted:
singleQuote: trueenforces consistent quote usagetrailingComma: "none"maintains clean object/array literalssemi: falseleverages modern JavaScript's Automatic Semicolon InsertionThese settings align with the formatting changes applied throughout the codebase.
playground/app/app.vue (1)
2-2: LGTM! Vue template and script formatting applied.The template content and empty script setup tag have been collapsed to single lines, which is a formatting-only change with no functional impact. This aligns with Prettier's default Vue formatting style.
Also applies to: 5-5
test/fixtures/basic/nuxt.config.ts (1)
4-4: LGTM! Modules array reformatted to single line.The modules array has been reformatted from multi-line to single line, which is a formatting-only change consistent with Prettier's handling of short arrays. No functional changes.
test/image.test.ts (4)
7-7: LGTM! Setup configuration formatting adjusted.The rootDir parameter has been reformatted for consistency. This is a formatting-only change with no functional impact.
22-24: LGTM! Expect statement reformatted for readability.The expect assertion has been wrapped to multiple lines, improving readability of the long regex pattern. The assertion logic remains unchanged.
35-38: LGTM! Expect statement reformatted for readability.The expect assertion within the onResponse callback has been wrapped to multiple lines, improving readability of the long regex pattern. The assertion logic remains unchanged.
50-53: LGTM! Expect statement reformatted for readability.The expect assertion within the onResponse callback has been wrapped to multiple lines, improving readability of the long string assertion. The assertion logic remains unchanged.
test/basic.test.ts (1)
7-7: Formatting changes approved.The test assertions have been reformatted for consistency with Prettier's line-length rules. All test logic, assertion targets, and string content remain unchanged; this is purely a readability-focused formatting pass aligned with the PR objectives.
Also applies to: 21-23, 33-45, 55-57
test/fixtures/image/app.vue (1)
17-17: Formatting consolidation approved.Empty
<script setup>and<style>blocks have been consolidated to self-closing tags per Prettier's SFC formatting conventions. The template and component functionality remain unchanged.Also applies to: 19-19
package.json (1)
59-60: Tooling dependencies added appropriately.The introduction of
eslint-config-prettierandeslint-plugin-prettieraligns with the PR objectives and provides the necessary configuration to enforce Prettier formatting via ESLint. Both versions are stable and compatible with the existing ESLint 9.39.1 baseline. These are dev-only dependencies with no runtime impact.eslint.config.mjs (1)
18-18: LGTM!The Prettier plugin is correctly inserted before the Nuxt Vue rules, ensuring proper rule precedence and avoiding conflicts.
test/fixtures/basic/app.vue (1)
8-28: LGTM!The formatting changes improve readability by expanding the link objects to multi-line format. These are purely cosmetic changes with no functional impact, aligning with the Prettier formatting standards introduced in this PR.
| # Node dependencies | ||
| node_modules | ||
| .pnpm-store | ||
| pnpm-lock.yaml |
There was a problem hiding this comment.
🧹 Nitpick | 🔵 Trivial
Consider adding other lockfiles to the ignore list.
Whilst pnpm-lock.yaml is appropriately ignored, consider also adding package-lock.json and yarn.lock to prevent Prettier from formatting these files if different package managers are used in the project.
📝 Suggested addition
# Node dependencies
node_modules
.pnpm-store
+package-lock.json
pnpm-lock.yaml
+yarn.lock📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| # Node dependencies | |
| node_modules | |
| .pnpm-store | |
| pnpm-lock.yaml | |
| # Node dependencies | |
| node_modules | |
| .pnpm-store | |
| package-lock.json | |
| pnpm-lock.yaml | |
| yarn.lock |
🤖 Prompt for AI Agents
In @.prettierignore around lines 10 - 13, Update the .prettierignore file to
also exclude other lockfiles so Prettier won’t format alternative package
manager files; add entries for package-lock.json and yarn.lock alongside the
existing pnpm-lock.yaml, node_modules, and .pnpm-store entries so all common
lockfiles are ignored.
| // @ts-check | ||
| import { createConfigForNuxt } from '@nuxt/eslint-config/flat' | ||
| // @ts-check | ||
| import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended' |
There was a problem hiding this comment.
Remove duplicate @ts-check directive.
The @ts-check directive appears twice (line 1 and line 3). Remove the duplicate on line 3.
🧹 Proposed fix
// @ts-check
import { createConfigForNuxt } from '@nuxt/eslint-config/flat'
-// @ts-check
import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended'📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| // @ts-check | |
| import { createConfigForNuxt } from '@nuxt/eslint-config/flat' | |
| // @ts-check | |
| import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended' | |
| // @ts-check | |
| import { createConfigForNuxt } from '@nuxt/eslint-config/flat' | |
| import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended' |
🤖 Prompt for AI Agents
In @eslint.config.mjs around lines 1 - 4, Remove the duplicate @ts-check
directive: in the top of the file where two "// @ts-check" lines appear, keep a
single "// @ts-check" and delete the second one (the second occurrence just
above the import of eslintPluginPrettierRecommended) so the file has only one
@ts-check comment.
| { | ||
| rules: { | ||
| '@stylistic/comma-dangle': 0, | ||
| '@stylistic/operator-linebreak': 0, | ||
| '@stylistic/brace-style': 0, | ||
| '@stylistic/arrow-parens': 0, | ||
| '@stylistic/indent-binary-ops': 0, | ||
| '@stylistic/indent': 0 | ||
| } | ||
| } |
There was a problem hiding this comment.
🧹 Nitpick | 🔵 Trivial
🧩 Analysis chain
🏁 Script executed:
# Check if eslint-config-prettier exists and the full eslint.config.mjs content
cat package.json | jq '.devDependencies | to_entries[] | select(.key | contains("prettier") or contains("eslint")) | {key: .key, value: .value}'Repository: IO-Fire/nuxt-resource-hints
Length of output: 285
🏁 Script executed:
# Read the full eslint.config.mjs to understand the configuration structure
cat -n eslint.config.mjsRepository: IO-Fire/nuxt-resource-hints
Length of output: 1126
🏁 Script executed:
# Check if there's a prettier config file
ls -la | grep prettierRepository: IO-Fire/nuxt-resource-hints
Length of output: 200
🌐 Web query:
eslint-plugin-prettier/recommended eslint-config-prettier rules disabled
💡 Result:
Short answer
- plugin:prettier/recommended enables prettier/prettier, turns off eslint-config-prettier’s set of formatting/conflicting rules, and (specifically) disables arrow-body-style and prefer-arrow-callback. [1][2]
Details / how to see the exact list
- eslint-config-prettier’s job is to “turn off all rules that are unnecessary or might conflict with Prettier” — that includes many core ESLint rules and rules from common plugins (e.g. @typescript-eslint, react, unicorn, vue, etc.). The exact disabled ruleset is maintained in the eslint-config-prettier repo and can change between versions. [2]
- To get the precise list for your version, run the included CLI helper: npx eslint-config-prettier path/to/file.js — it reports rules in your config that conflict with Prettier. You can also inspect the project’s disabled-rules files on its GitHub. [2]
Sources
- eslint-plugin-prettier README (recommended config notes). [1]
- eslint-config-prettier README (what it disables, special rules, CLI helper). [2]
🏁 Script executed:
# Check if we can find more details about what prettier-recommended config includes
# by checking node_modules or package info
npm list eslint-plugin-prettier 2>/dev/null | head -20Repository: IO-Fire/nuxt-resource-hints
Length of output: 128
🏁 Script executed:
# Let's check the actual prettierrc config
cat .prettierrcRepository: IO-Fire/nuxt-resource-hints
Length of output: 140
Consider removing redundant @Stylistic rule disables.
eslint-plugin-prettier/recommended is already integrated and extends eslint-config-prettier, which disables all ESLint formatting rules that conflict with Prettier—including the six @stylistic rules manually disabled here. These manual overrides are likely unnecessary and can be removed for cleaner configuration.
To confirm, run: npx eslint-config-prettier eslint.config.mjs and verify that these @stylistic rules are listed in the conflicts. If they are, the manual disables can be safely removed.
🤖 Prompt for AI Agents
In @eslint.config.mjs around lines 21 - 30, The rules block is redundantly
disabling @stylistic rules that eslint-config-prettier already turns off via the
eslint-plugin-prettier/recommended preset; remove the six entries
('@stylistic/comma-dangle', '@stylistic/operator-linebreak',
'@stylistic/brace-style', '@stylistic/arrow-parens',
'@stylistic/indent-binary-ops', '@stylistic/indent') from the rules object so
the config is cleaner, then run the suggested check (npx eslint-config-prettier
eslint.config.mjs) to confirm those rules are reported as conflicts and the
manual disables are unnecessary.
IO-Fire
changed the title
coderabbitai
Bot
changed the title
1 participant
@coderabbitai
Summary by CodeRabbit
Chores
Style
✏️ Tip: You can customize this high-level summary in your review settings.