前端:angular工程目录结构和相关文件学习

前端工程结构,angular:

环境变量文件说明:

复制代码
// The file contents for the current environment will overwrite these during build.
// The build system defaults to the dev environment which uses `environment.ts`, but if you do
// `ng build --env=prod` then `environment.prod.ts` will be used instead.
// The list of which env maps to which file can be found in `.angular-cli.json`.

export const environment = {
  production: false,
};

angular.json文件说明

在 Angular 项目中,angular.json 文件是项目的核心配置文件,它定义了 Angular CLI 的各种构建和开发任务的行为以及项目的结构。这个文件是由 Angular CLI 在创建项目时自动生成的,主要用于配置项目的构建和运行方式。

tsconfig.json文件,为什么有多个?

1、最外层是根目录,是公用的编译设置,其它的文件会继承它

2、tsconfig.app.json是程序启动的配置

3、tsconfig.spec.json是程序使用单元测试的配置

分开可以实现关注点分离,编译优化,配置分离,易于管理。


polyfills-iui.ts

在 Angular 中,polyfills-iui.ts 文件(或类似的 polyfills 文件)用于**填充(polyfill)**现代浏览器中的某些功能,以便支持旧版浏览器或环境。这种文件通常包含一组 JavaScript 库或功能,使得那些在旧浏览器中原生不支持的功能也能够运行。

  1. 什么是 Polyfills?
    Polyfills 是一种用于"向后兼容"的代码或脚本,它能够填补现代 JavaScript 特性在旧版浏览器中的缺失。
    例如,如果项目中需要使用 Promise,但目标环境的浏览器版本不支持它,可以通过 Polyfills 提供对 Promise 的支持。
  2. polyfills-iui.ts 文件的作用
    polyfills-iui.ts 是一个自定义的 Polyfills 文件,其名称可能暗示这个文件与某个特定的功能、框架或库(如 IUI,可能是某种组件库或内部框架)相关。它的主要作用是:

加载特定的 Polyfills:

根据项目需求,添加特定的 JavaScript 填充功能。例如:

让旧浏览器支持 ES6+ 特性,如 Array.prototype.includes 或 Object.assign。

兼容 Angular 的特定依赖,如 Zone.js。

为特定框架或库优化:

如果项目使用 IUI(可能是一个 UI 库或模块),那么这个文件可能加载了一些与该库相关的 Polyfills 或初始化逻辑。

兼容性处理:

通过 polyfills-iui.ts,项目可以确保在目标运行环境(例如老旧的浏览器或特定平台)中功能正常。

例如,为了兼容 IE11 或一些旧版的移动浏览器,可能需要启用 Polyfills。

  1. 典型场景
    项目需要兼容某些旧版浏览器,如 IE11。
    项目中使用的组件库(如 IUI 或其他自定义库)依赖一些现代 JavaScript 特性。
    项目中使用了一些 Web API,但这些 API 并非所有浏览器都支持(例如 Intl、fetch 等)。

使用?

在angular.json中配置使用。

karma.conf.js

angular中用来配置单元测试的文件

相关推荐
黑心老人3 小时前
Sublime PrettyJson 快捷键
编辑器·sublime text
小阳睡不醒11 小时前
vim 练习题
linux·编辑器·vim
向宇it12 小时前
【unity游戏开发——编辑器扩展】使用EditorGUI的EditorGUILayout绘制工具类在自定义编辑器窗口绘制各种UI控件
开发语言·ui·unity·c#·编辑器·游戏引擎
和平宇宙12 小时前
vscode extention踩坑记
ide·vscode·编辑器
yinhezhanshen13 小时前
使用VSCode编辑Markdown+PlantUml
ide·vscode·编辑器
kooboo china.16 小时前
在UI 原型设计中,交互规则有哪些核心要素?
ui·编辑器·交互
慢一点会很快16 小时前
【Tools】VScode使用CMake构建项目
ide·vscode·编辑器
threelab19 小时前
05.three官方示例+编辑器+AI快速学习three.js webgl - animation - skinning - ik
人工智能·学习·编辑器
threelab19 小时前
04.three官方示例+编辑器+AI快速学习webgl_animation_skinning_additive_blending
人工智能·学习·编辑器
ONLYOFFICE19 小时前
集成 ONLYOFFICE 与 AI 插件,为您的服务带来智能文档编辑器
人工智能·ai·编辑器·onlyoffice·文档编辑器·文档预览·文档协作