php设置路径别名,浅谈Angular10配置@路径别名的方法

本文详细介绍了在Angular10中如何配置@路径别名,通过修改tsconfig.base.json文件,添加paths字段实现。配置后,@/*将映射到src/*,简化导入路径。若编辑器出现警告,尝试重启编辑器解决。
摘要由CSDN通过智能技术生成

本篇文章给大家介绍一下Angular10配置@路径别名的方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

7b257ef28f0d0648b79953a6daf07061.png

Angular10中配置@路径别名

Angular10中的项目文件结构 中文网站

Angular10中的tsconfig配置被分成了四个文件tsconfig.json工作空间中各项目的默认TSP配置

tsconfig.base.json工作空间的所有项目使用的基础TS配置,所有其它的配置文件都是继承自这个基础文件

tsconfig.app.json应用专属的TS配置包括TS和Angular模板编译器的选项

tsconfig.spec.json应用测试的TS配置

7b4efddb0a1259adce24f345dc97b8ec.png

主要配置是在tsconfig.base.json中

1、因为在TS的配置中有介绍,在compilerOptions中添加字段paths来进行声明映射{

"compileOnSave": false,

"compilerOptions": {

"baseUrl": "./",

"outDir": "./dist/out-tsc",

"sourceMap": true,

"declaration": false,

"downlevelIteration": true,

"experimentalDecorators": true,

"moduleResolution": "node",

"importHelpers": true,

"target": "es2015",

"module": "es2020",

"lib": ["es2018", "dom"],

"paths": {

"@/*": ["src/*"]

}

}

}

2、之后使用@/就相当于使用src/

3、使用了@/

900c8321d9b16bdd0d3e74baa738e4c6.png

4、没有使用@/

ee77854a31698067d36953531d79d0c7.png

可能会出现配置了之后在使用了的时候,编辑器抛出下划线警告,如果确定配置没问题,可以尝试重启编辑器试试

更多编程相关知识,请访问:编程视频!!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值