前端开发 npm

npm包制作发布初体验

Posted by franki on October 7, 2018

npm包制作及发布小结

npm

闲话

npm包的出现解决了js的一些通病，例如变量易污染，模块代码交互耦合严重的问题

好戏开场，搬好小凳子听课啦

  1. 打开npm官网
  2. 注册账号，记住你的username 和 password

  3. 打开命令行工具，例如 mac 用 iterm2 打开

     common-func git:(master) ✗ npm adduser
 Username: franki
 Password:
 Email: (this IS public) 8024ldbryantant@gmail.com

 如上步骤输入账号、密码、邮箱即可登录npm，npm adduser可以用npm login代替

  4. cd tiny && touch package.json

    进入要发布的项目，创建package.json文件

    在package.json设置name, version

     {
     "name": "sss",
     "version": "1.0.0"
 }

    注意name命名规范: 1 名字必须少于214个字节 2 名字不能以下划线开头 3 包名不能有大写字母 4 包名不能含有不安全url 5 不要使用node module里面库的名称 6 不要把js、node放入名字 7 不要使用npm库里面已经存在的名字 如果仍然想要保持与npm仓库已有的名字相同的名字的话，可以用@franki/tiny，把名字scoped起来

    注意:@franki是你在npm网站注册的用户名

  5. npm publish

    若出现：

     npm ERR! publish Failed PUT 402
 npm ERR! code E402
 npm ERR! You must sign up for private packages : @franki/tiny

    用： npm publish —access=publish

    如出现：

     npm  ERROR! code 403

    更换package.json的name（与npm仓库里面的项目存在同名）

  6. 登录github网站，create a new repository (与npm项目关联起来)
  7. create readme.md 利用 shields.io 创建各种有趣的图标
  8. github insights 选择一个协议创建License
  9. write code

简单目录如下

table_content

效果来啦

具体请前往此处: common-func

CATALOG
    FEATURED TAGS
    前端开发 H5 JavaScript 设计模式 browser jQuery 源码分析 生活 leetcode Array Stack Queue Linked List 剑指offer Binary Search Tree Binary Tree Breadth-First Search Depth-First Search String Set Binary Search Sliding Window Backtracking Dynamic Programming Two Pointers Union Find Sort Bit Operation Recursion Map Graph Search Hash LinkedList 复盘 QuickSort Trie Design MinHeap Traverse Min Heap Node.js BackEnd SQL MySQL Design Patterns Network 计算机网络 Python SVG
    FRIENDS