@bams-app/work-cli 0.1.0 → 0.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +30 -58
- package/bin/work-cli.js +7 -7
- package/commands/add.js +7 -7
- package/commands/build.js +2 -2
- package/commands/create.js +3 -3
- package/commands/dev.js +4 -4
- package/commands/umd.js +3 -3
- package/package.json +8 -8
- package/templates/project/README.md +38 -151
- package/templates/project/package.json +2 -2
package/README.md
CHANGED
|
@@ -10,7 +10,7 @@ BAMS-Work 全局脚手架工具(类似 vue-cli 模式),提供**项目初
|
|
|
10
10
|
|
|
11
11
|
| 能力 | 来源包 |
|
|
12
12
|
| ------------- | -------------------------------------------------------------------------------------------------------------------------------------- |
|
|
13
|
-
| 项目/组件创建 | `@bams-app/create-ui-component`、`@bams-app/create-ui-page`、`@bams-app/create-ui-base
|
|
13
|
+
| 项目/组件创建 | `@bams-app/create-ui-component`、`@bams-app/create-ui-page`、`@bams-app/create-ui-base`(模板内置于各包 `templates/`) |
|
|
14
14
|
| 开发服务 | `@bams-app/ui-dev-server`(由模板写入用户项目 `devDependencies`,`npm run dev:ui <环境标识>` 本地启动;环境标识由第 1 个位置参数传入) |
|
|
15
15
|
| 环境变量加载 | `@bams-app/shared-env`(同上;其 `lib/env-loader` 被 ui-dev-server 复用于解析环境标识) |
|
|
16
16
|
| 环境配置创建 | `@bams-app/create-env`(交互式生成 `.envs/.env.dev-<alias>`) |
|
|
@@ -18,10 +18,10 @@ BAMS-Work 全局脚手架工具(类似 vue-cli 模式),提供**项目初
|
|
|
18
18
|
| 批量页面创建 | `@bams-app/create-pages-from-components`(批量将 ui-_ 转为 page-_,复用 create-ui-page) |
|
|
19
19
|
| 公共配置 | `@bams-app/configs`(app-config.json、可配置组件插槽默认值,被 ui-dev-server 与 store 依赖) |
|
|
20
20
|
|
|
21
|
-
- `create` 生成 **scope
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
21
|
+
- `create` 生成 **scope 目录模式**项目:业务组件按 scope 目录存放(`energy-ui/ui-xxx`);
|
|
22
|
+
项目根 `package.json` 声明 `demo-ui/*`、`bams-components/*`、`*-ui/*`、`apex-web/*`、`bams-ui`
|
|
23
|
+
这些目录范围,用于兼容用户克隆进项目的既有组件包目录(目录不存在时不影响安装,
|
|
24
|
+
`create` 也不会默认创建它们)。
|
|
25
25
|
- 项目根 `package.json` 的 `devDependencies` **只声明 `@bams-app/ui-dev-server` 一个**:
|
|
26
26
|
能力包(`@bams-app/*`)与运行时依赖(vue、ant-design-vue、devextreme 等)的清单只在
|
|
27
27
|
ui-dev-server 的 `dependencies` 维护**一处**,安装后提升到项目根 `node_modules`,
|
|
@@ -37,7 +37,7 @@ BAMS-Work 全局脚手架工具(类似 vue-cli 模式),提供**项目初
|
|
|
37
37
|
flowchart LR
|
|
38
38
|
subgraph WORK["work 仓库(全部可发布包)"]
|
|
39
39
|
A["能力包<br/>packages/ · ui/ · configs/"]
|
|
40
|
-
B["开发工具与模板<br/>tooling/
|
|
40
|
+
B["开发工具与模板<br/>tooling/"]
|
|
41
41
|
end
|
|
42
42
|
subgraph REG["私有 registry<br/>npm.hedpy.cn"]
|
|
43
43
|
C["@bams-app/*"]
|
|
@@ -45,7 +45,7 @@ flowchart LR
|
|
|
45
45
|
subgraph CLI["@bams-app/work-cli(全局 CLI)"]
|
|
46
46
|
D["create / add / env<br/>pages-entry / pages-from-components"]
|
|
47
47
|
end
|
|
48
|
-
subgraph PROJ["
|
|
48
|
+
subgraph PROJ["用户项目"]
|
|
49
49
|
E["package.json<br/>devDependencies:仅 ui-dev-server"]
|
|
50
50
|
F["npm install<br/>依赖自动安装"]
|
|
51
51
|
G["npm run dev:ui 环境标识<br/>本地 ui-dev-server"]
|
|
@@ -60,8 +60,8 @@ flowchart LR
|
|
|
60
60
|
```
|
|
61
61
|
|
|
62
62
|
```
|
|
63
|
-
用户项目(
|
|
64
|
-
├── package.json #
|
|
63
|
+
用户项目(scope 目录模式)
|
|
64
|
+
├── package.json # 项目根配置
|
|
65
65
|
├── .bams-work/ # BAMS-Work 项目标记目录(勿删除)
|
|
66
66
|
├── .envs/.env.dev-<env> # 环境变量
|
|
67
67
|
├── .proxy.js # 自定义代理(可选)
|
|
@@ -80,8 +80,8 @@ npm i -g @bams-app/work-cli
|
|
|
80
80
|
## 使用
|
|
81
81
|
|
|
82
82
|
```bash
|
|
83
|
-
#
|
|
84
|
-
|
|
83
|
+
# 初始化项目模版
|
|
84
|
+
work create my-bams-project
|
|
85
85
|
cd my-bams-project
|
|
86
86
|
npm install
|
|
87
87
|
|
|
@@ -90,17 +90,17 @@ npm run dev:ui demo # 加载 .envs/.env.dev-demo + 组件 ui-
|
|
|
90
90
|
npm run dev:ui demo ui-order-list # 指定组件(`-c ui-order-list` 等价)
|
|
91
91
|
|
|
92
92
|
# 在 scope 目录下创建新组件
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
93
|
+
work add --dir energy-ui --name ui-order-list
|
|
94
|
+
work add --dir energy-ui --name page-order-list --type page
|
|
95
|
+
work add --dir demo-ui --name ui-base-btn --type base
|
|
96
96
|
```
|
|
97
97
|
|
|
98
98
|
### 命令一览
|
|
99
99
|
|
|
100
100
|
| 命令 | 说明 |
|
|
101
101
|
| -------------------------------------------------- | --------------------------------------------------------------------- |
|
|
102
|
-
| `create <name>` |
|
|
103
|
-
| `add --dir <scope> --name <name>` | 在 scope 目录下创建组件(component/page/base),并注册
|
|
102
|
+
| `create <name>` | 初始化项目模版(含示例组件与 `.bams-work/` 标记) |
|
|
103
|
+
| `add --dir <scope> --name <name>` | 在 scope 目录下创建组件(component/page/base),并注册 scope 目录 |
|
|
104
104
|
| `env` | 交互式创建开发环境配置 `.envs/.env.dev-<alias>`(复用 create-env) |
|
|
105
105
|
| `pages-entry --dir <dir> --type <page\|component>` | 扫描 page-_/ui-_ 目录生成 webpack 动态入口(复用 create-pages-entry) |
|
|
106
106
|
| `pages-from-components --dir <dir>` | 批量将 ui-_ 组件转为 page-_ 页面(复用 create-pages-from-components) |
|
|
@@ -126,7 +126,7 @@ bams-work add --dir demo-ui --name ui-base-btn --type base
|
|
|
126
126
|
|
|
127
127
|
所有 work 包统一发布到 npm registry,**默认官方 npm(registry.npmjs.org)**,通过环境变量
|
|
128
128
|
`NPM_REGISTRY` 可随时切换到私有 registry(如 `https://npm.hedpy.cn/`)。work 下所有含
|
|
129
|
-
`package.json` 的目录(`packages/`、`ui/`、`tooling/`、`
|
|
129
|
+
`package.json` 的目录(`packages/`、`ui/`、`tooling/`、`cli/`、`configs/` 等)
|
|
130
130
|
都会被打包发布,`private` 包自动跳过:
|
|
131
131
|
|
|
132
132
|
```bash
|
|
@@ -155,60 +155,32 @@ cd work/configs && npm publish --registry=https://registry.npmjs.org/
|
|
|
155
155
|
单包发布只影响该包,其他包版本号不变;需要整体提升版本时使用 `yarn publish-all`。
|
|
156
156
|
发布官方 npm 时 `@bams-app` scope 会随首个 scoped 包自动创建,无需预先注册。
|
|
157
157
|
|
|
158
|
-
`work-cli` 与 `create` 生成的项目均以 `"*"` 声明 `@bams-app/ui-dev-server
|
|
159
|
-
|
|
158
|
+
`work-cli` 与 `create` 生成的项目均以 `"*"` 声明 `@bams-app/ui-dev-server`:仓库内直接链接到
|
|
159
|
+
本地包,发布后自动解析为 registry 上最新的已发布版本,无需手动改版本号。
|
|
160
|
+
用户项目升级时使用 `npm i @bams-app/ui-dev-server@latest`,该命令会把声明改写为 `^x.y.z`。
|
|
160
161
|
|
|
161
162
|
## 用户项目升级
|
|
162
163
|
|
|
163
|
-
|
|
164
|
-
|
|
164
|
+
用户项目只声明 `@bams-app/ui-dev-server` 一个依赖,能力包与运行时依赖全部作为它的传递依赖解析到
|
|
165
|
+
同一份包,提升到项目根 `node_modules`。
|
|
165
166
|
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
能力包在 ui-dev-server 里声明为 `"*"`,运行时依赖是普通版本范围,而项目
|
|
169
|
-
`package-lock.json` 已把它们逐个钉死在具体版本、且仍满足声明范围,npm 便不再重新解析:
|
|
170
|
-
`npm install` 与 `npm update @bams-app/ui-dev-server` 都不会动它们;裸 `npm update` 虽能带上,
|
|
171
|
-
但会重解析整棵依赖树、顺带升级其它第三方依赖。所以只能清掉它们在 lockfile 里的记录,
|
|
172
|
-
让 npm 重新解析。
|
|
173
|
-
|
|
174
|
-
### 升级步骤
|
|
167
|
+
ui-dev-server 对能力包声明的是显式版本范围(`^x.y.z`),范围随 ui-dev-server 每次发布同步更新,
|
|
168
|
+
因此升级就是一条命令:
|
|
175
169
|
|
|
176
170
|
```bash
|
|
177
|
-
|
|
178
|
-
node -e "
|
|
179
|
-
const fs = require('fs');
|
|
180
|
-
const dev = JSON.parse(fs.readFileSync('node_modules/@bams-app/ui-dev-server/package.json', 'utf8'));
|
|
181
|
-
const names = new Set([...Object.keys(dev.dependencies || {}), '@bams-app/ui-dev-server']);
|
|
182
|
-
const lock = JSON.parse(fs.readFileSync('package-lock.json', 'utf8'));
|
|
183
|
-
let removed = 0;
|
|
184
|
-
for (const section of ['packages', 'dependencies']) {
|
|
185
|
-
const container = lock[section];
|
|
186
|
-
if (!container) continue;
|
|
187
|
-
for (const key of Object.keys(container)) {
|
|
188
|
-
const name = key.replace(/^.*node_modules\//, '');
|
|
189
|
-
if (names.has(name)) { delete container[key]; removed++; }
|
|
190
|
-
}
|
|
191
|
-
}
|
|
192
|
-
fs.writeFileSync('package-lock.json', JSON.stringify(lock, null, 2) + '\n');
|
|
193
|
-
console.log('已清理', removed, '条由 ui-dev-server 提供的依赖记录');
|
|
194
|
-
"
|
|
195
|
-
|
|
196
|
-
# 2. 这些包按 ui-dev-server 声明的版本重新解析,其余依赖保持锁定不动
|
|
197
|
-
npm install
|
|
171
|
+
npm i @bams-app/ui-dev-server@latest
|
|
198
172
|
```
|
|
199
173
|
|
|
200
|
-
|
|
201
|
-
|
|
174
|
+
新版本的依赖范围与 `package-lock.json` 中钉住的旧版本不再匹配,npm 会自动重新解析整套能力包,
|
|
175
|
+
无需手工清理 lockfile(历史版本遗留的 `*` 范围才需要旧办法,见 git 历史)。
|
|
202
176
|
|
|
203
|
-
|
|
204
|
-
跨大版本(0.1 → 0.2)先改 `package.json` 为 `"^0.2.0"`,再执行上面的两步。
|
|
177
|
+
跨大版本(0.1 → 0.2)同理,直接执行上面的命令即可。
|
|
205
178
|
|
|
206
179
|
### 前提
|
|
207
180
|
|
|
208
|
-
-
|
|
181
|
+
- 升级前确保对应版本已发布:能力包与 ui-dev-server 由 `yarn publish-all` 同批次发布。
|
|
209
182
|
- registry 指向:`create` 不生成项目 `.npmrc`,`@bams-app/*` 默认走官方 npm
|
|
210
|
-
|
|
211
|
-
`@bams-app:registry=https://npm.hedpy.cn/`(私服若存在同名旧版本,会遮蔽官方新版)。
|
|
183
|
+
(切私服需在执行 `create` 时指定 registry)。
|
|
212
184
|
|
|
213
185
|
## 环境要求
|
|
214
186
|
|
package/bin/work-cli.js
CHANGED
|
@@ -7,7 +7,7 @@ const { colorize } = require('../lib/utils');
|
|
|
7
7
|
const pkg = require('../package.json');
|
|
8
8
|
|
|
9
9
|
const COMMANDS = {
|
|
10
|
-
create: '
|
|
10
|
+
create: '初始化项目模版',
|
|
11
11
|
add: '在 scope 目录下创建组件(component/page/base)',
|
|
12
12
|
env: '创建开发环境配置(.envs/.env.dev-<alias>)',
|
|
13
13
|
'pages-entry': '扫描 page-*/ui-* 目录生成 webpack 动态入口',
|
|
@@ -24,7 +24,7 @@ function printUsage() {
|
|
|
24
24
|
console.log(colorize('复用 work 已发布的包(create-env / create-ui-*)', 'gray'));
|
|
25
25
|
console.log('');
|
|
26
26
|
console.log(colorize('用法:', 'bold'));
|
|
27
|
-
console.log('
|
|
27
|
+
console.log(' work <command> [options]');
|
|
28
28
|
console.log('');
|
|
29
29
|
console.log(colorize('命令:', 'bold'));
|
|
30
30
|
Object.entries(COMMANDS).forEach(([name, desc]) => {
|
|
@@ -32,11 +32,11 @@ function printUsage() {
|
|
|
32
32
|
});
|
|
33
33
|
console.log('');
|
|
34
34
|
console.log(colorize('示例:', 'bold'));
|
|
35
|
-
console.log('
|
|
36
|
-
console.log('
|
|
37
|
-
console.log('
|
|
38
|
-
console.log('
|
|
39
|
-
console.log('
|
|
35
|
+
console.log(' work create my-bams-project # 初始化项目');
|
|
36
|
+
console.log(' work add --dir energy-ui --name ui-order-list');
|
|
37
|
+
console.log(' work env # 创建开发环境配置(交互式)');
|
|
38
|
+
console.log(' work pages-entry --dir energy-ui --type page');
|
|
39
|
+
console.log(' work pages-from-components --dir energy-ui');
|
|
40
40
|
console.log('');
|
|
41
41
|
console.log(colorize('开发调试:', 'bold'));
|
|
42
42
|
console.log(' 在项目根目录执行 npm run dev:ui <环境标识>(由项目本地 ui-dev-server 启动并加载 .envs/ 环境文件)');
|
package/commands/add.js
CHANGED
|
@@ -4,7 +4,7 @@ const { spawn } = require('child_process');
|
|
|
4
4
|
const { findProjectRoot, toKebabCase, error, success, info } = require('../lib/utils');
|
|
5
5
|
|
|
6
6
|
/**
|
|
7
|
-
* 用法:
|
|
7
|
+
* 用法: work add --dir <scope> --name <name> [--type component|page|base]
|
|
8
8
|
* [--template <tpl>] [--use-component <name>] [--desc <text>]
|
|
9
9
|
*/
|
|
10
10
|
function parseArgs(args) {
|
|
@@ -41,7 +41,7 @@ function ensureWorkspaceScope(projectRoot, scopeDir) {
|
|
|
41
41
|
workspaces.push(pattern);
|
|
42
42
|
pkg.workspaces = workspaces;
|
|
43
43
|
fs.writeFileSync(pkgPath, JSON.stringify(pkg, null, 2) + '\n', 'utf8');
|
|
44
|
-
info(`已注册
|
|
44
|
+
info(`已注册 scope 目录: ${pattern}`);
|
|
45
45
|
}
|
|
46
46
|
}
|
|
47
47
|
|
|
@@ -77,9 +77,9 @@ async function main(args) {
|
|
|
77
77
|
const params = parseArgs(args);
|
|
78
78
|
|
|
79
79
|
if (!params.name) {
|
|
80
|
-
error('用法:
|
|
81
|
-
error('示例:
|
|
82
|
-
error('
|
|
80
|
+
error('用法: work add --dir <scope> --name <name> [--type component|page|base]');
|
|
81
|
+
error('示例: work add --dir energy-ui --name ui-order-list');
|
|
82
|
+
error(' work add --dir energy-ui --name page-order-list --type page');
|
|
83
83
|
process.exit(1);
|
|
84
84
|
}
|
|
85
85
|
|
|
@@ -90,7 +90,7 @@ async function main(args) {
|
|
|
90
90
|
|
|
91
91
|
const projectRoot = findProjectRoot(process.cwd());
|
|
92
92
|
if (!projectRoot) {
|
|
93
|
-
error('未找到 BAMS-Work 项目(缺少 .bams-work 目录),请先执行
|
|
93
|
+
error('未找到 BAMS-Work 项目(缺少 .bams-work 目录),请先执行 work create <name>');
|
|
94
94
|
process.exit(1);
|
|
95
95
|
}
|
|
96
96
|
|
|
@@ -133,7 +133,7 @@ async function main(args) {
|
|
|
133
133
|
success(`组件创建成功: ${toKebabCase(params.name)}(scope: ${scopeDir})`);
|
|
134
134
|
info(`开发: npm run dev:ui <环境标识> -c ${toKebabCase(params.name)}`);
|
|
135
135
|
// UMD 命令暂时下线,恢复后取消注释
|
|
136
|
-
// info(`UMD:
|
|
136
|
+
// info(`UMD: work umd ${toKebabCase(params.name)}`);
|
|
137
137
|
}
|
|
138
138
|
|
|
139
139
|
module.exports = main;
|
package/commands/build.js
CHANGED
|
@@ -3,13 +3,13 @@ const path = require('path');
|
|
|
3
3
|
const { findProjectRoot, error, info, run } = require('../lib/utils');
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
|
-
* 用法:
|
|
6
|
+
* 用法: work build [component] [-- <vue-cli args>]
|
|
7
7
|
* 委托 @bams-app/ui-dev-server/bin/build-app.js 构建宿主应用(production)
|
|
8
8
|
*/
|
|
9
9
|
async function main(args) {
|
|
10
10
|
const projectRoot = findProjectRoot(process.cwd());
|
|
11
11
|
if (!projectRoot) {
|
|
12
|
-
error('未找到 BAMS-Work 项目(缺少 .bams-work 目录),请先执行
|
|
12
|
+
error('未找到 BAMS-Work 项目(缺少 .bams-work 目录),请先执行 work create <name>');
|
|
13
13
|
process.exit(1);
|
|
14
14
|
}
|
|
15
15
|
|
package/commands/create.js
CHANGED
|
@@ -43,7 +43,7 @@ async function main(args) {
|
|
|
43
43
|
const projectNameArg = args.find((a) => !a.startsWith('-'));
|
|
44
44
|
|
|
45
45
|
if (!projectNameArg) {
|
|
46
|
-
error('用法:
|
|
46
|
+
error('用法: work create <project-name> [--force]');
|
|
47
47
|
process.exit(1);
|
|
48
48
|
}
|
|
49
49
|
|
|
@@ -116,9 +116,9 @@ async function main(args) {
|
|
|
116
116
|
log(' npm run dev:ui demo ui-component-demo # 指定组件(换环境改第 1 个参数)');
|
|
117
117
|
log('');
|
|
118
118
|
log('创建新组件:');
|
|
119
|
-
log('
|
|
119
|
+
log(' work add --dir energy-ui --name ui-order-list');
|
|
120
120
|
log('');
|
|
121
|
-
log('更多命令:
|
|
121
|
+
log('更多命令:work --help');
|
|
122
122
|
log('');
|
|
123
123
|
}
|
|
124
124
|
|
package/commands/dev.js
CHANGED
|
@@ -3,7 +3,7 @@ const path = require('path');
|
|
|
3
3
|
const { findProjectRoot, error, info, run } = require('../lib/utils');
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
|
-
* 用法:
|
|
6
|
+
* 用法: work dev <env> [component] [--layout pc|touch] [-- <vue-cli args>]
|
|
7
7
|
* 委托 @bams-app/shared-env 加载环境变量,并启动 @bams-app/ui-dev-server 开发服务
|
|
8
8
|
*
|
|
9
9
|
* 已暂时下线(入口 COMMANDS 与 DISABLED_COMMANDS 见 bin/work-cli.js):
|
|
@@ -13,7 +13,7 @@ const { findProjectRoot, error, info, run } = require('../lib/utils');
|
|
|
13
13
|
async function main(args) {
|
|
14
14
|
const projectRoot = findProjectRoot(process.cwd());
|
|
15
15
|
if (!projectRoot) {
|
|
16
|
-
error('未找到 BAMS-Work 项目(缺少 .bams-work 目录),请先执行
|
|
16
|
+
error('未找到 BAMS-Work 项目(缺少 .bams-work 目录),请先执行 work create <name>');
|
|
17
17
|
process.exit(1);
|
|
18
18
|
}
|
|
19
19
|
|
|
@@ -49,8 +49,8 @@ async function main(args) {
|
|
|
49
49
|
}
|
|
50
50
|
|
|
51
51
|
if (!envAlias) {
|
|
52
|
-
error('用法:
|
|
53
|
-
error('示例:
|
|
52
|
+
error('用法: work dev <env> [component] [--layout pc|touch]');
|
|
53
|
+
error('示例: work dev demo ui-component-demo');
|
|
54
54
|
process.exit(1);
|
|
55
55
|
}
|
|
56
56
|
|
package/commands/umd.js
CHANGED
|
@@ -3,7 +3,7 @@ const path = require('path');
|
|
|
3
3
|
const { findProjectRoot, toCamelCase, exists, isDirectory, readJson, error, info, run } = require('../lib/utils');
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
|
-
* 用法:
|
|
6
|
+
* 用法: work umd [component] [--out <dir>] [--name <name>] [--entry <file>]
|
|
7
7
|
* component 缺省时自动收集 workspaces 下所有组件
|
|
8
8
|
* 委托 @bams-app/ui-dev-server/bin/build-umd.js 构建组件 UMD 产物
|
|
9
9
|
*/
|
|
@@ -110,7 +110,7 @@ function generateEntryFile({ projectRoot, components }) {
|
|
|
110
110
|
async function main(args) {
|
|
111
111
|
const projectRoot = findProjectRoot(process.cwd());
|
|
112
112
|
if (!projectRoot) {
|
|
113
|
-
error('未找到 BAMS-Work 项目(缺少 .bams-work 目录),请先执行
|
|
113
|
+
error('未找到 BAMS-Work 项目(缺少 .bams-work 目录),请先执行 work create <name>');
|
|
114
114
|
process.exit(1);
|
|
115
115
|
}
|
|
116
116
|
|
|
@@ -125,7 +125,7 @@ async function main(args) {
|
|
|
125
125
|
}
|
|
126
126
|
|
|
127
127
|
if (components.length === 0) {
|
|
128
|
-
error('未找到任何组件(
|
|
128
|
+
error('未找到任何组件(scope 目录下需存在 ui-* / page-* 目录),请先执行 work add --dir <scope> --name ui-xxx');
|
|
129
129
|
process.exit(1);
|
|
130
130
|
}
|
|
131
131
|
|
package/package.json
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bams-app/work-cli",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.3",
|
|
4
4
|
"description": "BAMS-Work 全局开发工具:复用 work 已发布的包(create-env / create-ui-*)提供项目初始化、组件创建与环境配置能力,开发调试由用户项目本地的 ui-dev-server 承担",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"bin": {
|
|
7
|
-
"
|
|
7
|
+
"work": "./bin/work-cli.js"
|
|
8
8
|
},
|
|
9
9
|
"files": [
|
|
10
10
|
"bin",
|
|
@@ -13,12 +13,12 @@
|
|
|
13
13
|
"templates"
|
|
14
14
|
],
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@bams-app/create-env": "
|
|
17
|
-
"@bams-app/create-pages-entry": "
|
|
18
|
-
"@bams-app/create-pages-from-components": "
|
|
19
|
-
"@bams-app/create-ui-base": "
|
|
20
|
-
"@bams-app/create-ui-component": "
|
|
21
|
-
"@bams-app/create-ui-page": "
|
|
16
|
+
"@bams-app/create-env": "^0.1.3",
|
|
17
|
+
"@bams-app/create-pages-entry": "^0.1.3",
|
|
18
|
+
"@bams-app/create-pages-from-components": "^0.1.3",
|
|
19
|
+
"@bams-app/create-ui-base": "^0.1.3",
|
|
20
|
+
"@bams-app/create-ui-component": "^0.1.3",
|
|
21
|
+
"@bams-app/create-ui-page": "^0.1.3"
|
|
22
22
|
},
|
|
23
23
|
"engines": {
|
|
24
24
|
"node": ">=16.7.0"
|
|
@@ -1,182 +1,69 @@
|
|
|
1
|
-
# BAMS-Work
|
|
1
|
+
# BAMS-Work 组件开发项目
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
由 `@bams-app/work-cli` 初始化,组件按 scope 目录组织。
|
|
4
4
|
|
|
5
|
-
##
|
|
5
|
+
## 目录
|
|
6
6
|
|
|
7
7
|
```
|
|
8
|
-
.
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
│ └── ui-component-demo # 示例组件
|
|
15
|
-
└── <scope>-ui/ # 其他业务 scope 目录(如 energy-ui/,add 时创建)
|
|
16
|
-
└── ui-xxx
|
|
8
|
+
package.json # 项目根配置
|
|
9
|
+
.bams-work/ # 项目标记目录,勿删
|
|
10
|
+
.envs/ # 环境配置 .env.dev-<env>
|
|
11
|
+
.proxy.js # 自定义代理(可选)
|
|
12
|
+
demo-ui/ui-component-demo # 示例组件
|
|
13
|
+
<scope>-ui/ui-xxx # 业务组件(add 时创建)
|
|
17
14
|
```
|
|
18
15
|
|
|
19
|
-
##
|
|
16
|
+
## 前置条件(必需)
|
|
20
17
|
|
|
21
|
-
|
|
22
|
-
npm install # 安装依赖到根 node_modules(含项目本地的 ui-dev-server)
|
|
23
|
-
npm run dev:ui demo # 启动开发环境(环境标识 demo → .envs/.env.dev-demo,示例端口 8700)
|
|
24
|
-
```
|
|
25
|
-
|
|
26
|
-
> 开发调试由**项目本地**的 `@bams-app/ui-dev-server` 启动(`npm run dev:ui <环境标识>`),
|
|
27
|
-
> 环境标识作为位置参数传入(`demo` → `.envs/.env.dev-demo`)。
|
|
28
|
-
> 其余 `bams-work` 命令都在**项目根目录**(含 `.bams-work/` 的目录)执行。
|
|
29
|
-
> 全局帮助 `bams-work --help`,版本 `bams-work --version`。
|
|
30
|
-
|
|
31
|
-
## 命令一览
|
|
32
|
-
|
|
33
|
-
| 命令 | 作用 |
|
|
34
|
-
| ---------------------------------------------------- | --------------------------- |
|
|
35
|
-
| `npm run dev:ui <环境标识>` | 启动开发服务(最常用) |
|
|
36
|
-
| `add --dir <scope> --name <name>` | 新建组件 / 页面 / 基础组件 |
|
|
37
|
-
| `env` | 交互式创建开发环境配置 |
|
|
38
|
-
| `pages-entry --dir <scope> --type <page\|component>` | 生成 webpack 动态入口 |
|
|
39
|
-
| `pages-from-components --dir <scope>` | 批量将 `ui-*` 转为 `page-*` |
|
|
40
|
-
|
|
41
|
-
### 1. `npm run dev:ui <环境标识>` — 启动开发环境
|
|
42
|
-
|
|
43
|
-
`dev:ui` 即项目本地的 `ui-dev-server`,**环境标识用位置参数指定(不加 `--` 分隔符)**,
|
|
44
|
-
追加的位置参数会覆盖默认值:
|
|
18
|
+
必须先全局安装 CLI,否则 `work` 命令(`work add` / `work env` / `work pages-entry`)不可用:
|
|
45
19
|
|
|
46
20
|
```bash
|
|
47
|
-
npm
|
|
48
|
-
npm run dev:ui demo ui-order-list # 指定要调试的组件
|
|
49
|
-
npm run dev:ui test # 换环境:加载 .envs/.env.dev-test
|
|
50
|
-
npm run dev:ui demo ui-order-list -l touch # 切换布局(默认 pc)
|
|
51
|
-
npm run dev:ui demo ui-order-list -- --port 8080 # `--` 之后的参数透传给 vue-cli-service
|
|
21
|
+
npm i -g @bams-app/work-cli
|
|
52
22
|
```
|
|
53
23
|
|
|
54
|
-
|
|
55
|
-
| ------------------- | ---- | ------------------------------------------------------------------ |
|
|
56
|
-
| 位置参数 1 | 是 | 环境标识(如 `demo` → `.envs/.env.dev-demo`),也可传 env 文件路径 |
|
|
57
|
-
| 位置参数 2 | 否 | 组件目录名(如 `ui-order-list`),省略时默认 `ui-component-demo` |
|
|
58
|
-
| `--env`、`-e` | 否 | 等价于位置参数 1(显式指定环境标识或 env 文件路径) |
|
|
59
|
-
| `--component`、`-c` | 否 | 等价于位置参数 2 |
|
|
60
|
-
| `--layout`、`-l` | 否 | 布局:`pc`(默认)/ `touch` |
|
|
61
|
-
| `--` 之后的参数 | 否 | 原样透传给底层 `vue-cli-service`(如 `--port`、`--open`) |
|
|
62
|
-
|
|
63
|
-
环境文件不存在时直接报错并给出路径,不会静默使用默认值。
|
|
64
|
-
|
|
65
|
-
启动地址与接口代理取自环境文件:`PORT` 决定本地端口,`PROXY_TARGET` 决定后端代理目标。
|
|
66
|
-
|
|
67
|
-
### 2. `bams-work add` — 新建组件
|
|
24
|
+
## 开始
|
|
68
25
|
|
|
69
26
|
```bash
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
bams-work add --dir demo-ui --name ui-base-btn --type base # 基础组件
|
|
27
|
+
npm install
|
|
28
|
+
npm run dev:ui demo # 环境 demo → .envs/.env.dev-demo
|
|
73
29
|
```
|
|
74
30
|
|
|
75
|
-
|
|
76
|
-
| -------- | ---- | ----------------------------------------------------------------------------------------------------------------------- |
|
|
77
|
-
| `--dir` | 是 | scope 目录名(小写字母、数字、连字符,如 `energy-ui`);不存在会自动创建,并自动注册到根 `package.json` 的 `workspaces` |
|
|
78
|
-
| `--name` | 是 | 组件名,自动转为 kebab-case;`component`/`base` 建议 `ui-` 前缀,`page` 建议 `page-` 前缀 |
|
|
79
|
-
| `--type` | 否 | `component`(默认)/ `page` / `base` |
|
|
80
|
-
| `--desc` | 否 | 组件描述 |
|
|
81
|
-
|
|
82
|
-
创建完成后会提示用哪条 `npm run dev:ui` 命令调试。
|
|
83
|
-
|
|
84
|
-
### 3. `bams-work env` — 创建开发环境
|
|
85
|
-
|
|
86
|
-
交互式向导,无需记参数,生成 `.envs/.env.dev-<标识>`:
|
|
31
|
+
`dev:ui` 由项目本地的 `@bams-app/ui-dev-server` 提供:
|
|
87
32
|
|
|
88
33
|
```bash
|
|
89
|
-
|
|
34
|
+
npm run dev:ui demo ui-order-list # 位置参数1=环境标识,位置参数2=组件目录名
|
|
35
|
+
npm run dev:ui demo ui-order-list -l touch # 布局 pc(默认)/ touch
|
|
36
|
+
npm run dev:ui demo -- --port 8080 # `--` 之后透传给 vue-cli-service
|
|
90
37
|
```
|
|
91
38
|
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
创建方式二选一:
|
|
39
|
+
环境文件缺失会直接报错;`PORT` 决定端口,`PROXY_TARGET` 决定代理目标。
|
|
95
40
|
|
|
96
|
-
|
|
97
|
-
- **自定义配置**:从默认模板逐项填写
|
|
41
|
+
## 命令
|
|
98
42
|
|
|
99
|
-
|
|
43
|
+
| 命令 | 作用 |
|
|
44
|
+
| ---------------------------------------------------------------------------------- | --------------------------------------------------------------------------- |
|
|
45
|
+
| `npm run dev:ui <环境标识> [组件名]` | 启动开发服务 |
|
|
46
|
+
| `work add --dir <scope> --name <name> [--type component\|page\|base] [--desc ...]` | 新建组件/页面/基础组件;scope 目录不存在会自动创建并注册到根 `package.json` |
|
|
47
|
+
| `work env` | 交互式生成 `.envs/.env.dev-<标识>` |
|
|
48
|
+
| `work pages-entry --dir <scope> --type page\|component` | 生成构建用动态入口(内部使用) |
|
|
49
|
+
| `work pages-from-components --dir <scope>` | 把 `ui-*` 批量复制为 `page-*` |
|
|
100
50
|
|
|
101
|
-
|
|
51
|
+
环境文件字段:`PORT`、`PROXY_TARGET`、`BASE_URL`、`VUE_APP_*` 等,见模板文件;改完重跑 `dev:ui` 生效。
|
|
102
52
|
|
|
103
|
-
|
|
104
|
-
| ------------------------------------------------------------------------------------------- | ---------------------------------------------------- |
|
|
105
|
-
| `NODE_ENV` | 运行环境,固定 `development` |
|
|
106
|
-
| `PORT` | 开发服务器端口(创建时自动避开其他环境已占用的端口) |
|
|
107
|
-
| `PROXY_TARGET` | 接口代理目标(后端服务地址) |
|
|
108
|
-
| `BASE_URL` | 应用基础路径,默认 `/` |
|
|
109
|
-
| `COMPONENT_LOGIN`、`COMPONENT_STARTR_LAYOUT` | 可配置组件插槽:登录页 / 布局组件包名 |
|
|
110
|
-
| `VUE_APP_TITLE`、`VUE_APP_SYS_NAME`、`VUE_APP_SYS_CODE` | 浏览器标签标题、系统名称、系统编码 |
|
|
111
|
-
| `VUE_APP_SHOW_HEADER`、`VUE_APP_ENABLE_THEME`、`VUE_APP_THEME_MODE`、`VUE_APP_THEME_PRESET` | 头部显示与主题(模式 / 预设色) |
|
|
112
|
-
| `VUE_APP_ENABLE_I18N`、`VUE_APP_ENABLE_VERSION_LOG`、`VUE_APP_TABS_EXPAND_STATE` | 国际化、版本日志、Tabs 展开/收起 |
|
|
113
|
-
| `VUE_APP_ENABLE_CAPTCHA`、`VUE_APP_ENABLE_MESSAGE_VOICE`、`VUE_APP_MESSAGE_WS_URL` | 登录验证码、消息告警通知及其 WS 地址 |
|
|
114
|
-
| `VUE_APP_LOGIN_URL`、`VUE_APP_LOGIN_PUBLIC_KEY`、`VUE_APP_WEBSOCKET_URL` | 登录页地址、登录公钥、WebSocket 地址 |
|
|
115
|
-
| `VUE_APP_DEVEXTREME_LICENSE_KEY` | DevExtreme 许可证密钥(可留空) |
|
|
53
|
+
## 依赖升级
|
|
116
54
|
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
能力包与运行时依赖(vue、ant-design-vue、devextreme 等)由 ui-dev-server 提供,不在项目
|
|
120
|
-
`package.json` 中声明;lockfile 已把它们逐个钉死,所以 `npm install`、
|
|
121
|
-
`npm i @bams-app/ui-dev-server@latest`、`npm update @bams-app/ui-dev-server` 都**不会**刷新
|
|
122
|
-
它们(只换掉 ui-dev-server 自己),裸 `npm update` 又会重解析整棵依赖树。
|
|
123
|
-
|
|
124
|
-
清掉 lockfile 中这些包的记录,再让 npm 按 ui-dev-server 的声明重新解析:
|
|
55
|
+
项目只声明 `@bams-app/ui-dev-server`,能力包与 vue、devextreme 等运行时依赖都由它提供并提升到根 `node_modules`。
|
|
56
|
+
ui-dev-server 对能力包声明的是显式版本范围(`^x.y.z`),范围随它每次发布同步更新,因此升级就是一条命令:
|
|
125
57
|
|
|
126
58
|
```bash
|
|
127
|
-
|
|
128
|
-
node -e "
|
|
129
|
-
const fs = require('fs');
|
|
130
|
-
const dev = JSON.parse(fs.readFileSync('node_modules/@bams-app/ui-dev-server/package.json', 'utf8'));
|
|
131
|
-
const names = new Set([...Object.keys(dev.dependencies || {}), '@bams-app/ui-dev-server']);
|
|
132
|
-
const lock = JSON.parse(fs.readFileSync('package-lock.json', 'utf8'));
|
|
133
|
-
let removed = 0;
|
|
134
|
-
for (const section of ['packages', 'dependencies']) {
|
|
135
|
-
const container = lock[section];
|
|
136
|
-
if (!container) continue;
|
|
137
|
-
for (const key of Object.keys(container)) {
|
|
138
|
-
const name = key.replace(/^.*node_modules\//, '');
|
|
139
|
-
if (names.has(name)) { delete container[key]; removed++; }
|
|
140
|
-
}
|
|
141
|
-
}
|
|
142
|
-
fs.writeFileSync('package-lock.json', JSON.stringify(lock, null, 2) + '\n');
|
|
143
|
-
console.log('已清理', removed, '条由 ui-dev-server 提供的依赖记录');
|
|
144
|
-
"
|
|
145
|
-
|
|
146
|
-
# 2. 这些包按 ui-dev-server 声明的版本重新解析,其余依赖保持锁定不动
|
|
147
|
-
npm install
|
|
59
|
+
npm i @bams-app/ui-dev-server@latest
|
|
148
60
|
```
|
|
149
61
|
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
### 5. 其他命令
|
|
153
|
-
|
|
154
|
-
- `bams-work pages-entry --dir <scope> --type page|component`:扫描该 scope 下的 `page-*` / `ui-*` 目录,生成 webpack 动态入口 `build-components-entry.js`(构建流程内部使用,一般无需手动执行)
|
|
155
|
-
- `bams-work pages-from-components --dir <scope>`:把该 scope 下的 `ui-*` 组件批量复制为 `page-*` 页面
|
|
156
|
-
|
|
157
|
-
## 首次安装
|
|
158
|
-
|
|
159
|
-
```bash
|
|
160
|
-
npm install
|
|
161
|
-
```
|
|
162
|
-
|
|
163
|
-
项目只声明 `@bams-app/ui-dev-server` 一个开发依赖,能力包(`@bams-app/components` 等)与
|
|
164
|
-
运行时依赖(vue、ant-design-vue、devextreme、pinia、axios、dayjs 等)都由它提供,
|
|
165
|
-
安装后提升到项目根 `node_modules`,业务组件与开发环境共用同一份实例。升级这些依赖只需
|
|
166
|
-
更新 ui-dev-server(见上文),无需逐个改版本号。
|
|
167
|
-
|
|
168
|
-
## 升级 CLI
|
|
169
|
-
|
|
170
|
-
```bash
|
|
171
|
-
npm i -g @bams-app/work-cli@latest
|
|
172
|
-
```
|
|
62
|
+
新范围与 `package-lock.json` 中钉住的旧版本不再匹配,npm 会自动重新解析整套能力包,无需手工清理 lockfile。
|
|
173
63
|
|
|
174
|
-
全局 CLI
|
|
175
|
-
项目依赖按上文「升级 ui-dev-server 提供的依赖」清理 lockfile 后升级。
|
|
64
|
+
全局 CLI 升级:`npm i -g @bams-app/work-cli@latest`。
|
|
176
65
|
|
|
177
|
-
##
|
|
66
|
+
## 自定义
|
|
178
67
|
|
|
179
|
-
-
|
|
180
|
-
|
|
181
|
-
`PROXY_TARGET`),内置默认仅补充未声明项;键序即匹配序,修改后需重启 `npm run dev:ui`
|
|
182
|
-
- webpack 扩展:创建项目根 `vue.config.extend.js`(导出对象或 `({ env, projectRoot }) => 对象`)
|
|
68
|
+
- 代理:项目根 `.proxy.js`(参考 `.proxy.js.example`),声明的前缀优先于内置默认,修改后需重启
|
|
69
|
+
- webpack:项目根 `vue.config.extend.js`,导出对象或 `({ env, projectRoot }) => 对象`
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "bams-work-project",
|
|
3
3
|
"version": "0.0.6",
|
|
4
4
|
"private": true,
|
|
5
|
-
"description": "BAMS-Work
|
|
5
|
+
"description": "BAMS-Work 项目",
|
|
6
6
|
"workspaces": [
|
|
7
7
|
"demo-ui/*",
|
|
8
8
|
"bams-components/*",
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
],
|
|
13
13
|
"scripts": {
|
|
14
14
|
"dev:ui": "ui-dev-server",
|
|
15
|
-
"add": "
|
|
15
|
+
"add": "work add"
|
|
16
16
|
},
|
|
17
17
|
"devDependencies": {
|
|
18
18
|
"@bams-app/ui-dev-server": "*"
|