fix(tanstack): add missing ".js" extension for relative imports

[ymc9]

Summary by CodeRabbit

• Chores
  • Updated module import paths to include explicit file extensions across TanStack Query client packages for improved module resolution consistency.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

📝 Walkthrough

Walkthrough

Import statements across four files in the tanstack-query client package were updated to include explicit .js file extensions for module paths, including common modules (client, constants, query-key, types). No logic or API modifications were introduced.

Changes

Cohort / File(s)	Summary
Module Path Standardization - Common Module packages/clients/tanstack-query/src/common/client.ts	Updated import path from ./query-key to ./query-key.js, adding explicit .js extension for module resolution.
Module Path Standardization - Framework Adapters packages/clients/tanstack-query/src/react.ts, packages/clients/tanstack-query/src/svelte/index.svelte.ts, packages/clients/tanstack-query/src/vue.ts	Updated all relative imports to append .js extensions for modules: common/client, common/constants, common/query-key, and common/types. No changes to logic or public APIs.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

Poem

🐰 Hop hop, the imports now align!
With .js extensions, everything's fine,
No logic bent, no functions changed,
Just module paths, neatly arranged!

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately describes the main change across all affected files: adding explicit .js extensions to relative imports throughout the tanstack-query package modules.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch fix/issue-607

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[claude]

Claude finished @ymc9's task —— View job

---

Code Review for Tanstack Query Import Fixes

Reviewing the addition of ".js" extensions for relative imports in the TanStack Query package.

Review Tasks:

• Examine the specific import changes made
• Verify correctness of .js extension usage
• Check for any missed imports that need fixing
• Analyze impact on code quality and best practices
• Look for potential bugs or issues
• Consider performance and security implications
• Assess test coverage needs

✅ Overall Assessment: EXCELLENT

This is a well-executed fix that correctly addresses ESM module resolution requirements.

Code Quality & Best Practices ✅

Strengths:

• Correct ESM compliance: The package.json has "type": "module", making .js extensions mandatory for relative imports in ESM
• Consistent application: All 13 relative imports across 4 files now include the .js extension
• Proper targeting: Only relative imports were modified - external package imports correctly remain unchanged

Pattern Verification:

• './common/client' → './common/client.js' ✅
• './common/constants' → './common/constants.js' ✅
• './common/query-key' → './common/query-key.js' ✅
• './common/types' → './common/types.js' ✅
• '../common/client' → '../common/client.js' ✅ (in svelte)

Technical Correctness ✅

• Complete coverage: Verified no relative imports without .js extensions remain in the package
• Framework consistency: Changes applied correctly across React, Vue, and Svelte implementations
• Build compatibility: Fixes resolve TypeScript/bundler issues with ES module resolution

Performance & Security ✅

• Zero runtime impact: These are compile-time import path changes only
• No security implications: Pure syntactic fix with no behavioral changes
• Build optimization: Enables proper tree-shaking and module resolution

Potential Issues

None identified. This is a straightforward, necessary fix.

Test Coverage

No additional tests needed - this is a build/module resolution fix that existing tests will validate.

Recommendations

• ✅ Ready to merge - This fix is technically correct and complete
• Consider adding a linting rule to prevent future regressions of missing .js extensions

---

[ymc9]

fixes #607

[Copilot]

Pull request overview

This PR fixes module resolution issues by adding .js extensions to relative imports in the tanstack-query package. This change is required for proper ESM module resolution, as the package uses "type": "module" in package.json and TypeScript's verbatimModuleSyntax option.

Changes:

• Added .js extensions to all relative imports across React, Vue, and Svelte adapters
• Updated imports in the shared common utilities module

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated no comments.

File	Description
packages/clients/tanstack-query/src/vue.ts	Added .js extensions to 4 relative imports from common modules
packages/clients/tanstack-query/src/svelte/index.svelte.ts	Added .js extensions to 4 relative imports from common modules
packages/clients/tanstack-query/src/react.ts	Added .js extensions to 4 relative imports from common modules
packages/clients/tanstack-query/src/common/client.ts	Added .js extension to 1 relative import from query-key module

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[ymc9]

fixes #607