array(2) { ["docs"]=> array(10) { [0]=> array(10) { ["id"]=> string(3) "428" ["text"]=> string(77) "Visual Studio 2017 单独启动MSDN帮助(Microsoft Help Viewer)的方法" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(8) "DonetRen" ["tagsname"]=> string(55) "Visual Studio 2017|MSDN帮助|C#程序|.NET|Help Viewer" ["tagsid"]=> string(23) "[401,402,403,"300",404]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511400964" ["_id"]=> string(3) "428" } [1]=> array(10) { ["id"]=> string(3) "427" ["text"]=> string(42) "npm -v;报错 cannot find module "wrapp"" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(4) "zzty" ["tagsname"]=> string(50) "node.js|npm|cannot find module "wrapp“|node" ["tagsid"]=> string(19) "[398,"239",399,400]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511400760" ["_id"]=> string(3) "427" } [2]=> array(10) { ["id"]=> string(3) "426" ["text"]=> string(54) "说说css中pt、px、em、rem都扮演了什么角色" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(12) "zhengqiaoyin" ["tagsname"]=> string(0) "" ["tagsid"]=> string(2) "[]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511400640" ["_id"]=> string(3) "426" } [3]=> array(10) { ["id"]=> string(3) "425" ["text"]=> string(83) "深入学习JS执行--创建执行上下文(变量对象,作用域链,this)" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(7) "Ry-yuan" ["tagsname"]=> string(33) "Javascript|Javascript执行过程" ["tagsid"]=> string(13) "["169","191"]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511399901" ["_id"]=> string(3) "425" } [4]=> array(10) { ["id"]=> string(3) "424" ["text"]=> string(30) "C# 排序技术研究与对比" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(9) "vveiliang" ["tagsname"]=> string(0) "" ["tagsid"]=> string(2) "[]" ["catesname"]=> string(8) ".Net Dev" ["catesid"]=> string(5) "[199]" ["createtime"]=> string(10) "1511399150" ["_id"]=> string(3) "424" } [5]=> array(10) { ["id"]=> string(3) "423" ["text"]=> string(72) "【算法】小白的算法笔记:快速排序算法的编码和优化" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(9) "penghuwan" ["tagsname"]=> string(6) "算法" ["tagsid"]=> string(7) "["344"]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511398109" ["_id"]=> string(3) "423" } [6]=> array(10) { ["id"]=> string(3) "422" ["text"]=> string(64) "JavaScript数据可视化编程学习(二)Flotr2,雷达图" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(7) "chengxs" ["tagsname"]=> string(28) "数据可视化|前端学习" ["tagsid"]=> string(9) "[396,397]" ["catesname"]=> string(18) "前端基本知识" ["catesid"]=> string(5) "[198]" ["createtime"]=> string(10) "1511397800" ["_id"]=> string(3) "422" } [7]=> array(10) { ["id"]=> string(3) "421" ["text"]=> string(36) "C#表达式目录树(Expression)" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(4) "wwym" ["tagsname"]=> string(0) "" ["tagsid"]=> string(2) "[]" ["catesname"]=> string(4) ".NET" ["catesid"]=> string(7) "["119"]" ["createtime"]=> string(10) "1511397474" ["_id"]=> string(3) "421" } [8]=> array(10) { ["id"]=> string(3) "420" ["text"]=> string(47) "数据结构 队列_队列实例:事件处理" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(7) "idreamo" ["tagsname"]=> string(40) "C语言|数据结构|队列|事件处理" ["tagsid"]=> string(23) "["246","247","248",395]" ["catesname"]=> string(12) "数据结构" ["catesid"]=> string(7) "["133"]" ["createtime"]=> string(10) "1511397279" ["_id"]=> string(3) "420" } [9]=> array(10) { ["id"]=> string(3) "419" ["text"]=> string(47) "久等了,博客园官方Android客户端发布" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(3) "cmt" ["tagsname"]=> string(0) "" ["tagsid"]=> string(2) "[]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511396549" ["_id"]=> string(3) "419" } } ["count"]=> int(200) } 222 npm包开发与发布 - 爱码网
jyughynj

 

把通用的功能开发成npm包,便用使用和维护,更重要的是可以分享给广大的开发者,是不是很激动人心!

那么,步骤如下:

1.创建项目

创建项目目录,npm init ,根据需要输入配置信息(建完后也可以在package.json中自行修改)

创建完成后项目目录下会有一个package.json文件

配置项

name: 说明了npm包的名称,也就是publish后可以在npmjs中通过该名称搜索到

version:版本号

main:入口文件

 

2.创建index.js文件,内容如下:

 1 function addZero(num) {
 2   return num > 9 ? num : '0' + num
 3 }
 4 
 5 let formatter = {
 6   date: null,
 7   init(date) {
 8     try {
 9       if (date) {
10         this.date = new Date(date)
11       }
12     } catch (error) {
13       console.info(error)
14     }
15   },
16   getDateTime () {
17     let date = this.date || new Date()
18     let res = ''
19     res = date.getFullYear() + '-' + addZero(date.getMonth() + 1) + '-' +addZero(date.getDate())
20     + ' ' + addZero(date.getHours()) + ':' + addZero(date.getMinutes()) + ':' + addZero(date.getSeconds())
21     return res
22   },
23   getDate () {
24     return this.getDateTime().split(' ')[0]
25   },
26   getTime () {
27     return this.getDateTime().split(' ')[1]
28   }
29 }
30 
31 module.exports = formatter
module.exports = formatter意思是把formatter输出。

3.测试
创建test-formatter.js,导入index并使用其中的方法
1 let formatter = require('./index') // 导入
2 formatter.init('2018-6-9')
3 console.info(formatter.getDateTime())

命令行输入 node test-formatter.js  执行,结果为:

 

4.测试没有问题,那么需要创建一个ReadMe文件进行说明

主要包含:

介绍,安装方法,github地址,使用示例

 1 # datetime-format-wsy
 2 格式化时间,获取2019-08-07 15:06:32或2019-08-07或15:06:32
 3 
 4 # install
 5 npm install -g datetime-format-wsy
 6 
 7 #github
 8 https://github.com/shiyuan598/FrontEnd/tree/master/npm/datetime-format
 9 
10 #usage
11 let formatter = require('./index')
12 formatter.init('2018-6-9')
13 console.info(formatter.getDateTime())

此时项目的目录结构如下:

 

5.下面就可以发布了

先要有一个npm账号,,如果没有请到 https://www.npmjs.com 注册

命令行输入:

npm login

根据提示依次输入用户名、密码,登录成功后会显示用户名。

命令行输入:

npm publish

 完成发布。

如果是因为使用了淘宝镜像导致publish不成功,可以按如下步骤操作:

npm i -g nrm

nrm use npm

再次npm publish

 

6.使用

发布成功后就可以在npmjs中搜索、也可以安装使用了。

在npmjs搜索的结果:

安装:

命令行输入:npm install datetime-format-wsy --s

 

安装完成后项目目录下会增加package-lock.json描述了该包的信息:

 1 {
 2   "name": "datetime-format-wsy2",
 3   "version": "1.0.1",
 4   "lockfileVersion": 1,
 5   "requires": true,
 6   "dependencies": {
 7     "datetime-format-wsy": {
 8       "version": "1.0.1",
 9       "resolved": "https://registry.npmjs.org/datetime-format-wsy/-/datetime-format-wsy-1.0.1.tgz",
10       "integrity": "sha512-klyoj8r2KbOqN9zngjplMr+EWU+cGqa1KgzNn+TUtEpzvYqmnJvj+P90gYXgm0sKVd4+30GLesocoRmMWh3Q0Q=="
11     }
12   }
13 }

 在test-format.js中使用

1 let timeFormat = require('datetime-format-wsy')
2 let date = timeFormat.getDateTime()
3 console.info(date)

结果:

(另外,使用node运行js文件,文件改动后不会自动更新,需要重复运行node命令,

可以使用nodemon代替,自动重启,提升效率,

安装:npm install -g nodemon

使用: nodemon filename.js)

 

代码github地址:

https://github.com/shiyuan598/FrontEnd/tree/master/npm/datetime-format

 

分类:

技术点:

相关文章: