有时候,我们希望将项目里的模块提升为公共模块,以便其他项目也能使用。在前端可以将模块发布到npm仓库,这样所有项目都可以通过 npm install youProject 使用模块了。

这个过程很简单,具体如下:

发布流程

注册npm账户

进入npm网站 https://www.npmjs.com/ ,点击右上角的 join in,进行注册。

注册完之后一定要登录邮箱,进行校验激活(进入邮箱,点击链接即可)。

注意:校验成功后npm网站上方,不会显示警告,才能进行后续操作。

登录npm账户

执行 npm adduser。如果登录过可以执行npm login

更多命令参考 https://docs.npmjs.com/cli-documentation/

发布项目

发布项目之前,请阅读下面的项目规范!

进入项目目录,执行

npm publish

已发布的项目 注意修改版本号,保持更高即可。

项目规范

只有npm项目才可以发布。可以进入你的项目目录,运行 npm init 。

然后 修改项目的package.json配置,关键是以下几项:

"name": "your-module-name",
"version": "1.0.1",
"files": ["src"],
"main": "src/test.js",

name 和 version

分别是你的项目名称和版本号

"name": "your-module-name",
"version": "1.0.1",

这个配置,就可以这样被依赖:

npm install -S your-module-name@1.0.1

files和main

这是两个最重要的配置: files指的是别人下载你的依赖包含哪些文件 main指的是当引入依赖未指明具体路径时,实际引入的是哪个文件 如本例中:

"files": ["src"],

表示 npm install your-module-name 这个项目时 只会下载 src/ 目录下的所有内容。 进入node_modules/your-module-name 目录,发现只有src,其他代码均未下载

"main": "src/test.js",

表示当 import "your-module-name"  时,实际引入的是: import "your-module-name/src/test.js"

关闭private

很多项目(如 vue-cli 生成的项目)默认都会在package.json中加入如下配置:

"private": true,

这表示项目是私有的,不会被作为公共依赖发布。一定要删除这个配置!

好了,开始操作吧,将你的模块发到公共npm 仓库!

如何将项目发布到npm仓库的更多相关文章

  1. 从零开始把项目发布到NPM仓库中心

    从零开始把项目发布到NPM仓库中心 前期准备 注册账号 https://www.npmjs.com/signup 网易邮箱注册失败,用QQ邮箱成功 使用npm 命令注册(建议使用网页): npm ad ...

  2. 从零开始把项目发布到Nuget仓库中心

    从零开始把项目发布到Nuget仓库中心 我的项目地址 https://github.com/Ants-double/dasuan ### 前期准备 下载并注册nuget帐号 下载地址 https:// ...

  3. 把自己的项目发布到maven仓库并在maven和gradle中开始使用

    把自己的项目发布到maven仓库并在maven和gradle中开始使用 上一条博客中提到的日志打印项目总算是维护的差不多了, 不过现在使用它还是打成jar包放到其他项目内, 所以决定把项目传到mave ...

  4. vue-cli4.0 基于 antd-design-vue 二次封装发布到 npm 仓库

    1. 安装 cli npm install -g @vue/cli vue create winyh-ui 2.安装 antd-design-vue cnpm i ant-design-vue --s ...

  5. 基于vue的脚手架开发与发布到npm仓库

    什么是脚手架 在项目比较多而且杂的环境下,有时候我们想统一一下各个项目技术栈或者一些插件/组件的封装习惯,但是每次从零开发一个新项目的时候,总是会重复做一些类似于复制粘贴的工作,这是一个很头疼的事情, ...

  6. 从零开始把项目发布到maven仓库中心

    sonatype准备操作 注册账号 https://issues.sonatype.org 1. 密码符号规范,并且工记住 新建项目 1. group id 如果你有com域名的所有权可以直接使用,如 ...

  7. 使用gradle插件发布项目到nexus中央仓库

    目录 简介 Gradle Nexus Publish Plugin历史 插件的使用 Groovy DSL Kotlin DSL 插件背后的故事 总结 简介 Sonatype 提供了一个叫做开源软件资源 ...

  8. `vue-router`的`History`模式下的项目发布

    背景 脚手架版本号:vue cli 3.x 项目路由:vue-router的History模式 原理:url路由处理逻辑从后端转移到前端. 参考:https://developer.mozilla.o ...

  9. Maven入门指南⑥:将项目发布到私服

    1 . 修改私服中仓库的部署策略 Release版本的项目应该发布到Releases仓库中,对应的,Snapshot版本应该发布到Snapshots仓库中.Maven根据pom.xml文件中版本号&l ...

随机推荐

  1. 【错误】python百分号冲突not enough arguments for format string

    query = "SELECT * FROM devices WHERE devices.`id` LIKE '%{}%'".format("f2333") d ...

  2. 形象地展示信号与系统中的一些细节和原理——卷积、复数、傅里叶变换、拉普拉斯变换、零极图唯一确定因果LTI系统

    看懂本文需要读者具备一定的微积分基础.至少开始学信号与系统了本文主要讲解欧拉公式.傅里叶变换的频率轴的负半轴的意义.傅里叶变换的缺陷.为什么因果LTI系统可以被零极图几乎唯一确定等等容易被初学者忽略但 ...

  3. MVC-前端设计

    来源于:https://www.cnblogs.com/miro/p/4030622.html 从前端的UI开始 MVC分离的比较好,开发顺序没有特别要求,先开发哪一部分都可以,这次我们主要讲解前端U ...

  4. 深入分析Redis的主从复制机制

    一.前言   最近由于疫情影响,时间比较多,所以开始学习之前一直想学,但是却没时间学的Redis.这两天研究了一下Redis的持久化以及主从复制机制,现在已经很晚了,就不多废话了.这篇博客就来谈一谈R ...

  5. Java 解析 xml 常见的4中方式:DOM SAX JDOM DOM4J

    Java 四种解析 XML 的特点 1.DOM 解析: 形成了树结构,有助于更好的理解.掌握,且代码容易编写. 解析过程中,树结构保存在内存中,方便修改. 2.SAX 解析: 采用事件驱动模式,对内存 ...

  6. thinkphp5--多文件入口设置

    来源:http://www.cnblogs.com/walblog/p/8035426.html 今天在用tp5做项目的时候发现,前台是可以绑定默认到index模块的,但是后台不好弄,于是查了一下手册 ...

  7. think--数据库的设置

    1.在项目下的Common下的Conf下的config.php 配置: 'DB_TYPE' => 'mysql', // 数据库类型 'DB_HOST' => 'localhost', / ...

  8. ip的运用

    1------获取ip$ip=$_SERVICE['REMOTE_ADDR'];2------根据ip获取主机名gethostbyaddr($ip);3------根据主机名获取IPgethostby ...

  9. 不论是 Basic Auth 还是 Digest Auth,都会有 Authorization 字段

    GET /dir/index.html HTTP/1.0 Host: localhost Authorization: Digest username="Mufasa", real ...

  10. Deep Snake : 基于轮廓调整的SOTA实例分割方法,速度32.3fps | CVPR 2020

    论文提出基于轮廓的实例分割方法Deep snake,轮廓调整是个很不错的方向,引入循环卷积,不仅提升了性能还减少了计算量,保持了实时性,但是Deep snake的大体结构不够优雅,应该还有一些工作可以 ...