feat: allow to import TS files with js extension

[chenjiahan]

Summary

Allow to import TS files with .js extension, align the default behavior with TypeScript.

Related Links

• Resolving .js paths in TS project #3529
• TypeScript imports with .js file extensions don't work vercel/next.js#32237

Checklist

• Tests updated (or not required).
• Documentation updated (or not required).

[netlify]

✅ Deploy Preview for rsbuild ready!

Name	Link
🔨 Latest commit	66ba1b2
🔍 Latest deploy log	https://app.netlify.com/sites/rsbuild/deploys/66f14abdad03840008250993
😎 Deploy Preview	https://deploy-preview-3536--rsbuild.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	1 paths audited Performance: 75 (🟢 up 3 from production) Accessibility: 97 (no change from production) Best Practices: 100 (no change from production) SEO: 92 (no change from production) PWA: 60 (no change from production) View the detailed breakdown and full score reports

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[colinaaa]

Should we also add '.jsx': ['.jsx', '.tsx'] as the default extensionAlias?

[chenjiahan]

Agree, we can add '.jsx': ['.tsx', '.jsx'] to align with TypeScript. TS resolves .tsx first.

[joesaunderson]

@chenjiahan did you consider NPM repos that are called <thing>.js here?

Interestingly, on our CI, for 1.0.6 we are seeing failures importing fuse.js and tippy.js - usage:

import Fuse from "fuse.js";

Error

#23 31.41 error   Compile error: 
#23 31.41 Failed to compile, check the errors for troubleshooting.
#23 31.41 File: /.../useFuzzySearch/useFuzzySearch.ts:1:1
#23 31.41   × All of the aliased extensions are not found for /.../src/fuse.js

[chenjiahan]

Might be a bug of Rspack resolver, @SoonIter can you help to check it?

[chenjiahan]

@joesaunderson This error only appears when fuse.js module is not found, maybe you forget to install it?

[joesaunderson]

@joesaunderson This error only appears when fuse.js module is not found, maybe you forget to install it?

Hmm not sure, this was working fine on 1.0.5, but for a Dependabot change, where nothing else changes other than 1.0.6, it fails.

It was also failing for 'tippy.js" which makes me think it's a bug, not a failure to install?

I see an issue has been created, does that mean you can now replicate this?

[chenjiahan]

No, the issue is about improving the error logs. If you can provide a reproduction, that would be very helpful.

[joesaunderson]

I can replicate with just this minimal config:

Config:

{
    plugins: [pluginReact()],
    source: {
        entry: {
            app: {
                import: path.join(FRONTEND_PATH, "entry.tsx"),
                runtime: "runtime-app",
            },
        },
        tsconfigPath: path.join(BASE_PATH, "tsconfig.json"),
    },
}

TSConfig:

{
    "compilerOptions": {
        "strict": true,
        "baseUrl": "./",
        "paths": {
            "*": ["frontend/src/*"]
        },
        "esModuleInterop": true,
        "jsx": "preserve",
        "isolatedModules": true,
        "module": "esnext",
        "moduleResolution": "node",
        "removeComments": false,
        "incremental": false,
        "sourceMap": false,
        "skipLibCheck": true,
        "target": "esnext",
        "forceConsistentCasingInFileNames": true,
        "noEmit": true,
        "types": ["node", "@types/jest-axe"]
    },
    "include": ["src/**/*", "frontend/**/*"],
    "exclude": ["node_modules"]
}

File (frontend/src/useThing.ts)

import Fuse from "fuse.js";

console.log(Fuse);

Error:

File: /<>/<>/<>/frontend/src/useThing.ts:1:1
  × All of the aliased extensions are not found for /<>/<>/<>/frontend/node_modules/fuse.js

[chenjiahan]

@SoonIter you can help to check ⬆️

[joesaunderson]

@chenjiahan I can confirm that on 1.0.7 this is now working, so your changes above (the revert) fixed that. Thanks.