角度：自定义导入 - 指定文件路径

Posted 2023-03-13

【中文标题】角度：自定义导入 - 指定文件路径

【英文标题】：angular: custom imports - specifying path to file

【发布时间】：2019-08-22 00:41:45

【问题描述】：

还有其他方法 - 一种更简洁的方法来指定我的导入路径吗？我指的是点和正斜杠

我有这样的事情：

import  Product  from '../../../../../../@core/model/v2/domain/product';
import  ConfigService  from '../../../../../../@core/data/config.service';
import  ProductMappingContainer  from '../../../../../../@core/model/v2/dto/productMappingContainer';
import  AddProductModalSource  from '../../../../../../@core/model/v2/types/addProductModalSource';

【问题讨论】：

一个好的做法是避免文件夹结构过于深入/嵌套在您的项目中。

Avoiding relative paths in Angular CLI的可能重复

【参考方案1】：

打字稿编译器允许路径映射。

在您的 tsconfig.json 文件中，您可以添加 baseurl：

    "compilerOptions": 
    ...
    "baseUrl": "./src",
        "paths": 
            "@shared/*":["app/modules/shared/*"],
            "@core/*":["app/modules/core/*"]
        
    ...
    

然后在您的导入中：

import  MyComponent  from '@shared/components/mycomponent'

这取自medium-itnext article