0.1.1 • Published 4 years ago
vue3
Project setup
npm install
Compiles and hot-reloads for development
npm run serve
Compiles and minifies for production
npm run build
Run your unit tests
npm run test:unit
Lints and fixes files
npm run lint
Customize configuration
See Configuration Reference.
vue两大核心 组件与数据驱动
插件一般会建一个plugins文件夹 里面有组件文件夹(放组件)和一个入口文件index.js
在main.js 全局注册插件
plugin里面的index.js 注释的部分是一般的写法
ps: 组件通信 父传子数据 :属性 props 父调用子方法$refs 子调用父方法并传值: $emit
把插件上传到npmjs上
在package.json 文件中的
"name" 就是上传到npmjs之后的name 这个插件叫什么比如vue-router
"private" 私有要改为false 共有
"license": "MIT" 开源协议
"description": "我是插件的描述"
在script里面添加打包命令
"lib":"vue-cli-service build --target lib --name vue-plugin-msg-textjsy --dest lib src/plugin/index.js"
--target lib(打包到lib文件夹)
--name vue-plugin-msg-textjsy(插件的名字)
--dest lib src/plugin/index.js(你插件的入口文件)
之后运行npm run lib
"main":"lib/vue-plugin-msg-textjsy.umd.min.js",一定要写这个入口文件vue-plugin-msg-textjsy.umd.min.js是运行 npm run lib后生成
PS:当写插件的时候最好在一个空的新建项目里面写
在终端上输入 npm login 输入自己的npmjs账号密码
登陆成功后在输入 npm publish
carrkim 是我的账号
这个readme文件会在npmjs里面体现
在实际应用中要在main.js引入样式 import 'vue-plugin-msg-textjsy/lib/vue-plugin-msg-textjsy.css'