修己安人,内圣外王

近期,在开发Node项目过程中遇到了须要类jQuery深拷贝对象的问题。去Github找了半天,并没有符合的,于是,自己决定写一个(mixin.js),然后推送到NPM(查看Npm相关内容。请查看<npm模块管理器>)。以下是整个流程,在此记录~~~

环境要求

  • 安装Node
  • 安装Npm

创建项目

第一步:在Github创建相关repository,然后进行npm init 初始化package.json。之前曾撰写过使用commander进行模拟npm init操作,请參考:使用Node.js构建命令行工具

第二步:编写相关代码

注意:对于引入方式进行处理

(function (global, name, factory) {
"use strict"; if (typeof exports === 'object' && typeof module !== 'undefined') {
module.exports = factory();
} else if (typeof define === 'function' && (define.amd || define.cmd)) {
define(factory);
} else {
global[name] = factory.apply(this);
}
}(this, "项目名称", function () {
// 逻辑编写
}));

第三步:公布模块

1. 在npm注冊账号:https://www.npmjs.com/signup

2. 在本地登录自己刚注冊的账号 npm login

3. 公布模块 npm publish

持续集成

眼下Github已经整合了持续集成服务travis,我们仅仅须要在项目中加入.travis.yml文件,在下一次push之后。travis就会定时执行npm test来測试你的项目(该项目中,使用mocha进行測试管理),而且会在測试失败的时候通知到你,你也能够把项目当前的状态显示在README.md中,进而非常easy知道项目当前状态。

language: node_js
node_js:
- "4"

压缩打包

项目中,使用gulp进行压缩代码

var gulp = require('gulp');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename'); gulp.task('default', function () {
gulp.src('src/*.js')
.pipe(uglify())
.pipe(rename({ extname: '.min.js' }))
.pipe(gulp.dest('dist/'))
});

附:

项目结构

mixin.js
├─┬ dist
│ └── mixin.min.js
├─┬ src
│ └── mixin.js
├─┬ test
│ └── test.js
├── .gitignore
├── .npmignore
├── .travis.yml
├── gulpfile.js
├── LICENSE
├── package.json
├── README.md

项目面板

项目地址:https://www.npmjs.com/package/mixin.js

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvbGlnYW5nMjU4NTExNg==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="这里写图片描写叙述" title="">

package.json关键字段说明

package.json文件必须是一个JSON,而非JavaScript对象。

更具体内容。请查看<package.json>

  • name:最重要的字段之中的一个。项目名称(少于214个字节)。没有name和version不能进行安装;
  • version:最重要的字段之中的一个,项目版本号。

    没有name和version不能进行安装。改动项目代码的同一时候须要改动该version字段。

  • description:项目描写叙述,帮助人们通过npm search发现该项目;
  • keywords:关键字,帮助人们通过npm search发现该项目。
  • license:开源声明;
类型 说明
General Public License,简称GPL 执行、复制软件的自由,发行传播软件的自由。获得软件源代码的自由,改进软件并将自己作出的改进版本号向社会发行传播的自由。
BSD 能够自由的使用。改动源代码,也能够将改动后的代码作为开源或专有软件再公布
Massachusetts Institute of Technology,简称MIT 赋予软体被授权人更大的权利与更少的限制

详情參考:https://docs.npmjs.com/files/package.json

公布项目到NPM的更多相关文章

  1. Vue 项目: npm run dev 报错 webpack-dev-server

    从码云上下载vue项目,运行npm run dev 时报错: > webpack-dev-server --inline --progress --config build/webpack.de ...

  2. create-react-app 创建的项目执行npm run eject后,运行报错

    create-react-app 创建的项目执行npm run eject后,运行报错:Cannot find module '@babel/plugin-transform-react-jsx-so ...

  3. 微信小程序项目使用npm安装vant-weapp的正确步骤,简单易懂!!

    微信小程序项目使用npm安装vant-weapp的正确步骤 1.在当前小程序项目目录npm init -y 构建npm项目 2.运行命令 npm install vant-weapp -S --pro ...

  4. 开发一个项目之npm

    npm (nodejs平台上写的js模块的管理工具  下载.互相依赖等) npm install 本地项目的node_modules文件夹  , -g  npm config prefix 目录eg: ...

  5. 下载一个vue项目执行npm install 后运行项目npm run dev后出错 - 问题解决

    在SVN上拉下来一个vue项目,上面没有提交项目里面的node_modules文件夹,所以要自己执行 npm install 安装,但安装完后运行项目后却报错了: $ npm run dev > ...

  6. vue-cli项目里npm安装使用elementUI

    第一步:进入到项目目录里 npm i element-ui -S 第二步:在main.js中引入 import ElementUI from 'element-ui' import 'element- ...

  7. Vue 项目: npm run dev b报错 “'webpack-dev-server' 不是内部或外部命令,也不是可运行的程序 或批处理文件。”

    前提: 电脑已经安装了nodeJS和npm,  项目是直接下载的zip包. 报错步骤为1:cd /d 目录: 2. npm ren dev  -------> 报错如下: > webpac ...

  8. vue-cli3.0创建项目报npm install --loglevel error 踩坑的那把辛酸泪

    创建项目 vue create vue-pro 然后如下图 一开始以为是npm的问题,卸载了Mac的node ,安装nvm,然后再安装node (可参考: Mac中nvm的安装和使用   https: ...

  9. 创建新react项目 运行npm start 报错踩过的坑

    1.看react官网创建新的react项目 :npx create-react-app my-app    cd到my-app  npm start 遇见如下报错 这是因为电脑本地git的原因 ,不是 ...

随机推荐

  1. 05.使用jdk发布webservice服务

    无论服务端是用什么写的,使用框架写的还是用jdk写的,它都会发布出来这样一个东西.主要你遵循咱们这七个步骤来走就可以调用了. 咱们现在转换一下角色,自己发布一个服务让别人去调.怎么来发布一个服务? 我 ...

  2. Hdu-6243 2017CCPC-Final A.Dogs and Cages 数学

    题面 题意:问1~n的所有的排列组合中那些,所有数字 i 不在第 i 位的个数之和除以n的全排,即题目所说的期望,比如n=3 排列有123(0),132(2),231(3),213(2),312(3) ...

  3. springboot @WebFilter过滤器的使用

    过滤器的用法就不多说了 新建Filter的继承类:MemberFilter(放置包需要注意) @WebFilter(urlPatterns = "/*") @Order(1) pu ...

  4. Citrix架构

    本图为citrix在Azure上的基本架构 包含了netscaler, VDA, DDC, AD四台服务器以及Azure SQL服务

  5. Python的filter与map内置函数

    简单的记录下这两个函数的功能: list(filter(lambda x : x % 2, range(10))) 上例是返回了0-10之间的所有基数组成的列表.filter()有2个参数,第一个参数 ...

  6. BZOJ 4491 分块OR差分+线段树

    思路: (是不是只有我作大死写了个分块) up[i][j]表示从第i块开始到第j个位置 上升的最大值 down[i][j]同理 left_up[i]表示从第i块开始能够上升的最长长度 left_dow ...

  7. 关于百分比宽高div居中并垂直居中问题

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. 时间&物质&效率

    由于我的家庭是地道的农民家庭,在上学的时候,父母很辛苦的供我读初中,高中,大学. 现在我想说的是,用时间来换取效率是我求学时最大的遗憾. 举一个例子吧:每次回家坐火车,火车很费时间,假如我不缺钱,完全 ...

  9. SQL触发器 inset自学经验

    本人建立了一个特价汇网站,想要记录每个商品的点击量和整个网站的访问量,于是就想用sql 触发器来实现 drop trigger tgr_cg_records_update_column create ...

  10. Linux学习笔记(Redhat)

    一.开始 linux平台上的开发 vi.gcc.gdb.make.jdk.tomcat.mysql. linux基本操作 c语言功底<c专家编程>和java语言 学习unix高级编程 &l ...