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账号

   https://www.npmjs.com/

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包管理工具的流程的更多相关文章

  1. nodeJS---模块与npm包管理工具

    nodeJS---模块与npm包管理工具 一:从模块外部访问另一个模块内的成员; 假如我现在还在D盘中的node文件夹内中的app.js代码改成如下: var msg = 'hello'; var f ...

  2. NPM 包管理工具详解,使用教程

    NPM 包管理工具 1.1 定义:什么是 NPM NPM 全称 Node Package Manager,它是 JavaScript 的包管理工具, 并且是 Node.js 平台的默认包管理工具.通过 ...

  3. Node.js权威指南 (4) - 模块与npm包管理工具

    4.1 核心模块与文件模块 / 574.2 从模块外部访问模块内的成员 / 58 4.2.1 使用exports对象 / 58 4.2.2 将模块定义为类 / 58 4.2.3 为模块类定义类变量或类 ...

  4. Node.js之包与npm包管理工具

    Node.js之包与npm包管理工具 1.Node.js中的包 1.1在一个包中包含如下内容: package.json:对包进行描述 在bin子目录中存放二进制文件 在lib子目录中存放JavaSc ...

  5. node.js中npm包管理工具

    现在安装node.js,默认就会帮我们装上了npm包管理工具,npm主要用来下载,安装,管理第三方模块. 创建一个包描述文件: npm init [-y] 查看包的信息 npm info <pa ...

  6. Nodejs-内置核心模块&npm包管理工具

    1.核心模块的意义 如果只是在服务器运行JavaScript代码,其实意义不大(浏览器就可以解决)因为无法实现功能(读写文件,访问网络) Node的用处在于本身还提供了一系列的功能模块,用于与操作系统 ...

  7. NodeJS 中npm包管理工具

    NPM 使用介绍 NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种: 允许用户从NPM服务器下载别人编写的第三方包到本地使用. 允许用户从 ...

  8. npm包管理工具在一般项目中的应用方法

    最近自己在有时间,在通学一些知识点,记录一下,以便以后使用方面 当我们在做项目的时候,如果需要到包管理工具,那么我们一定会经历以下流程: 1.首先在官网下载node.js,然后默认安装到C盘 检查是否 ...

  9. node.js开发 npm包管理工具

    npm介绍 说明:npm(node package manager)是nodejs的包管理器,用于node插件管理(包括安装.卸载.管理依赖等) 使用npm安装插件:命令提示符执行npm instal ...

随机推荐

  1. 浅谈Java三大框架与应用

    前言:对于一个程序员来说,尤其是在java web端开发的程序员,三大框架:Struts+Hibernate+Spring是必须要掌握熟透的,因此,下面谈谈java三大框架的基本概念和原理. JAVA ...

  2. es7 class的写法

    再看vue-router源码的时候(代码链接)看到这样的代码片段: export default class VueRouter { app: any; apps: Array<any>; ...

  3. revit二次开发之族的类型参数与实例参数的转换

    1背景小伙伴在做revit二次开发的时候,可能需要在族环境中将族的类型参数与实例参数相互转换. 2思路1.使用族管理器FamilyManager,参见注释12.首先获取需要转换的参数(单个与批量),参 ...

  4. 关于计算文字显示占用画面大小(System.Drawing.Graphics.MeasureString)

    最近遇到了一个需要手动为显示文字换行的场合,网上转了一圈,最后形成了下面的代码: var font = new Font("微软雅黑", 9F); - DETAIL_BASE_IN ...

  5. PAT_A1132#Cut Integer

    Source: PAT A1132 Cut Integer (20 分) Description: Cutting an integer means to cut a K digits lone in ...

  6. python 从给定的URL中提取顶级域名(TLD)

    安装 PyPI的最新稳定版本: pip install tld 或者GitHub的最新稳定版本: pip install https://github.com/barseghyanartur/tld/ ...

  7. python PIL图像处理-框选

    框选图中位置 代码 from PIL import Image,ImageDraw,ImageFont,ImageFilter import random #--------------------- ...

  8. 分布式系列文章 —— 从 ACID 到 CAP / BASE

    转自:https://mp.weixin.qq.com/s?amp;mid=2652037708&__biz=MzI0NDI0MTgyOA%3D%3D&idx=1&chksm= ...

  9. BZOJ 4567 [SCOI2016]背单词 (Trie树、贪心)

    题目链接: https://www.lydsy.com/JudgeOnline/problem.php?id=4567 题解: 显然答案一定小于\(n\times n\), 字符串倒过来变成前缀建Tr ...

  10. 在win7下,easyphp安装过程中MSVCR110.DLL没有被指定在WINDOWS上运行,或者它包含错误

    这是安装easyphp后启动时出现的错误界面.查网上一大堆说法,基本上p用没有.真正解决的办法去m$站点 http://www.microsoft.com/zh-CN/download/details ...