vue组件发布到npm简单步骤


Posted in Javascript onNovember 30, 2017

1.0 新建项目

1.1 初始化项目
输入npm init,之后需要填什么就写什么

新建src目录,并在src目录下新建alert.vue

$ npm init
$ mkdir src
$ cd src
$ touch alert.vue

vue组件发布到npm简单步骤

最后的目录结构

vue组件发布到npm简单步骤

1.2 修改入口文件

打开package.json,并修改

vue组件发布到npm简单步骤

1.3 写组件内容

这个组件内容可以随便写,我们就先测试一下,我是这样写的

<template>
  <div class="alert">
    <div>dddddd</div>
  </div>
</template>

<style>
  .alert {
    color: red;
  }
</style>

<script>

export default {
  name:'vue-x-alert'
}

</script>

2.0 注册npm

打开npm官网,注册,并记住注册的账号和密码,npm-url

2.1 登录npm,并发布

$ npm login // 登录
$ npm publish

vue组件发布到npm简单步骤

2.3 打开npm,看我们刚刚发布的组件

vue组件发布到npm简单步骤

然后我们要在项目中使用到这个组件,进行npm安装,导入就可以使用了

更新包

修改package.json

"version": "1.1.0",

然后重新发布一下,就可以了

Javascript 相关文章推荐
Javascript执行效率全面总结
Nov 04 Javascript
深入剖析JavaScript中的枚举功能
Mar 06 Javascript
jquery中ajax使用error调试错误的方法
Feb 08 Javascript
js面向对象之公有、私有、静态属性和方法详解
Apr 17 Javascript
Bootstrap基础学习
Jun 16 Javascript
JS实现生成会变大变小的圆环实例
Aug 05 Javascript
jquery调整表格行tr上下顺序实例讲解
Jan 09 Javascript
jquery 点击元素后,滚动条滚动至该元素位置的方法
Aug 05 Javascript
微信小程序 wx.request(接口调用方式)详解及实例
Nov 23 Javascript
vue单页面应用打开新窗口显示跳转页面的实例
Sep 21 Javascript
微信小程序自定义菜单切换栏tabbar组件代码实例
Dec 30 Javascript
原生js实现自定义滚动条组件
Jan 20 Javascript
JS和JQuery实现雪花飘落效果
Nov 30 #jQuery
vue 添加vux的代码讲解
Nov 30 #Javascript
vue2.x+webpack快速搭建前端项目框架详解
Nov 30 #Javascript
Vue+Vux项目实践完整代码
Nov 30 #Javascript
Bootstrap Table 搜索框和查询功能
Nov 30 #Javascript
微信小程序实现简单input正则表达式验证功能示例
Nov 30 #Javascript
微信小程序实现获取自己所处位置的经纬度坐标功能示例
Nov 30 #Javascript
You might like
PHP 高手之路(一)
2006/10/09 PHP
常用的php ADODB使用方法集锦
2008/03/25 PHP
php下检测字符串是否是utf8编码的代码
2008/06/28 PHP
解析在PHP中使用全局变量的几种方法
2013/06/24 PHP
Swoole实现异步投递task任务案例详解
2019/04/02 PHP
TP3.2框架分页相关实现方法分析
2020/06/03 PHP
很酷的javascript loading效果代码
2008/06/18 Javascript
JavaScript delete操作符应用实例
2009/01/13 Javascript
学习ExtJS table布局
2009/10/08 Javascript
JS 类型转换常见方法小结
2010/05/31 Javascript
javascript模拟评分控件实现方法
2015/05/13 Javascript
js实现搜索框关键字智能匹配代码
2020/03/26 Javascript
node.js连接MongoDB数据库的2种方法教程
2017/05/17 Javascript
js中url对象化管理分析
2017/12/29 Javascript
vue采用EventBus实现跨组件通信及注意事项小结
2018/06/14 Javascript
使用微信小程序开发弹出框应用实例详解
2018/10/18 Javascript
微信小程序wx.request的简单封装
2019/11/13 Javascript
vue3.0中使用postcss-pxtorem的具体方法
2019/11/20 Javascript
vue接通后端api以及部署到服务器操作
2020/08/13 Javascript
基于Python和Scikit-Learn的机器学习探索
2017/10/16 Python
python smtplib发送带附件邮件小程序
2018/05/22 Python
Python实现监控键盘鼠标操作示例【基于pyHook与pythoncom模块】
2018/09/04 Python
Flask框架模板渲染操作简单示例
2019/07/31 Python
flask框架json数据的拿取和返回操作示例
2019/11/28 Python
jupyter notebook 实现matplotlib图动态刷新
2020/04/22 Python
python求解汉诺塔游戏
2020/07/09 Python
详解Python流程控制语句
2020/10/28 Python
英国标准协会商店:BSI Shop
2019/02/25 全球购物
.NET概念性的面试题
2012/02/29 面试题
党员领导干部廉洁从政承诺书
2014/03/27 职场文书
小学一年级学生评语大全
2014/12/25 职场文书
党风廉正建设责任书
2015/01/29 职场文书
2015年教师党员个人总结
2015/11/24 职场文书
职场新人刚入职工作总结该怎么写?
2019/05/15 职场文书
redis三种高可用方式部署的实现
2021/05/11 Redis
浅谈Python从全局与局部变量到装饰器的相关知识
2021/06/21 Python