Angular 组件开源架构

Common

Common 的定义是 公共，参考的 angular，所有开源组件公共的代码都放在这个项目中，包括两部分：

• ts
• sass

这部分定义了基于 typescript 的所有公共库，类似lodash，包含组件需要使用的公共的功能。目前包含以下部分：

• util
• net
• error
• global

代码最终会被编译成 js，并且包含 *.d.ts，无论是 js 还是 ts 项目都可引用。

import {
  SearchArray,
} from '@petkit/common';

Style

这部分定义了基于 sass 的公共样式。目前包含以下部分：

• animation
• icon
• support
• wechat
• mp

该部分样式针对不同平台（Web, PC,公众号,小程序等）做了兼容处理，需要在配置文件中配置，默认 750 占满屏幕宽度（类似微信小程序）。

// _theming.config.scss
@import '~@petkit/style/theming';

$app-primary: mat-palette($mat-cyan);
$app-accent: mat-palette($mat-orange);
$app-warn: mat-palette($mat-yellow, 700, 300, 900);
$app-theme: mat-light-theme($app-primary, $app-accent, $app-warn);
$app-size: size(wp);

赏

谢谢老板~(≧▽≦)/~

支付宝

微信