首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Angular 5 tsconfig baseURL不工作

Angular 5是一种流行的前端开发框架,而tsconfig.json是Angular项目中的配置文件之一。在tsconfig.json中,baseURL用于指定模块解析的基本路径。然而,在Angular 5中,tsconfig.json中的baseURL选项不起作用,因为Angular使用了不同的模块解析策略。

在Angular中,模块解析是通过模块加载器进行的,而不是通过tsconfig.json中的baseURL选项。模块加载器会根据模块的相对路径或者配置的路径来解析模块。

如果你想在Angular 5中设置基本路径,可以通过修改tsconfig.json中的paths选项来实现。paths选项允许你为特定的模块路径配置别名,从而简化模块的导入。

下面是一个示例的tsconfig.json文件,展示了如何使用paths选项来设置基本路径:

代码语言:txt
复制
{
  "compilerOptions": {
    "baseUrl": "./src",
    "paths": {
      "@app/*": ["app/*"]
    }
  }
}

在上面的示例中,baseUrl指定了基本路径为"./src",而paths中的配置为"@app/": ["app/"],表示以"@app/"开头的模块路径都会被解析为"app/"目录下的文件。

这样,当你在Angular项目中导入模块时,可以使用"@app/"作为路径的前缀,而不需要指定完整的相对路径。例如:

代码语言:txt
复制
import { AppComponent } from '@app/app.component';

推荐的腾讯云相关产品:腾讯云云开发(Tencent Cloud CloudBase)是一款支持前后端一体化开发的云原生全托管服务,提供了完善的开发工具和资源,帮助开发者快速构建和部署应用。腾讯云云开发支持多种开发语言和框架,包括Angular,提供了丰富的功能和服务,如云函数、数据库、存储、静态网站托管等,可以满足各种应用场景的需求。

更多关于腾讯云云开发的信息,请访问:腾讯云云开发

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

会写 TypeScript 但你真的会 TS 编译配置吗?

最近遇到了挺多涉及到前端“编译”方面的工作,其中关于 TypeScript 的编译会涉及到关于 tsconfig.json 文件的配置,由于配置项繁杂,遂逐一解析并验证,减少大家的一些疑惑,并提升工作效率...语法的 TS 文件编译为符合 ES5 语法规范的 *.js 文件。.../Await、Promise、扩展运算符,并在 tsconfig.jon -> target 设置为 ES5: 验证 target 降级处理 然后发现在右侧的 dist/index.js 文件中,依然存在...(6). baseUrl & paths baseUrl:设置基本目录以解析非绝对模块名称(定义一个根目录,以此进行绝对文件路径解析) paths:用于设置模块名或路径映射列表,这样就可以简写项目中自定义模块的文件路径...举一个 : { "compilerOptions": { // 注意:baseUrl 必选,与 paths 成对出现,以 tsconfig.json 文件所在目录开始 "baseUrl

3.4K41

模块解析机制_TypeScript笔记14

mod) 其它形式的都是非相对模块引入(non-relative import),例如: import * as $ from "jquery"; import { Component } from "@angular...因此,在运行时模块可能具有不同于源文件的命名,或者编译时最后输出的模块路径与对应的源文件匹配 针对这些问题,TypeScript 提供了一系列标记用来告知编译器期望发生在源路径上的转换,以生成最终输出...(指定相对路径的话,根据当前目录计算) tsconfig.json中baseUrl字段(相对路径的话,根据tsconfig.json所在目录计算) 注意,相对模块引入不受 baseUrl 影响,因为总是相对于引入它们的文件去解析...TypeScript 同样支持类似的映射配置(tsconfig.json的paths字段),例如: { "compilerOptions": { "baseUrl": "...所在目录即 TypeScript 项目目录,指定files或exclude的话,该目录及其子孙目录下的所有文件都会被添加到编译过程中。

1.7K30

tsconfig.json配置项备忘

tsconfig.json 是放在项目根目录,用来配置一些编译选项等。当我们使用 tsc 命令编译项目,且没有指定输入文件时,编译器就会去查找 tsconfig.json 文件。...如果命令行上指定了输入文件时,tsconfig.json 的配置会被忽略 tsconfig 一级配置项 { // compileOnSave 的值是 true 或 false。...如果 target 为 ES5,默认包含的库有DOM、ES5和ScriptHost;如果 target 是 ES6,默认引入的库有DOM、ES6、DOM.Iterable和ScriptHost。...noEmit 是否生成编译文件,不是很明白这个选项拿来干什么。...baseUrl baseUrl 用于设置解析非相对模块名称的基本目录,这个我们在讲《模块和命名空间》的“模块解析配置项”一节时已经讲过了,相对模块不会受 baseUrl 的影响。

57310

基于 Yarn 的 Monorepo 实践

{ "compilerOptions": { "target":"es6"/*Specify ECMAScript target version:'ES3'(default), 'ES5'.../tsconfig.isomorph", "compilerOptions": { "baseUrl":"....xxx/ -node_modules/# 与公共依赖版本冲突的特殊依赖 但这个实现也相对的复杂,作为使用者我还没深入的看源码理解其一些抽风行为,平时你可能需要用到以下技巧: 有时候变动依赖后某个工作冲突的依赖未提升到根目录...yarn link 实际上是基于 resolutions 来实现的,但经常因为要链接的仓库子孙依赖版本冲突不成功,而且成功后也常常跑起来。...参考 JavaScript 包管理器简史(npm/yarn/pnpm)https://mp.weixin.qq.com/s/0Nx093GdMcYo5Mr5VRFDjw 为什么现在我更推荐 pnpm 而不是

1.5K20

Angular 从入坑到挖坑 - Angular 使用入门

对应官方文档地址: 搭建本地开发环境和工作空间 ng new ng serve 工作区和项目文件结构 配套代码地址:angular-practice/src/getting-started 二、Contents...app.e2e-spec.ts - 针对当前应用的端到端单元测试文件 app.po.ts - 单元测试源文件 protractor.conf.js - protractor 测试工具配置文件 tsconfig.json...- 应用于当前工作空间的一些默认配置以及供 angular cli 和开发工具使用的配置信息 browserslist - 项目所针对的目标浏览器 3 karma.conf.js - 基于...package.json - 当前工作空间中所有项目会使用到的 npm 包依赖 README.md - 当前工作空间最外层根应用的简介文件 tsconfig.app.json - 当前工作空间最外层根应用的专属...typescript 配置文件 tsconfig.json - 当前工作空间中各个项目的基础 typescript 配置文件 tsconfig.spec.json - 当前工作空间最外层根应用的专属

1.9K20

Typescript的tsconfig.json

举个例子:$ tsc index3.ts --t es5 --experimentalDecorators 监控ts文件的变化可以使用tsc -w,更多指令在命令行输入tsc --help查看 tsconfig.json...默认注入的库为:针对于--target ES5:DOM,ES5,ScriptHost、针对于--target ES6:DOM,ES6,DOM.Iterable,ScriptHost allowJs 允许编译...*开头的版权信息 noEmit 生成输出文件 importHelpers 从 tslib 导入辅助工具函数(比如 __extends, __rest等) downlevelIteration 当针对“...启用所有严格类型检查选项 noImplicitAny 在表达式和声明上有隐含的 any类型时报错 strictNullChecks 在严格的 null检查模式下, null和 undefined值包含在任何类型里...解析文档目录 paths 模块名到基于 baseUrl的路径映射的列表 rootDirs 用来控制输出的目录结构 typeRoots 要包含的类型声明文件路径列表 types 要包含的类型声明文件名列表

2.1K30
领券