从零做一个开源项

开源项目包含哪些内容

源码
文档：如二次开发文档和用户使用文档
开发环境：指导二次开发者如何搭建和运行代码
**允许他人贡献代码**，而不仅仅是阅读源码
**问题管理**：用户提问、维护者答复、问题共享
**问题列表和升级计划**：记录当前问题及解决、升级计划

其他配套设施

官网，如 wangEditor 官网
文档，可与官网整合
问答社区，wangEditor 使用 github issue
及时交流社区，如 QQ 群、微信群

注册账号

创建 github 仓库（协议选 MIT，勾选 add README.md）
- 示例仓库：https://github.com/cxvh/is-visit-google.git
注册 npmjs 账号

开发环境搭建

需安装 node 环境

规范版本号

打开 package.json，将版本号定义为 "version": "0.0.1"
版本号分三级：
- 一级：重构版本
- 二级：重大功能改进
- 三级：小升级或 bug 修复
0.x.x 为测试版，1.x.x 起为正式版

规范项目目录结构

建议提前规划好一级目录，例如：

src - 源代码
release - 发布结果
test - 单元测试用例
doc - 文档
example - 示例

1 2	npm init mkdir src release test doc example

构建工具配置

安装依赖

1
2
3

npm i babel-loader @babel/core @babel/preset-env babel-register jsxobj babel-preset-es2015 webpack webpack-cli --save-dev --registry=https://registry.npm.taobao.org
npm i http-server -g # mac 用户加 sudo
npm i gitbook-cli -g # mac 用户加 sudo

配置 webpack

在项目根目录创建 webpack.config.js：

const path = require('path');
module.exports = {
    entry: './src/index.js',
    mode: 'development',
    output: {
        filename: '[name]_bundle.js',
        path: path.join(__dirname, 'release'),
    }
}

配置 package.json 脚本

{
  "scripts": {
    "start": "http-server -p 3000",
    "build": "webpack --config webpack.config.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  }
}

运行示例

在 example 目录下创建 test.html，引用 release 目录下的内容：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>example</title>
  </head>
  <body>
    <p>example</p>
    <script src="../release/bundle.js"></script>
  </body>
</html>

运行 npm run example，浏览器访问即可。

规范 git 分支

建议至少存在 master 和 dev 两个分支。dev 为开发分支，master 为主分支。可根据需要增加 next、fix-bug 等分支，但遵循“用不到的就先不要规划”的原则。

完善 README.md

README.md 是开源项目的门面，建议包含：

产品简介（突出特点，差异化竞争）
产品安装和下载方式
快速使用（详细文档或外链）
交流提问区
关于作者（博客链接、收款二维码）
最后将所有内容提交到 github

提交代码流程

写代码：注意编码规范，建议使用 eslint 等工具
写文档 & 测试用例：文档和测试用例非常重要，是代码不可分割的一部分

文档目录示例

创建 SUMMARY.md：

# Summary

- [项目介绍](README.md)
- [使用文档](doc/use/README.md)
  - [使用 1](doc/use/use1.md)
  - [使用 2](doc/use/use2.md)
- [二次开发](doc/dev/README.md)
  - [开发 1](doc/dev/dev1.md)
  - [开发 2](doc/dev/dev2.md)