tsconfig.json 怎么配置 @别名
时间: 2024-04-24 07:23:31 浏览: 10
要在 TypeScript 项目中配置别名,你需要修改 `tsconfig.json` 文件。以下是一种常见的配置方式:
首先,在 `tsconfig.json` 文件中找到 `compilerOptions` 字段,然后添加一个新的字段 `paths`,它是一个对象,用于配置别名与对应的路径:
```json
{
"compilerOptions": {
// 其他的配置项...
"paths": {
"@/*": ["src/*"]
}
}
}
```
上述配置中,我们使用 `@/*` 作为别名,表示以 `@/` 开头的路径。`src/*` 是实际文件所在的相对路径。你可以根据自己的项目结构进行相应调整。
接下来,当你在代码中引用模块时,可以使用 `@/` 作为别名来代替实际的路径。例如:
```typescript
import { SimpleState } from '@/stores/simple-state';
```
这样配置后,TypeScript 编译器会将 `@/` 替换为 `src/` 路径,并找到对应的模块。
请确保在修改完 `tsconfig.json` 后重新编译你的 TypeScript 代码,以使配置生效。
注意:你可能还需要在编辑器(如 VS Code)中配置别名支持,以便在代码编辑时获得正确的路径解析和自动补全功能。这通常需要编辑 `.vscode/settings.json` 文件并添加以下配置:
```json
{
"typescript.preferences.importModuleSpecifier": "non-relative"
}
```
以上是一种常见的配置方式,具体的配置可能因项目而异。你可以根据你的项目结构和需求进行相应的调整。