我正在阅读tsconfig中的路径映射。json，我想用它来避免使用以下丑陋的路径:
项目组织有点奇怪，因为我们有一个包含项目和库的单一存储库。项目按公司和浏览器/服务器/通用进行分组。
如何配置tsconfig中的路径?Json，而不是:
import { Something } from "../../../../../lib/src/[browser/server/universal]/...";
我可以使用:
import { Something } from "lib/src/[browser/server/universal]/...";
webpack配置中还需要其他东西吗?或者是tsconfig。json足够了吗?
当前回答
{
"compilerOptions": {
"baseUrl": "src"
},
"include": ["src"]
}
我不确定我们是否必须定义路径。但是在将baseUrl写入src之后 我可以像这样导入SRC文件夹下的所有文件夹
import { Home } from "pages";
import { formatDate } from "utils";
import { Navbar } from "components";
不要忘记在修改tsconfig.json后重新启动您的终端
其他回答
这对我来说很管用:
yarn add --dev tsconfig-paths
ts-node -r tsconfig-paths/register <your-index-file>.ts
这将加载tsconfig.json中的所有路径。tsconfig.json示例:
{
"compilerOptions": {
{…}
"baseUrl": "./src",
"paths": {
"assets/*": [ "assets/*" ],
"styles/*": [ "styles/*" ]
}
},
}
确保你有baseUrl和路径来工作
然后你可以像这样导入:
import {AlarmIcon} from 'assets/icons'
用星号检查类似的解决方案
"baseUrl": ".",
"paths": {
"*": [
"node_modules/*",
"src/types/*"
]
},
确保你有 ｀ { “compileOnSave”:没错, " compilerOptions ": { "路径":{ “@styles /”:(“资产/ scss /”) ｝ }， ｝
｀ 这给我带来了麻烦。
使用这个检出编译器操作
我在文件中添加了baseUrl项目如下:
“baseUrl " src "
它工作得很好。因此，为项目添加基本目录。
Alejandros的答案对我有用，但是当我在webpack 4中使用awesome-typescript-loader时，我还必须在我的webpack中添加tsconfig-paths-webpack-plugin。配置文件以正确解析
