@zhike/queen-editor

Queen Editor

一个易于二次开发、与业务解耦的编辑器。

1 使用

(待完善)

1.1 安装要求：

• node v10.15
• npm v5.6.0

1.2 安装部署

npm install @zhike/queen-editor

1.3 使用方式

import { QueenEditor } from 'queen-editor' ReactDom.render(, mountNode)

1.4 测试样例

(待完善)

2 开发

2.1 本地运行

npm install
npm run start
# 浏览器访问 http://127.0.0.1:7777/dist/index.html

2.2 本地开发

2.2.1 分支类型

• master 发包分支，仅在此分支才能进行发包操作（🈲️在此分支开发）
• develop 开发分支，用来合并开发人员的分支 (🈲️在此分支开发）
• feature/\<name\> 开发人员的分支

2.2.2 工作流

从develop分支上切自己的分支进行开发

git checkout develop
git checkout -b feature/a

开发完后合develop分支的代码

git add .
git commit -m 'xxx'
git checkout develop
git pull origin develop
git checkout feature/a
git merge develop

发包

可以执行npm run try-release体验发包流程，以下代码是正式发包流程

git checkout master
git pull origin master
git merge develop
npm run release

tips：
不要在master上开发，原则上master的改动都来自于merge develop
npm run release会帮开发人员检查是否有未提交的修改，只有所有修改都提交了，才能发包。
npm run release会自动创建一个带版本号的commit，并提交到master分支上。

2.3 项目结构

2.3.1 技术选型

• 语言：typescript、less
• 打包：webpack
• 依赖框架和工具：无

2.3.1 源码目录

开发相关目录

• src 编辑器代码
• build webpack配置
• server 服务端，主要用于调试资源上传功能
• dist 开发调试目录、打包产物目录、npm包发布目录

src目录

(待完善)

配置相关目录

这里倾向于把devDependencies中需要配置的包的配置，单独写成配置文件放在项目根目录下。

• .husky husky配置（precommit阶段检查代码格式）
• .release-it.js npm发包配置
• .sh 自定义shell脚本 (检查发包前工作目录是否干净)
• .eslintrc.js、.eslintignore eslint配置
• .gitlab-ci.yml、deploy 线上部署配置
• .vscode vscode配置

3 Refs

wangEditor (respect)

husky

eslint

release-it

npm

shell