Describe the bug
I used import alias @/
and it worked. Then i switched to Vite and it supports only root aliases. So i switched my code to use /@/
aliases. It compiles and works in browser, but gives me an error in vscode:
To Reproduce
Use /@/
import
Expected behavior
Everything works
System (please complete the following information):
You'll also have to configure the alias for typescript though tsconfig/jsconfig.json
https://www.typescriptlang.org/docs/handbook/module-resolution.html#path-mapping
I'm also facing the same issue which tsc
can compile it just fine. However, tools like svelte-check
won't be able to resolve the alias path correctly and throw errors like OP. It seems like there's a bug related to language-tools
not able to resolve tsconfig.json
in the project folder correctly?
That error is because we have used some special property injected by svelte2tsx to do component type-check. If we can't find the actual file we can't transform the file using svelte2tsx.
@cayter where do you put your tsconfig?
@jasonlyu123 Below is my project folder structure which happens to be a monorepo for both backend/frontend:
.
βββ Makefile
βββ README.md
βββ database
β βββ database.rules.json
βββ firebase.json
βββ firestore
β βββ firestore.indexes.json
β βββ firestore.rules
βββ functions // backend code
β βββ package-lock.json
β βββ package.json
β βββ src
β β βββ index.ts
β βββ tsconfig.json
βββ hosting // frontend PWA code
β βββ ...
β βββ src
β β βββ components
β β β βββ App.svelte
β β β βββ ...
β β βββ images
β β β βββ cover.png
β β β βββ ...
β β βββ index.css
β β βββ index.ts
β β βββ pages
β β β βββ Auth
β β β β βββ ...
β β β βββ Error
β β β β βββ ...
β β β βββ Home
β β β β βββ ...
β β β βββ User
β β β βββ ...
β β βββ stores
β β βββ ...
β βββ svelte.config.js
β βββ tailwind.config.js
β βββ tsconfig.json
β βββ vite.config.ts
β βββ workbox.config.js
βββ package-lock.json
βββ package.json
hosting/tsconfig.json
{
"compilerOptions": {
"allowSyntheticDefaultImports": true,
"baseUrl": "src",
"declaration": true,
"emitDecoratorMetadata": true,
"esModuleInterop": true,
"experimentalDecorators": true,
"forceConsistentCasingInFileNames": true,
"importHelpers": true,
"importsNotUsedAsValues": "error",
"isolatedModules": true,
"lib": ["dom", "esnext", "es6"],
"module": "esnext",
"moduleResolution": "node",
"noEmit": true,
"noImplicitAny": true,
"noImplicitReturns": true,
"noImplicitThis": true,
"rootDir": "src",
"skipLibCheck": true,
"sourceMap": true,
"strict": true,
"strictBindCallApply": true,
"strictFunctionTypes": true,
"strictPropertyInitialization": true,
"strictNullChecks": true,
"target": "esnext",
"types": ["jest", "node", "svelte"],
"paths": {
"/@/*": ["*"]
}
},
"include": ["src/**/*"],
"exclude": ["node_modules/*", "public/*"]
}
If we can't find the actual file we can't transform the file using svelte2tsx.
Yep, this is relevant to alias path resolving defined in the project's tsconfig.json
is not being honoured. So, if we change it to relative path instead of using alias path, the vscode extension and svelte-check will not throw any error anymore which you can see from OP's screenshot for the ComboBox
component.
Can you check the output channel of vscode, chose svelte in the dropdown on the right. And see if you have something like this
Initialize new ts service at c:/Current Projects/svelte-app/tsconfig.json
and post the log here.
I can reproduce this. For some reason getDefinitionAndBoundSpan
can deal with TS/JS files imported from such locations, but not with .svelte
files.
The problem is inside our module-loader
, which delegates to the normal TS resolution because the check for "is absolute path" is true (file paths starting with /
are absolute in linux). I think we need additional checks for "is this prefix part of tsconfig paths".
OP actually said it works with @/
and I missed it. Sorry π
I forgot to say how awesome you guys are. Thank you for quick response
Most helpful comment
The problem is inside our
module-loader
, which delegates to the normal TS resolution because the check for "is absolute path" is true (file paths starting with/
are absolute in linux). I think we need additional checks for "is this prefix part of tsconfig paths".