开发vue插件并发布到npm包管理工具的流程
1-10是开发流程,后面的是发布流程
1. 在Git里面…新建项目

2. 克隆项目到本地用来开发
git clone https://github.com/***/vue-prevent-browser-back.git
3. 运行命令行,初始化项目,生成package.json
npm init –y
4. npm install 安装包
5. 在安装vue-cli的情况下执行
vue-init webpack-simple创建项目结构

6. 删除多余文件 index.html清空src文件夹内容

7. 把插件内容复制到src

8. 修改package.json配置内容


9. 修改webpack.config.js的output部分配置


10. 打包输出插件 npm run build
有的插件不需要打包直接把代码复制到dist文件就好了

11. 去注册npm账号
12. 发布前要配置要发布的内容,要不会把各种乱七八糟的文件都发布了
a. 使用 .npmignore 设置忽略哪些文件
如果项目没有使用 git或者 没有 .gitignore 文件, 那么可以添加 .npmignore 文件来设置忽略哪些文件,.npmignore 的写法跟 .gitignore 的规则完全一样。 需要注意的是如果同时使用了 .npmignore 和 .gitignore 的话, 只有 .npmignore 会生效, 优先级比较高。
b. 使用 package.json 的 files 字段选择发布哪些文件
上面两种方式都是设置忽略哪些文件, 有时可能只想发布编译打包后的几个文件或者目录, 如果按照上面的设置会很麻烦, 这是可以直接在 package.json 中 files 字段设置发布哪些文件或目录, 这样的话, 只有这些目录或文件才会被publish.
同时需要说明的是这里的优先级是高于 .npmignore 和 .gitignore 的。
c. npm默认带了一些规则
除了上面的规则外, npm还有一些内置的规则,会被自动忽略的文件有

node_modules下的所有文件也会被忽略。另外还有一部分文件会被包含, 即便设置忽略也无效, 这些文件有

黑名单模式:.npmignore文件,没有.npmignore情况下使用.gitignore文件。
白名单模式:package.json里边配置files字段


13. 发布 先登录 然后版本号必须跟之前发布的不一样才可以

14. 登录npm: npm login

15. 发布:npm publish

遇到的问题:
1. npm ERR! you must verify your email before publishing a new package: https:/
就是没有通过验证就发包 结果报错了
得通过邮件验证下
2 . npm err You must be logged in to publish packages. : vue-prevent-browser-back
解决:包名被占用,package.json改一个。
开发vue插件并发布到npm包管理工具的流程的更多相关文章
- nodeJS---模块与npm包管理工具
nodeJS---模块与npm包管理工具 一:从模块外部访问另一个模块内的成员; 假如我现在还在D盘中的node文件夹内中的app.js代码改成如下: var msg = 'hello'; var f ...
- NPM 包管理工具详解,使用教程
NPM 包管理工具 1.1 定义:什么是 NPM NPM 全称 Node Package Manager,它是 JavaScript 的包管理工具, 并且是 Node.js 平台的默认包管理工具.通过 ...
- Node.js权威指南 (4) - 模块与npm包管理工具
4.1 核心模块与文件模块 / 574.2 从模块外部访问模块内的成员 / 58 4.2.1 使用exports对象 / 58 4.2.2 将模块定义为类 / 58 4.2.3 为模块类定义类变量或类 ...
- Node.js之包与npm包管理工具
Node.js之包与npm包管理工具 1.Node.js中的包 1.1在一个包中包含如下内容: package.json:对包进行描述 在bin子目录中存放二进制文件 在lib子目录中存放JavaSc ...
- node.js中npm包管理工具
现在安装node.js,默认就会帮我们装上了npm包管理工具,npm主要用来下载,安装,管理第三方模块. 创建一个包描述文件: npm init [-y] 查看包的信息 npm info <pa ...
- Nodejs-内置核心模块&npm包管理工具
1.核心模块的意义 如果只是在服务器运行JavaScript代码,其实意义不大(浏览器就可以解决)因为无法实现功能(读写文件,访问网络) Node的用处在于本身还提供了一系列的功能模块,用于与操作系统 ...
- NodeJS 中npm包管理工具
NPM 使用介绍 NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种: 允许用户从NPM服务器下载别人编写的第三方包到本地使用. 允许用户从 ...
- npm包管理工具在一般项目中的应用方法
最近自己在有时间,在通学一些知识点,记录一下,以便以后使用方面 当我们在做项目的时候,如果需要到包管理工具,那么我们一定会经历以下流程: 1.首先在官网下载node.js,然后默认安装到C盘 检查是否 ...
- node.js开发 npm包管理工具
npm介绍 说明:npm(node package manager)是nodejs的包管理器,用于node插件管理(包括安装.卸载.管理依赖等) 使用npm安装插件:命令提示符执行npm instal ...
随机推荐
- 分布式机器学习框架:MxNet
MxNet官网: http://mxnet.readthedocs.io/en/latest/ 前言: caffe是很优秀的dl平台.影响了后面很多相关框架. cxxnet借鉴了很多caffe的思想. ...
- ubuntu操作系统的目录结构
/:根目录,是所有目录的绝对路径的起始点.一般根目录下只存放目录,不要存放文件,/etc./bin./dev./lib./sbin应该和根目录放置在一个分区中 /bin (类似的还有/usr/bin) ...
- 08--MOOC--C/C++ 根据年月日计算星期几
计算任何一天是星期几的几种算法 一:常用公式 W = [Y-1] + [(Y-1)/4] - [(Y-1)/100] + [(Y-1)/400] + D Y是年份数,D是这一天在这一年中的累积天数,也 ...
- js手机移动端选择插件 mobileSelect.js
一.mobileSelect获取方法 mobileSelect支持单选.多级联动.自定义回调函数.二次渲染.最新版本下载地址[2017-09-21更新]: https://github.com/onl ...
- struts 2 action result类型
最近在管理公司老项目的时候发现如下代码: <bean name="detailPlayer" class="PlayAction" method=&quo ...
- 【JavaScript框架封装】使用原生js封装的类似于JQuery的框架及核心源码分享(多文件版本)
这个版本的JQuery是对上一个版本的JQuery,使用了require.js进行了二次封装,基本上把前面的每一个框架封装成为一个单独的模块,最终的目录结构如下: 由于代码量和目录比较多,这个封装好的 ...
- 文件元数据、文件夹操作(day08)
一.获取文件的元数据(meta data) 通过read write可以对文件的内容进行读写. 但是今天我们要操作的是文件的元数据(文件的属性信息) day08$ls -l hello -rw-rw- ...
- SQL中IS NOT NULL与!=NULL的区别
平时经常会遇到这两种写法:IS NOT NULL与!=NULL.也经常会遇到数据库有符合条件!=NULL的数据,但是返回为空集合.实际上,是由于对二者使用区别理解不透彻. 默认情况下,推荐使用 IS ...
- 20.基于es内部_version进行乐观锁并发控制
- 强大的jQuery图片查看器插件Viewer.js
简介 Viewer.js 是一款强大的图片查看器 Viewer.js 有以下特点: 支持移动设备触摸事件 支持响应式 支持放大/缩小 支持旋转(类似微博的图片旋转) 支持水平/垂直翻转 支持图片移动 ...