关键词：
说明
【Vue 开发实战】学习笔记。
发布到npm
具体可以参考我的这篇文章：怎么将自己写的库发布到npm上面？
这里具体介绍一下 nrm的使用
什么是 nrm
nrm 可以帮助您轻松快速地在不同的NPM注册表之间切换，现在包括:NPM, cnpm，taobao，nj(nodejitsu)。
npm install -g nrm
使用 nrm ls 可以查看注册列表
nrm ls
将注册表切换到CNPM
nrm use cnpm
更多用法：
Usage: nrm [options] [command]
Commands:
ls List all the registries
current Show current registry name
use <registry> Change registry to registry
add <registry> <url> [home] Add one custom registry
login <registry> [value] Set authorize information for a registry with a base64 encoded string or username and pasword
-a --always-auth Set is always auth
-u --username <username> Your user name for this registry
-p --password <password> Your password for this registry
-e --email <email> Your email for this registry
set-hosted-repo <registry> <value> Set hosted npm repository for a custom registry to publish packages
set-scope <scopeName> <value> Associating a scope with a registry
del-scope <scopeName> Remove a scope
set <registryName> Set custom registry attribute
-a --attr <attr> Set custorm registry attribute
-v --value <value> Set custorm registry value
del <registry> Delete one custom registry
rename <registryName> <newName> Set custom registry name
home <registry> [browser] Open the homepage of registry with optional browser
publish [<tarball>|<folder>] Publish package to current registry if current registry is a custom registry. The field 'repository' of current custom registry is required running this command. If you're not using custom registry, this command will run npm publish directly
-t --tag [tag] Add tag
-a --access <public|restricted> Set access
-o --otp [otpcode] Set otpcode
-dr --dry-run Set is dry run
test [registry] Show the response time for one or all registries
help Print this help
Options:
-h --help output usage information
-V --version output the version number
vue开发实战实战篇#46：如何做好组件的单元测试(代码片段)
说明【Vue开发实战】学习笔记。配置jest.config.js文件https://v1.test-utils.vuejs.org/zh/installation/#%E7%94%A8-jest-%E6%B5%8B%E8%AF%95%E5%8D%95%E6%96%87%E4%BB%B6%E7%BB%84%E4%BB%B6module.exports=//preset:"@v 查看详情
vue开发实战基础篇#8：如何触发组件的更新(代码片段)
说明【Vue开发实战】学习笔记。数据驱动数据来源（单向的）状态dataVS属性props状态是组件自身的数据属性是来自父组件的数据状态的改变未必会触发更新属性的改变未必会触发更新例子：index.vue代码<template><di... 查看详情
如何从0开发一个vue组件库并发布到npm
1、新建文件夹在终端打开执行npminit-y生成package.json如下,注意如果要发布到npm,name不能有下划线,大写字母等"name":"vuecomponentdi","version":"1.0.0","description":"","main&qu 查看详情
vue开发实战实战篇#34：如何在组件中使用echartsantv等其他第三方库(代码片段)
说明【Vue开发实战】学习笔记。效果这里我们使用echarts为例在项目里面添加echarts库安装依赖npmiechartsresize-detectorChart.vue<template><divref="chartDom"></div></template><script>import*asechartsf 查看详情
vue开发实战基础篇#13：如何优雅地获取跨层级组件实例（拒绝递归）(代码片段)
说明【Vue开发实战】学习笔记。ref引用信息递归查找代码繁琐.性能低效callbackref主动通知(setXxxRef)主动获取(getXxxRef)比如E节点更新就通知A组件，A组件进行ref的缓存即可组件A<template><divclass="border"><h1>A结... 查看详情
vue开发实战基础篇#3：vue组件的核心概念：事件(代码片段)
说明【Vue开发实战】学习笔记。事件vue提供了一个简单的方式进行绑定事件，就是使用@xxx就可以进行事件绑定，这里以click事件为例<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><meta... 查看详情
vue开发实战学习笔记48篇（完结）
说明【Vue开发实战】学习笔记。学习笔记代码仓库：https://github.com/kaimo313/vue-development-practice目录【Vue开发实战】基础篇#1：第一个Vue程序【Vue开发实战】基础篇#2：组件基础及组件注册【Vue开发实战】基础篇#3：Vue... 查看详情
vue开发实战拓展篇#48：结课测试和github相关生态应用持续集成单测覆盖率文档发布issue管理（完结）(代码片段)
说明【Vue开发实战】学习笔记。CI持续集成https://travis-ci.org/https://circleci.com/单测覆盖率https://codecov.io/https://coveralls.io/文档管理github.iogitee.iohttps://www.netlify.com/issue管理https://github.com/apps/close-issue-ap 查看详情
从零开始开发一个vue组件打包并发布到npm(把vue组件打包成一个可以直接引用的js文件)(代码片段)
自己写的组件有的也挺好的，为了方便以后用自己再用或者给别人用，把组件打包发布到npm是最好不过了，本次打包支持支持正常的组件调用方式，也支持Vue.use,也可以直接引用打包好的js文件，配合vue.js就不需要webpakc这种构建... 查看详情
vue开发实战实战篇#43：如何做好国际化(代码片段)
说明【Vue开发实战】学习笔记。LocaleProvider国际化为组件内建文案提供统一的国际化支持。https://1x.antdv.com/components/locale-provider-cnApp.vue配置<template><divid="app"><a-locale-provider:locale="local 查看详情
vue开发实战生态篇#23：组件库对比：elementuiantdesignvueiview
说明【Vue开发实战】学习笔记。ElementUI、AntDesignVue、iViewElementUIAntDesignVueiView数量单测admin背景原型、设计ElementUI4681%vue-element-admin(社区)饿了么Axure、SketchAntDesignVue5587%Pro(社区)社区主导、蚂蚁金服技术支持Axure、SketchiView54无iView-a 查看详情
vue开发实战基础篇#2：组件基础及组件注册(代码片段)
说明【Vue开发实战】学习笔记。组件通常把可拆分的html，以及拆分后的逻辑，样式组合在一起称之为组件。在Vue中，通过Vue.component定义（注册）一个组件：<!DOCTYPEhtml><htmllang="en"><head>... 查看详情
vue开发实战实战篇#44：如何高效地构建打包发布(代码片段)
说明【Vue开发实战】学习笔记。生成分析报告我们可以使用下面命令生成npmrunbuild----report执行完成之后就会在打包目录生成一个report.html文件分析报告文件打开这个htmlhttp://127.0.0.1:5500/ant-design-vue-pro/dist/report.html页面如下我们可以... 查看详情
vue开发实战实战篇#41：如何管理系统中使用的图标(代码片段)
说明【Vue开发实战】学习笔记。先在iconfont里新建一个项目然后将需要的图标添加入库：https://www.iconfont.cn/比如我的项目如下：全局注册图标组件https://1x.antdv.com/components/icon-cn/importVuefrom"vue";importAppfrom"./App.vue" 查看详情
vue开发实战基础篇#4：vue组件的核心概念：插槽(代码片段)
说明【Vue开发实战】学习笔记。插槽Vue实现了一套内容分发的API，这套API的设计灵感源自WebComponents规范草案，将<slot>元素作为承载分发内容的出口。匿名插槽<!DOCTYPEhtml><htmllang="en"><head><metacha... 查看详情
vue开发实战实战篇#33：更加精细化的权限设计（权限组件权限指令）(代码片段)
说明【Vue开发实战】学习笔记。效果实现两种方式实现权限组件的控制，比如下面两个地方的按钮控制，如果是user用户，就没有权限控制函数式组件<script>importcheckfrom'../utils/auth';exportdefaultfunctional:true,props:a... 查看详情
vue3.0开发公共组件库并发布到npm(代码片段)
...验证码的组件，后期会慢慢更新首先：：就是开发自己组件库第一步：新建一个vite–vue3.0的项目,依次执行一下命令。如果你要更新自己的vue版本为3.0就先执行这条命令，如果不需要则忽略npminstallvue@next安... 查看详情
vue开发实战基础篇#12：常用高级特性provide/inject(代码片段)
说明【Vue开发实战】学习笔记。组件通信provide/inject底层通用组件用的很多。进行跨组件通信。要实现组件E变化，更新F、I组件A<template><divclass="border"><h1>A结点（第一级）</h1><button@click&... 查看详情