25 |
30 | {componentProps.__useStandardHead__ && (
31 |
39 |
40 | )
41 | }
--------------------------------------------------------------------------------
/packages/cli/src/lib/util/globalRc.ts:
--------------------------------------------------------------------------------
1 | import config from '../common/config';
2 | import * as fs from 'fs';
3 | import { logger, } from '../cli-shared-utils/lib/logger';
4 | import { IGlobalRc, } from '../common/types';
5 | import getJson from './getJson';
6 | import { isEmpty, } from 'lodash';
7 |
8 | export const getGlobalRc = (): IGlobalRc => {
9 | return getJson(config.globalRc, true, {}) as IGlobalRc;
10 | };
11 |
12 | export const setGlobalRcItem = (k: keyof IGlobalRc, v: any): void => {
13 | let rc = getGlobalRc();
14 | if (isEmpty(rc)) {
15 | rc = {
16 | h5ProExecPath: '',
17 | };
18 | }
19 | rc[k] = v;
20 |
21 | const rcStr = JSON.stringify(rc);
22 | try {
23 | fs.writeFileSync(config.globalRc, rcStr, {
24 | encoding: 'utf-8',
25 | });
26 | } catch(e) {
27 | logger.error('set global rc fail', e.message);
28 | }
29 | };
30 |
31 | export const setGlobalRc = (opts: IGlobalRc): void => {
32 | const rcStr = JSON.stringify({
33 | ...getGlobalRc(),
34 | ...opts,
35 | });
36 | try {
37 | fs.writeFileSync(config.globalRc, rcStr, {
38 | encoding: 'utf-8',
39 | });
40 | } catch(e) {
41 | logger.error('set global rc fail', e.message);
42 | }
43 | };
--------------------------------------------------------------------------------
/packages/cli/h5bundle/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "h5bundle",
3 | "version": "0.1.0",
4 | "private": true,
5 | "dependencies": {
6 | "@testing-library/jest-dom": "^5.11.4",
7 | "@testing-library/react": "^11.1.0",
8 | "@testing-library/user-event": "^12.1.10",
9 | "@types/jest": "^26.0.15",
10 | "@types/node": "^12.0.0",
11 | "@types/react": "^17.0.0",
12 | "@types/react-dom": "^17.0.0",
13 | "classnames": "^2.3.1",
14 | "query-string": "^7.0.0",
15 | "react": "^17.0.2",
16 | "react-dom": "^17.0.2",
17 | "react-scripts": "4.0.3",
18 | "typescript": "^4.1.2",
19 | "web-vitals": "^1.0.1"
20 | },
21 | "scripts": {
22 | "start": "react-scripts start",
23 | "build": "react-scripts build",
24 | "test": "react-scripts test",
25 | "eject": "react-scripts eject"
26 | },
27 | "eslintConfig": {
28 | "extends": [
29 | "react-app",
30 | "react-app/jest"
31 | ]
32 | },
33 | "browserslist": {
34 | "production": [
35 | ">0.2%",
36 | "not dead",
37 | "not op_mini all"
38 | ],
39 | "development": [
40 | "last 1 chrome version",
41 | "last 1 firefox version",
42 | "last 1 safari version"
43 | ]
44 | }
45 | }
46 |
--------------------------------------------------------------------------------
/packages/generator/src/utils/logger.ts:
--------------------------------------------------------------------------------
1 | import chalk from 'chalk';
2 | import stripAnsi from 'strip-ansi';
3 |
4 | const format = (label: string, msg: string) => {
5 | return msg.split('\n').map((line, i) => {
6 | return i === 0
7 | ? `${label} ${line}`
8 | : line.padStart(stripAnsi(label).length);
9 | }).join('\n');
10 | };
11 |
12 | export const debug = (msg: string) => {
13 | const txt = format(chalk.bgBlue.black(' DEBUG '), msg);
14 | return process.env.DEBUG && console.log(txt);
15 | };
16 |
17 | export const info = (msg: string, pure?: boolean): string | void => {
18 | const txt = format(chalk.bgBlue.black(' INFO '), msg);
19 | return pure ? txt : console.log(pure);
20 | };
21 |
22 | export const done = (msg: string, pure?: boolean): string | void => {
23 | const txt = format(chalk.bgGreen.black(' DONE '), msg);
24 | return pure ? txt : console.log(pure);
25 | };
26 |
27 | export const warn = (msg: string, pure?: boolean): string | void => {
28 | const txt = format(chalk.bgYellow.black(' WARN '), msg);
29 | return pure ? txt : console.warn(pure);
30 | };
31 |
32 | export const error = (msg: string, pure?: boolean): string | void => {
33 | const txt = format(chalk.bgRed(' ERROR '), msg);
34 | return pure ? txt : console.error(pure);
35 | };
--------------------------------------------------------------------------------
/packages/cli/src/commands/lint/index.ts:
--------------------------------------------------------------------------------
1 | import CommandWrapper from '../../scheduler/command/commandWrapper';
2 | import { ECommandName, } from '../../lib/common/types';
3 | import lint from '../../actions/lint';
4 | import commmandsConfig from '../commandsConfig';
5 | import config from '../../lib/common/config';
6 |
7 | interface ICommandOptions {
8 | }
9 |
10 | /**
11 | * 不直接支持存量项目，但会引导支持，比如如何创建ding.config.json
12 | *
13 | * 校验逻辑：
14 | * 工作台组件
15 | * - 有miniAppId和token，拉取rc和权限点来校验
16 | * - 无miniAppId或token，用通用rc来校验，参考dingtalk-worktab-plugin-script中的defaultRc
17 | *
18 | * 小程序/h5
19 | * - 存量项目，跑eslint
20 | * - 增量项目，执行 `npm run lint` / `npm run test`
21 | */
22 | export default CommandWrapper5 | 6 | 详情请查看：[DingTalk Design CLI操作指南](https://open.dingtalk.com/document/resourcedownload/introduction) 7 | 8 | ## 安装 9 |
10 | 11 | > DingTalk Design CLI需要Nodejs版本不小于12.15.x. 你可以通过 [n](https://github.com/tj/n), [nvm](https://github.com/creationix/nvm) or [nvm-windows](https://github.com/coreybutler/nvm-windows)来管理本地多个Nodejs版本. 12 | 13 | 可以通过以下命令来安装 DingTalk Design CLI 14 | 15 | ```bash 16 | npm install dingtalk-design-cli -g 17 | 18 | # OR 19 | 20 | yarn global add dingtalk-design-cli 21 | ``` 22 | 安装后，你可以通过`ding`命令来使用 DingTalk Design CLI 的功能。 23 | 通过以下命令检测 DingTalk Design CLI 已经成功安装: 24 | ```bash 25 | ding -v 26 | ``` 27 | 28 | 通过以下命令查阅`ding`命令支持的功能： 29 | ```bash 30 | ding -h 31 | ``` 32 | 33 | ### 更新 34 | 如果你之前已经安装过 DingTalk Design CLI，可以通过以下命令进行升级: 35 | ```bash 36 | npm update -g dingtalk-design-cli 37 | 38 | # OR 39 | yarn global upgrade --latest dingtalk-design-cli 40 | ``` 41 | ## 快速入门 42 |
43 | 44 | 首先，通过以下命令初始化一个本地项目: 45 | ```bash 46 | ding init -o mpTest 47 | ``` 48 | 49 | 1. 以小程序为例，选择应用类型为`小程序`: 50 |  51 | 52 | 53 | 2. 然后选择一个小程序模板`default`: 54 |  55 | 56 | 57 | 3. 最后选择开发语言为`javascript`: 58 |  59 | 60 | 61 | 4. 到这里，你已经完成了所有初始化步骤，已经初始化了一个项目到`mpTest`目录下了 62 |  63 | 64 | 65 | 5. 最后，进入`mpTest`项目目录，并执行`ding dev`就可以开启调试了 66 |  67 | 68 | 69 | ## License 70 | 71 | [MIT](https://github.com/open-dingtalk/dingtalk-design-cli/blob/develop/LICENSE) 72 | -------------------------------------------------------------------------------- /packages/cli/src/actions/lint.ts: -------------------------------------------------------------------------------- 1 | import { EAppType, ICommandContext, } from '../lib/common/types'; 2 | import eslint from 'eslint'; 3 | import pluginEl from 'dingtalk-worktab-plugin-script'; 4 | import { logWithSpinner, stopSpinner, } from '../lib/cli-shared-utils/lib/spinner'; 5 | import getValidateRc from '../lib/util/getValidateRc'; 6 | import { spawnSync, } from 'child_process'; 7 | 8 | 9 | export default async (commandContext: ICommandContext): Promise
68 |
87 | )
88 | }
--------------------------------------------------------------------------------
/packages/cli/src/lib/cli-shared-utils/lib/logger/index.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Module dependencies
3 | */
4 | import chalk, { Color, Modifiers, } from 'chalk';
5 | import { LoggerBase, } from './base';
6 | import { ELoggerLevel, ILoggerElement, } from './types';
7 |
8 | /**
9 | * Expose Logger
10 | */
11 | export class Logger extends LoggerBase {
12 | // level: 1
13 | error(...args: ILoggerElement[]) {
14 | this.useLogLevel(ELoggerLevel.error, () => {
15 | process.exitCode = process.exitCode || 1;
16 | console.error(chalk.red('error'), ...args);
17 | });
18 | }
19 |
20 | // level: 2
21 | warn(...args: ILoggerElement[]) {
22 | this.useLogLevel(ELoggerLevel.warn, () => {
23 | console.warn(chalk.yellow('warning'), ...args);
24 | });
25 | }
26 |
27 | // level: 3
28 | success(...args: ILoggerElement[]) {
29 | this.useLogLevel(ELoggerLevel.info, () => {
30 | this.status('green', 'success', ...args);
31 | });
32 | }
33 |
34 | // level: 3
35 | tip(...args: ILoggerElement[]) {
36 | this.useLogLevel(ELoggerLevel.info, () => {
37 | this.status('blue', 'tip', ...args);
38 | });
39 | }
40 |
41 | // level: 3
42 | info(...args: ILoggerElement[]) {
43 | this.useLogLevel(ELoggerLevel.info, () => {
44 | this.status('gray', '', ...args);
45 | });
46 | }
47 |
48 | // level: 3
49 | log(...args: ILoggerElement[]) {
50 | this.useLogLevel(ELoggerLevel.info, () => {
51 | this.status('gray', '', ...args);
52 | });
53 | }
54 |
55 | status(
56 | color: typeof Color | typeof Modifiers,
57 | label: string, ...args: ILoggerElement[]
58 | ) {
59 | if (this.options.logLevel && this.options.logLevel >= ELoggerLevel.debug) {
60 | this._statuslog(color, label, ...(this.getLogArgsWithPrefix(args)));
61 | } else {
62 | this._statuslog(color, label, ...args);
63 | }
64 | }
65 |
66 | _statuslog(
67 | color: typeof Color | typeof Modifiers,
68 | label: string, ...args: ILoggerElement[]
69 | ) {
70 | if (label) {
71 | console.log(chalk[color](label), ...args);
72 | } else {
73 | console.log(...args);
74 | }
75 | }
76 |
77 | // level: 4
78 | public debug(...args: ILoggerElement[]) {
79 | this.useLogLevel(ELoggerLevel.debug, () => {
80 | this.status('magenta', 'debug', ...args);
81 | });
82 | }
83 | }
84 |
85 | const cachedLogger = new Map
69 | {titleBarModel.icon && 
}
70 |
77 | {titleBarModel.title}
73 | {titleBarModel.subLabel && {titleBarModel.subLabel}
}
74 | {titleBarModel.showArrow && }
75 | {componentProps.promotionState === PROMOTION_STATE_TRYOUT && 示例
}
76 |
78 | {titleBarModel.manage && (
79 |
86 |
80 |
83 |
84 | )}
85 |