vue打包放到java中启动_自定义Vue组件打包、发布到npm以及使用

本文将帮助：将自己写的Vue组件打包到npm进行代码托管，以及正常发布之后如何使用自己的组件。

本文讲述的仅仅是最基础的实现，其他复杂的操作需要非常熟悉webpack的相关知识，作者将继续学习。

按照大佬文中写的一步步操作，够细心的话基本可以一步到位。下面总结一下发布步骤：

1. 利用Vue的脚手架新建一个简易版的Vue项目my-project：

vue init webpack-simple my-project -> cd my-project -> npm i -> npm run dev

2. 编写组件：

src下新建myPlugin文件夹用于存放所以开发的组件 -> 为每一个组件创建一个文件夹，其中存放一个vue组件文件和一个index.js配置文件 -> 在myPlugin下的最外层创建一个入口配置文件 ->为每个人vue组件文件中加上一个name属性

3. 测试组件：

在app.vue中测试一下自己的组件可不可以用

4. 编写配置文件

为刚刚加入的每个组件文件夹中的index.js放入如下代码：(其中ldcPagination为组件名)

import ldcPagination from './index.vue';

ldcPagination.install = Vue => Vue.component(ldcPagination.name, ldcPagination);//.name就是开始说的vue文件暴露出来的name名，ldcPagination整个组件

export default ldcPagination;

为myPlugin下index.js放入如下代码：(其中ld