Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

导入类型时省略.tsx后缀,在defineProps<>中使用导入的类型,会提示Failed to resolve import source "xxxx" #10635

Closed
shaw996 opened this issue Apr 2, 2024 · 4 comments · May be fixed by #10762
Labels
has workaround A workaround has been found to avoid the problem 🐞 bug Something isn't working 🔩 p2-edge-case

Comments

@shaw996
Copy link
Contributor

shaw996 commented Apr 2, 2024

Vue version

3.4.21

Link to minimal reproduction

https://stackblitz.com/edit/vitejs-vite-uqa6ny

Steps to reproduce

  1. constant.tsx 中定义类型“HelloWorldProps”
  2. HelloWorld.vue 中导入“HelloWorldProps”,省略 constant.tsx 的文件扩展名
  3. defineProps<> 使用“HelloWorldProps”

What is expected?

应用正常运行

What is actually happening?

终端报错:

[plugin:vite:vue] [@vue/compiler-sfc] Failed to resolve import source "xxxx"

System Info

No response

Any additional comments?

No response

@unbrain
Copy link

unbrain commented Apr 3, 2024

try rename file as .ts or import ./xxxxx.tsx

@shaw996
Copy link
Contributor Author

shaw996 commented Apr 3, 2024

try rename file as .ts or import ./xxxxx.tsx

import ./xxx.tsx can solve this problem, but i expect running normally without .tsx. I would like to omit extra name in my project.

@unbrain
Copy link

unbrain commented Apr 4, 2024

maybe can find answer in vite

resolve.extensions doesn't seem to be effective

@shaw996
Copy link
Contributor Author

shaw996 commented Apr 4, 2024

maybe can find answer in vite

resolve.extensions doesn't seem to be effective

It seems not related to resolve.extensions.
The cause of this error is .tsx been ignored while resolved the type used in defineProps<>.

Related Codes:

/** packages/compiler-sfc/src/script/resolveType.ts */
/** line: 950 */

function resolveExt(filename: string, fs: FS) {
  // #8339 ts may import .js but we should resolve to corresponding ts or d.ts
  filename = filename.replace(/\.js$/, '')
  const tryResolve = (filename: string) => {
    if (fs.fileExists(filename)) return filename
  }
  return (
    tryResolve(filename) ||
    tryResolve(filename + `.ts`) ||
    tryResolve(filename + `.d.ts`) ||
    tryResolve(joinPaths(filename, `index.ts`)) ||
    tryResolve(joinPaths(filename, `index.d.ts`))
  )
}

@haoqunjiang haoqunjiang added 🐞 bug Something isn't working has workaround A workaround has been found to avoid the problem 🔩 p2-edge-case labels Apr 7, 2024
@github-actions github-actions bot locked and limited conversation to collaborators Apr 24, 2024
lynxlangya pushed a commit to lynxlangya/core that referenced this issue May 30, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
has workaround A workaround has been found to avoid the problem 🐞 bug Something isn't working 🔩 p2-edge-case
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants