I have been trying for a while to solve the problem with paths in tsconfig.paths.json. My compiler looks for files in the first location but not the "fall back location".
Here is my tsconfig.paths.json:
What I get in the console when I let the debug field true:
Initial options:
{
"source": "tsconfig",
"baseUrl": "./src",
"tsConfigPath": "tsconfig.paths.json",
"debug": true
}
Normalized options:
{
"source": "tsconfig",
"baseUrl": "./src",
"tsConfigPath": "tsconfig.paths.json",
"debug": true,
"unsafeAllowModulesOutsideOfSrc": false
}
Initial aliases:
{
"*": "<path-to-root-folder>\\src\\*"
}
Aliases:
{
"*": "<path-to-root-folder>\\src\\*"
}
Webpack Config:
{
"react-native": "react-native-web",
"*": "<path-to-root-folder>\\src\\*"
}
The following changes are being made to your tsconfig.json file:
- compilerOptions.paths must not be set (aliased imports are not supported)
VSCode does not complain about anything. However, when I run npm start (craco start), I get the error Module not found: Can't resolve 'images/abcde.svg' in <path-to-root-folder>/src/images/abcde.svg.
Note: the abcde.svg file exists in src/core-componentsbut not in the src/images. However, I have specified the"": ["", "core-components/src/*"], I would expect the compiler looks to thesrc/imagesfirst. If the module/svg file is not there, it looks in thecore-components/src/images`. However, it does not.
From the console log, we can't see the "core-components/src/*" added to the Aliases. According to the TS module-resolution, the path together with its fallback locations should be included.
I want to use paths because I can't export hundreds of images in the root/src/core-components/src/images folder and use them somewhere else or override some of them in the root/src/images. The compiler will first look for matched files in this folder if the images exist.
Hey guys,
I have been trying for a while to solve the problem with
paths
in tsconfig.paths.json. My compiler looks for files in the first location but not the "fall back location". Here is mytsconfig.paths.json
:Note: the
core components
folder is inside the rootsrc
.And my
craco.config.js
:What I get in the console when I let the
debug
fieldtrue
:VSCode does not complain about anything. However, when I run
npm start
(craco start
), I get the errorModule not found: Can't resolve 'images/abcde.svg' in <path-to-root-folder>/src/images/abcde.svg
. Note: theabcde.svg
file exists insrc/core-components
but not in the src/images. However, I have specified the
"": ["", "core-components/src/*"], I would expect the compiler looks to the
src/imagesfirst. If the module/svg file is not there, it looks in the
core-components/src/images`. However, it does not.From the console log, we can't see the
"core-components/src/*"
added to the Aliases. According to the TS module-resolution, the path together with its fallback locations should be included.I want to use
paths
because I can't export hundreds of images in theroot/src/core-components/src/images
folder and use them somewhere else or override some of them in theroot/src/images
. The compiler will first look for matched files in this folder if the images exist.