Skip to content

Commit e5011c3

Browse files
JackLianliujuping
JackLian
authored and
liujuping
committed
docs: update cli related docs
1 parent 7674e27 commit e5011c3

2 files changed

Lines changed: 39 additions & 36 deletions

File tree

‎docs/docs/guide/create/useEditor.md‎

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -8,34 +8,34 @@ sidebar_position: 0
88
1. clone 低代码项目的官方 demo，直接启动项目。适合普通人。
99
2. 手工引入低代码 UMD 包，手工配置、打包和启动。适合 Webpack 配置工程师。
1010

11-
## 方法 1: 以官方 Demo 为基础使用
11+
## 方法 1：通过官方命令行工具创建编辑器
1212

13-
可以通过两种方式之一获取低代码编辑器的示例代码：
14-
15-
1. 直接[在 github 仓库下](https://github.com/alibaba/lowcode-demo)进行下载
16-
17-
![](https://img.alicdn.com/imgextra/i3/O1CN01PfGV3h1oJ1Wv3sakc_!!6000000005203-2-tps-1500-517.png)
18-
19-
2. 如果本地安装了 git，可以通过 git clone 方式进行下载
13+
1. 确保本地安装了 Node.js 和 npm，如果没有，[您可以通过 nvm 进行快捷的安装](https://github.com/nvm-sh/nvm)
14+
2. 确保为 npm [设置了可以访问的 npm 源，保证安装过程无网络问题](https://npmmirror.com/)
15+
3. 安装官方命令行工具
16+
```bash
17+
npm install -g @alilc/create-element@latest
18+
```
19+
4. 通过命令行工具创建
20+
```bash
21+
npm init @alilc/element editor-project-name
22+
```
23+
这时会看到一个选项列表
2024

21-
（这个方法的好处是 demo 有了更新，可以通过 merge 方式跟上）
22-
```bash
23-
git clone https://github.com/alibaba/lowcode-demo.git
24-
```
25+
<img src="https://img.alicdn.com/imgextra/i3/O1CN01LAaw2R1veHDYUzGB1_!!6000000006197-2-tps-676-142.png" width="350"/>
2526

26-
拉取仓库代码后，需要进行如下配置或安装过程：
27+
选择`编辑器`，并填写对应的问题，即可完成创建。
2728

28-
1. 确保本地安装了 Node.js 和 npm，如果没有，[您可以通过 nvm 进行快捷的安装](https://github.com/nvm-sh/nvm)
29-
2. 确保为 npm [设置了可以访问的 npm 源，保证安装过程无网络问题](https://npmmirror.com/)
30-
3. 选择目录下其中一个 demo 工程进入，建议选择 `demo-general`
29+
> 注 @alilc/create-element 版本需 >= 1.0.4，若看不到`编辑器`选项，请重新执行步骤 3
30+
5. 进入创建后的目录
3131
```bash
32-
cd demo-general
32+
cd editor-project-name
3333
```
34-
4. 安装依赖
34+
6. 安装依赖
3535
```bash
3636
npm install
3737
```
38-
5. 安装依赖成功后，启动项目 (注意观察上一步的输出，如有 error 等失败信息，请先进行排查)
38+
7. 安装依赖成功后，启动项目 (注意观察上一步的输出，如有 error 等失败信息，请先进行排查)
3939
```bash
4040
npm start
4141
```

‎docs/docs/guide/expand/editor/cli.md‎

Lines changed: 20 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -16,21 +16,24 @@ sidebar_position: 7
1616
## 脚手架功能
1717
### 脚手架初始化
1818

19-
```shell
20-
$ npm init @alilc/element your-element-name
19+
```bash
20+
npm init @alilc/element your-element-name
2121
```
22-
2322
不写 your-element-name 的情况下，则在当前目录创建。
2423

25-
> 觉得安装速度比较慢的同学，可以设置 npm 国内镜像，如
24+
> 注 1：如遇错误提示 `sh: create-element: command not found` 可先执行下述命令
25+
```bash
26+
npm install -g @alilc/create-element
27+
```
2628

29+
> 注 2：觉得安装速度比较慢的同学，可以设置 npm 国内镜像，如
2730
```bash
28-
$ npm init @alilc/element your-element-name --registry=https://registry.npmmirror.com
31+
npm init @alilc/element your-element-name --registry=https://registry.npmmirror.com
2932
```
3033

3134
选择对应的元素类型，并填写对应的问题，即可完成创建。
3235

33-
![image.png](https://img.alicdn.com/imgextra/i3/O1CN01SNaXUg1g4LurKuBHs_!!6000000004088-2-tps-688-148.png)
36+
![image.png](https://img.alicdn.com/imgextra/i3/O1CN01LAaw2R1veHDYUzGB1_!!6000000006197-2-tps-676-142.png)
3437

3538
### 脚手架本地环境调试
3639

@@ -43,27 +46,22 @@ npm start
4346
### 脚手架构建
4447

4548
```bash
46-
$ npm run build
49+
npm run build
4750
```
4851

4952
### 脚手架发布
5053

5154
修改版本号后，执行如下指令即可：
5255

5356
```bash
54-
$ npm publish
57+
npm publish
5558
```
5659

57-
# 🔥🔥🔥 调试物料/插件/设置器
60+
## 🔥🔥🔥 调试物料/插件/设置器
5861

5962
> 📢📢📢 低代码生态脚手架提供的调试利器，在启动 setter/插件/物料 项目后，直接在已有的低代码平台就可以调试，不需要 npm link / 手改 npm main 入口等传统方式，轻松上手，强烈推荐使用！！
6063
61-
62-
注：若控制台出现如下错误，直接访问一次该 url 即可~
63-
64-
![image.png](https://img.alicdn.com/imgextra/i1/O1CN01cvKmeK1saCqpIxbLW_!!6000000005782-2-tps-1418-226.png)
65-
66-
## 组件/插件/Setter 侧
64+
### 组件/插件/Setter 侧
6765

6866
1. 插件/setter 在原有 alt 的配置中添加相关的调试配置
6967
```json
@@ -120,7 +118,7 @@ $ npm publish
120118
https://lowcode-engine.cn/demo/demo-general/index.html?debug
121119
```
122120

123-
## 项目侧的准备
121+
### 项目侧的准备
124122

125123
> 如果你的低代码项目 fork 自官方 demo，那么项目侧的准备已经就绪，不用再看以下内容~
126124
@@ -175,7 +173,12 @@ $ npm publish
175173
}
176174
```
177175

178-
# Meta 信息
176+
注：若控制台出现如下错误，直接访问一次该 url 即可~
177+
178+
![image.png](https://img.alicdn.com/imgextra/i1/O1CN01cvKmeK1saCqpIxbLW_!!6000000005782-2-tps-1418-226.png)
179+
180+
181+
## Meta 信息
179182
meta 信息是放在生态元素 package.json 中的一小段 json，用户可以通过 meta 了解到这个元素的一些基本信息，如元素类型，一些入口信息等。
180183

181184
```typescript

0 commit comments

Comments
 (0)