我正在阅读tsconfig中的路径映射。json，我想用它来避免使用以下丑陋的路径:
项目组织有点奇怪，因为我们有一个包含项目和库的单一存储库。项目按公司和浏览器/服务器/通用进行分组。
如何配置tsconfig中的路径?Json，而不是:
import { Something } from "../../../../../lib/src/[browser/server/universal]/...";
我可以使用:
import { Something } from "lib/src/[browser/server/universal]/...";
webpack配置中还需要其他东西吗?或者是tsconfig。json足够了吗?
当前回答
这是相对路径 而不是下面的代码
import { Something } from "../../../../../lib/src/[browser/server/universal]/...";
我们可以避免“../../../../.. .”/“它看起来很奇怪，也不容易读。
Typescript配置文件有相同的答案。 只要指定baseUrl，配置就会照顾你的相对路径。
配置方法:tsconfig。Json文件添加以下属性。
"baseUrl": "src",
"paths": {
"@app/*": [ "app/*" ],
"@env/*": [ "environments/*" ]
}
最终会像下面这样
import { Something } from "@app/src/[browser/server/universal]/...";
它看起来简单，令人敬畏，更可读。
其他回答
如果你正在寻找用@引用根文件夹的最简单的例子，这将是它:
{
"compilerOptions": {
"baseUrl": "src",
"paths": {
"@/*": ["*"]
}
}
}
// Example usage: import * as logUtils from '@/utils/logUtils';
或者如果你甚至没有src文件夹，或者想要显式地将它包含在导入中，这也可以工作:
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@/*": ["*"]
}
}
}
// Example usage: import * as logUtils from '@/src/utils/logUtils';
这是相对路径 而不是下面的代码
import { Something } from "../../../../../lib/src/[browser/server/universal]/...";
我们可以避免“../../../../.. .”/“它看起来很奇怪，也不容易读。
Typescript配置文件有相同的答案。 只要指定baseUrl，配置就会照顾你的相对路径。
配置方法:tsconfig。Json文件添加以下属性。
"baseUrl": "src",
"paths": {
"@app/*": [ "app/*" ],
"@env/*": [ "environments/*" ]
}
最终会像下面这样
import { Something } from "@app/src/[browser/server/universal]/...";
它看起来简单，令人敬畏，更可读。
如果你正在使用tsconfig-paths，这对你不起作用，试试tsconfig.json:
{
// ...
"compilerOptions": {
"outDir": "dist",
"rootDir": "src",
"baseUrl": ".",
"paths": {
"@some-folder/*": ["./src/app/some-folder/*", "./dist/app/some-folder/*"],
// ...
}
},
// ...
}
如果编译器看到@some-folder/some-class，它会试图在./src…或在。/dist....
/只从根目录开始，为了获得相对路径，我们应该使用./或../
用星号检查类似的解决方案
"baseUrl": ".",
"paths": {
"*": [
"node_modules/*",
"src/types/*"
]
},
