1.0.0 • Published 6 years ago
yinpeng-npm v1.0.0
流程:
1. 注册一个npm账号
2. 创建一包文件夹(名字自己取,不要和NPM上已有的包名重复冲突就好)
3. npm int
4. 创建index.js README.md
5. npm adduser (使用终端命令行 如果是第一次发布包,执行以下命令,然后输入前面注册好的NPM账号,密码和邮箱,将提示创建成功)
6.npm login (如果不是第一次发布包,执行以下命令进行登录,同样输入NPM账号,密码和邮箱)
7.注意:npm adduser成功的时候默认你已经登陆了,所以不需要再进行npm login了
npm publish(进入项目文件夹下 发布包)
npm ERR publish 403
You do not have permission to publish 'bootstrap'.Are you logged in as the corrent user?:bootstrap (npm 已经有此包)
myMacBook-Pro:sugars_demo sugars$ npm publish
- sugars_demo@1.0.0 (成功)
更新已经发布的包
更新包的操作和发布包的操作其实是一样的
npm publish
但要注意的是,每次更新时,必须修改版本号后才能更新,比如将1.0.0修改为1.0.1后就能进行更新发布了。 这里的包版本号有一套规则,采用的是semver(语义化版本),通俗点意思就是版本号:大改.中改.小改
md语法:
feature
支持同步/异步获取图片数据(基于发布/订阅模式)
按需加载(每次渲染指定的条数)
兼容各尺寸的屏幕
无依赖(打包 JS 文件 4 kb)
较好的扩展性
图片懒加载
兼容性扩展
UI 优化
usage
npm install jswaterfall --save
window.onload = function() {
const waterfall = new Waterfall({
number: 20, // 一次性加载的图片个数;必填
// fixWidth: 1250, // 容器 width: 选填:填上后会使 window.resize 失效,fixWidth 属性优先级大于 width 属性
// width: 1250, // 容器 width;选填: 默认为浏览器的宽度,(后期考虑可以设置为某个节点的宽度)
// container: 'waterfall', // 容器 id;选填:默认为 'waterfall'
// scrollElem: 'content', // 绑定 scroll 的节点 id,默认为 window
})
waterfall.on("load", function () {
// 模拟 ajax 异步添加图片
setTimeout(function () {
const $waterfall = document.getElementById('waterfall')
for (let i = 0; i < 20; i++) {
const img = document.createElement('img')
img.setAttribute('src', `images/${i + 1}.png`)
img.setAttribute('class', 'waterfall-box')
$waterfall.appendChild(img)
}
waterfall.done() // 同步/异步写法都要加上这句,通知加载完成
}, 1000)
})
}
1.0.0
6 years ago