npm包在现在前端开发中经常使用且便利,而我也是经常使用,而没研究怎么去发布npm。那如何发布npm包呢?

一、在npm的官网上注册一个账号登录,https://www.npmjs.com/

  注意此步骤记住登录名和密码,后面会使用到

二、新建一个目录,比如study,进入到这个study目录里,使用 npm login 命令登录,按照提示操作:

  

  注意 password 输入时不显示,继续按正确方式输入就行,不影响

三、进入study目录,执行命令npm init 初始化项目生成package.json文件

  

  注意:package.json 文件的name值唯一,此名字就是将来供下载使用的npm包名

四、在study目录新建index.js文件

  module.exports = "hello world";

五、在study目录下发布npm包 :npm publish

  此步骤其实发布的就是study目录以及目录下的文件(index.js、package.json)

    如果发布成功,请在 https://www.npmjs.com/settings/XXX/packages 下查看

注意:在 npm publish 过程中遇见的问题:

  1.邮箱未验证

    npm ERR! 403 Forbidden - PUT https://registry.npmjs.org/study123 - you must verify your email before publishing a new package: https://www.npmjs.com/email-edit

    

    处理:将邮箱中的邮箱验证链接处理下就行

  2.npm 包名不唯一

    npm ERR!  you do not have permission to publish 'study'.Are you logged in as the corrent user?

    处理:改变 package.json 中的name 值即可

拓展:

  1.使用发布的npm包

   npm install study123 --save (包名就是package.json文件的name值)
   import test from 'study123'
   console.log(test) //"hello world"

  2.更新一个已经发布的包
     npm version patch //修改包的版本
    npm publish //重新发布包

  3.删除自己发布的npm包
   npm unpublish
    npm --force unpublish

    

如何发布一个npm包?的更多相关文章

  1. 如何发布一个npm包(基于vue)

    前言:工作的时候总是使用别人的npm包,然而我有时心底会好奇自己如何发布一个npm包呢,什么时候自己的包能够被很多人喜欢并使用呢...今天我终于迈出了第一步. 前提:会使用 npm,有 vue 基础, ...

  2. 从0到1发布一个npm包

    从0到1发布一个npm包 author: @TiffanysBear 最近在项目业务中有遇到一些问题,一些通用的方法或者封装的模块在PC.WAP甚至是APP中都需要使用,但是对于业务的PC.WAP.A ...

  3. 发布一个npm包(webpack loader)

    发布一个npm包,webpack loader: reverse-color-loader,实现颜色反转. 初始化项目 mkdir reverse-color-loader cd ./reverse- ...

  4. (转)前端开发-发布一个NPM包之最简单易懂流程

    原文地址:https://www.cnblogs.com/sghy/p/6829747.html 1.npm官网创建npm账户 npm网站地址:https://www.npmjs.com/ npm网站 ...

  5. 如何发布一个 npm 包

    一 背景 在工作时,突然接到经理的一个要求,需要将一个react的高阶组件函数封装成一个npm包.之前从没弄过,当场还是有些懵逼的,但是这毕竟是工作,不能推脱.于是开始了学习.汤坑之旅.最终包发布,线 ...

  6. webpack创建library及从零开始发布一个npm包

    最近公司有个需求,我们部门开发一个平台项目之后,其他兄弟部门开发出的插件我们可以拿来直接用,并且不需要我们再进行打包,只是做静态的文件引入,研究一波后发现,webpack创建library可以实现. ...

  7. 发布一个npm包

    前言 我这里是写了一个vue轮播图插件,因此我使用了vue的脚手架工具创建一个项目,当然你也可以选择自己搭建脚手架. 本例中我会使用vue脚手架创建一个项目,并发布到npm上面去. 通过脚手架创建项目 ...

  8. 如何发布一个包到npm && 如何使用自己发布的npm包 && 如何更新发布到npm的package && 如何更新当前项目的包?

    如何发布一个包到npm First 在https://www.npmjs.com注册一个账号. Second 编辑好项目,文件大致如下: 其中,gitignore可以如下: .DS_Store nod ...

  9. 如何开发一个npm包并发布到npm中央仓库

    转自: https://liaolongdong.com/2019/01/24/publish-public-npm.html 如何开发一个npm包并发布到npm中央仓库需求背景:平时在项目工作中可能 ...

随机推荐

  1. OpenCV.物体识别

    1.度娘:“OpenCV 物体识别” 1.1.opencv实时识别指定物体 - 诺花雨的博客 - CSDN博客.html(https://blog.csdn.net/qq_27063119/artic ...

  2. vue操作数组时遇到的坑

    用vue操作数组时,一般就那几个方法,而且是可以渲染的,但是有时候列表是渲染不了的先说下操作数组的几个方法吧 1 push ( ) 这个方法是在数组的最后面添加元素 用法:  括号里写需要加入的元素  ...

  3. [Arc102B]All Your Paths are Different Lengths_构造_二进制拆分

    All Your Paths are Different Lengths 题目链接:https://atcoder.jp/contests/arc102/tasks/arc102_b 题解: 构造题有 ...

  4. Django中的图片加载不出来解决方式记录

    背景:Python3.6 + Django2.2 在模板中的html文件中引用图片时,在浏览器中图片总是显示不出来,上网查了很多解决方式,但是都没有解决问题,最终尝试了多次后得以解决,但不清楚原理: ...

  5. centos7 虚拟机 A start job is running for /etc/rc.d/rc.local Comp。。。

    一直卡这F5查看日志,最后一行出现A start job is running for /etc/rc.d/rc.local Comp... 原因是rc.local权限设错了解决方法:1.进入单用户模 ...

  6. 图片压缩java工具类

    package com.net.util; import java.awt.Image; import java.awt.image.BufferedImage; import java.io.Fil ...

  7. 2.1spring cloud 环境配置

    前提:SpringBoot可以离开SpringCloud独立使用开发项目,但是SpringCloud离不开SpringBoot,属于依赖的关系. 所以基本是搭建SpringBoot + 组件 = Sp ...

  8. selenium+java+testNG+maven环境搭建

    一.简单介绍 1.selenium: Selenium是一个用于Web应用程序测试的工具.Selenium测试直接运行在浏览器中,就像真正的用户在操作一样.支持的浏览器包括IE.Mozilla Fir ...

  9. codeforces 1244C (思维 or 扩展欧几里得)

    (点击此处查看原题) 题意分析 已知 n , p , w, d ,求x , y, z的值 ,他们的关系为: x + y + z = n x * w + y * d = p 思维法 当 y < w ...

  10. thinkphp5.1路由设置小计

    route下定义路由路径,如果是这种情况 'product'=>'home/product/index',//产品信息首页 'product/list'=>'home/product/li ...