我的第一个开源项目（全纪录）

我想，每个程序员都有一个“开源”梦，这是我的第一步。

写在前面

如题，本文会详实的记录我做accurate-math这个开源项目的全过程，每一条命令、每一行代码、每一处细节。 先简单介绍下accurate-math项目：一个极简js库，用于解决js浮点数四则运算结果不准确的问题。

console.log(0.1 + 0.2); // 0.30000000000000004
console.log(0.14 / 0.2); // 0.7000000000000001
console.log(1 - 0.8); // 0.19999999999999996 
console.log(6 * 0.7); // 4.199999999999999 
console.log(0.1 + 0.2); // 0.30000000000000004 
console.log(0.1 + 0.7); // 0.7999999999999999 
console.log(1.2 / 0.2); // 5.999999999999999
复制代码

用到的技术：git、npm、webpack、javascript。

一、在github创建项目

在github上新建项目并克隆到本地。

git clone https://github.com/qq9694526/accurate-math.git
复制代码

备注：1.创建项目的名字，一定要在github和npm上都搜索一下，确保无重名，否则会影响最终在npm上的发布。2. .gitignore选择Node。

二、项目构建

1. npm初始化项目

cnpm init -y 
复制代码

2. 安装webpack

cnpm i --save-dev webpack webpack-cli webpack-dev-server
复制代码

3. 创建目录

mkdir release src example
复制代码

4. 新建文件

• 在根目录下新建webpack.config.js ，内容如下：

const path = require('path');

module.exports = {
  entry: './src/index.js',
  output: {
    path: path.resolve(__dirname, 'release'),
    filename: 'accurate-math.js'
  },
  devServer: {
    contentBase: path.join(__dirname, "./"),
    compress: true,
    port: 9000
  }
};
复制代码

• 在src目录下新建index.js。这里先建好，内容在随后的开发阶段再填充。
• 在example目录下新建demo.html，同上。

5. 在package.json中配置快捷命令

  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "webpack",// 压缩打包
    "start": "webpack-dev-server --open" // 示例用的web服务
  },
复制代码

三、项目开发

1. 功能开发

• 在src/index.js中添加add、sub、mul、div这四个方法，分别对应js四则运算中的加减乘数。具体代码就不贴了，有兴趣的参看src/index.js
• 使用webpack对代码进行压缩打包，生成accurate-math.js。

npm run build 
复制代码

• 在根目录下创建index.js，供npm安装使用。

'use strict'

module.exports = require('./release/accurate-math.js')
复制代码

2. 编写示例

• 在example/demo.html中编写示例，测试使用4种方法。详情见github的example/demo.html
• 启动web服务后， 浏览器访问http://localhost:9000/example/demo.html，查看示例及测试结果。

npm run start 
复制代码

3. 完善README Readme是开源项目的一张脸，用户的第一印象。一个好的Readme应该包含产品简介、产品安装和下载、快速使用、交流提问区、关于作者等信息，且要足够简练。 详情见github的Readme.md
4. 提交至远程仓库

git commit -am "first commit"
复制代码

5. 打个标签，标记发布结点，以示重要。它对应着github远程库上的releases。

git tag -a 'v1.0.0' -m 'v1.0.0'

git push origin v1.0.0
复制代码

四、发布到npm

1. npm身份认证

npm add user

npm login
复制代码

2. 通过邮箱验证后，执行发布命令。

npm publish .
复制代码

备注：npm发布后撤销会非常麻烦，请务必充分测试和再三检查readme，确认无误。

五、使用体验

至此，咱们或者其他用户就可以通过npm安装并使用咱们自己刚刚编写的accurate-math插件了。

npm i accurate-math -D
	
require("accurate-math")
复制代码

满满的成就感！！！

最后

• GitHub 欢迎前往star[娇羞]。 github：github.com/qq9694526/a…
• NPM 虽然能用且好用，但还是不推荐，因为已经有很多成熟类库的实现了。我这次就是体验一下开源的这个过程。 npm：www.npmjs.com/package/acc…
• 参考资料 blog.csdn.net/tianwailaik… www.cnblogs.com/junjieok/p/… www.imooc.com/article/282…

转载于:https://juejin.im/post/5c04966ee51d455e7e6c267d