Question

我正在使用angular 2和webpack开发应用程序。我想知道，有没有办法为进口做快捷方式？我的意思是我有时需要从层次结构中的文件夹中导入组件，所以我最终会做这样的事情。

import { UserComponent } from '../../../models/users/user.ts';

理想情况下只想做：

import {UserComponent} from '@models/users/user.ts';

或更短的东西。有没有办法创建快捷方式？

谢谢

Answer 1

我知道这个问题已有很多年了，我们拥有Angular 7，但是如果有人有相同的问题，这是一个答案。

您可以在文件Directions API中配置路径映射。

例如：假设我们具有以下文件夹结构：

tsconfig.json

我想为文件夹├── app │ ├── app.component.html │ ├── app.module.ts │ ├── ... │ └── shared │ └── material │ └── material.module.ts ... ...添加一个“快捷方式”。因此，我在shared文件的"@shared/*": ["app/shared/*"]中添加了compilerOptions。

tsconfig.json

现在我可以像这样导入我的共享模块了：

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./src",
    "paths": {
      "@shared/*": ["app/shared/*"]
    },
   // ... and so on

希望这对某人有帮助。

详细信息可以在Typescript Documentation中找到。

Angular2导入快捷方式

1 个答案: