详解如何创建并发布一个 vue 组件
2018-12-20 09:08
1271 查看
步骤
创建 vue 的脚手架
npm install -g @vue/cli vue init webpack
绑定 git 项目
cd existing_folder git init git remote add origin http://gitlab.alipay-inc.com/ampg/my-projec.git git add . git commit git push -u origin master
写组件
创建组件 src/components/xxx.vue
例如:
<template> <div class="hello"> <h1>{{ msg }}</h1> <h2>Essential Links</h2> </div> </template> <script> export default { name: 'HelloWorld', data () { return { msg: 'Welcome to Your Vue.js App' } } } </script> <!-- Add "scoped" attribute to limit CSS to this component only --> <style scoped> h1, h2 { font-weight: normal; } </style>
发布
npm publish
展示
代码参考
vue-component-popup
参考文档
Packaging Vue Components for npm
Vue CLI 3
vue-sfc-rollup
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
您可能感兴趣的文章:
相关文章推荐
- 详解如何制作并发布一个vue的组件的npm包
- 如何创建一个Android原生的react-native组件(一)
- 如何创建一个UICollectionView之使用详解
- java如何创建一个jdbc程序详解
- 详解如何将angular-ui的图片轮播组件封装成一个指令
- 如何创建一个依赖Android AAR文件的React Native组件
- 如何为Go程序创建一个最小的Docker Image详解
- 如何用 Bash 创建一个二进制发布包
- 如何创建一个android的react-native组件(二)
- 02.26 创建一个vue组件
- 通过Visual C#创建一个Windows组件,然后把其接口以COM形式发布即可(转贴)
- webstorm如何创建一个代码模板?以创建vue代码模板为例
- 详解Vue用自定义指令完成一个下拉菜单(select组件)
- 10vue组件入门_如何写一个最简单的vue组件_vue组件的作用是啥
- 如何创建一个UITableView(步骤详解 没有任何编程基础都能学会 )
- 详解Vue-cli 创建的项目如何跨域请求
- Vue一个案例引发的递归组件的使用详解
- 如何在Node.js中使用npm创建和发布一个模块
- 如何实现一个简单的Vue移动端组件库
- FLEX如何动态创建DataGrid组件详解