开发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 ...
随机推荐
- Visual Studio UI Automation 学习(二)
今天恰好有时间,继续学习了一下UI Automation的知识.看了两篇博客,对UI Automation有了进一步的了解. https://blog.csdn.net/qq_37546891/art ...
- Android使用NDK---函数参数传递-基本类型和数组
参考链接:http://www.cnblogs.com/luxiaofeng54/archive/2011/08/19/2145486.html 数据传输可分为 基本数据类型传输 和 引用数据类型的传 ...
- Repeater + 分页控件 AspNetPager 研究
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs ...
- 【udacity】机器学习-knn最近邻算法
Evernote Export 1.基于实例的学习介绍 不同级别的学习,去除所有的数据点(xi,yi),然后放入一个数据库中,下次直接提取数据 但是这样的实现方法将不能进行泛化,这种方式只能简单的 ...
- PAT_A1138#Postorder Traversal
Source: PAT A1138 Postorder Traversal (25 分) Description: Suppose that all the keys in a binary tree ...
- Oracle开发常用函数 max 最大数 自动加 1
max 最大数 自动加 1 create or replace function fun_getmaxlot( vend in varchar2 , domain IN VARCHAR2, tag i ...
- php第六讲
继承和静态 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...
- C#第九节课
try catch using System;using System.Collections.Generic;using System.Linq;using System.Text;using Sy ...
- Hexo系列(五) 撰写文章
在利用 Hexo 框架搭建一个属于我们自己的博客网站后,下面我们就来谈谈怎样在网站上书写我们的第一篇博客吧 一.创建文章 在站点文件夹中打开 git bash,输入如下命令创建文章,其中 title ...
- C#学习笔记_04_流程控制
04_流程控制 程序的执行结构: 顺序结构 分支结构 循环结构 可以通过某些特定的控制语句来控制代码的执行结构 分支流程控制 if else 基本语法 可以只有if没有else,但是不能没有if只有e ...