什么是vue插件，vue插件怎么使用？

插件通常用来为 Vue 添加全局功能。插件的功能范围没有严格的限制——一般有下面几种：

通过全局方法 Vueuse() 使用插件。它需要在你调用 new Vue() 启动应用之前完成：

为防止 多次注册同一个插件： 我们可以传递一个可选的对象

Vueuse 会自动阻止多次注册相同插件，届时即使多次调用也只会注册一次该插件。

Vuejs 官方提供的一些插件 (例如 vue-router) 在检测到 Vue 是可访问的全局变量时会自动调用 Vueuse()。然而在像 CommonJS 这样的模块环境中，你应该始终显式地调用 Vueuse()：

本节我们将介绍 Vue 的插件。包括什么是插件、如何使用插件、如何编写一个简单的插件。其中，编写和使用插件是本节的重点。本节我们将带领大家写一个简单的插件示例，同学们在学完本节后可以尝试编写其他的插件来加深学习。

Vue 插件是对 Vue 全局功能的扩展，他可以给 Vue 添加全局方法、属性、组件、过滤器、指令等等。

通过全局方法 Vueuse () 使用插件。它需要在你调用 new Vue () 启动应用之前完成：

也可以传入一个可选的选项对象：

Vueuse 会自动阻止多次注册相同插件，即使多次调用也只会注册一次该插件。 Vuejs 官方提供的一些插件 (例如 vue-router) 在检测到 Vue 是可访问的全局变量时会自动调用 Vueuse ()。然而在像 CommonJS 这样的模块环境中，你应该始终显式地调用 Vueuse ()：

awesome-vue 集合了大量由社区贡献的插件和库。

Vuejs 的插件应该暴露一个 install 方法。这个方法的第一个参数是 Vue 构造器，第二个参数是一个可选的选项对象：

接下来，我们写一个具体的插件示例：

实例演示

"运行案例" 可查看在线运行效果

代码解释： JS 代码第 3-20 行，我们定义了插件 MyPlugin，该插件中包含一个全局组件 MyButton。 JS 代码第 22 行，通过 Vueuse 使用 MyPlugin。 HTML 代码第 2、4、6、8、10 行，使用 MyPlugin 插件中的 MyButton 组件。

本节，我们带大家学习了 Vue 插件的使用方式。主要知识点有以下几点：

有的丢失,那是因为vue会把转成base64,但是大小超过阈值就不转了,直接引,而背景里用的是相对路径最后会直接替换成static,但是明显至于为什么背景图有的打包后存在，有的丢失，那是因为vue会把转成base64,但是大小超过阈值就不转了，直接引，而背景里用的是相对路径最后会直接替换成static，但是明显路径会有问题，所以得配置下。
修改 需要在上面红框中添加下面语句：
// 背景丢失：写改css中的路径(添加)
publicPath: '//'

然后重新npm run dev即可

1 使用媒体查询，在样式文件中添加媒体查询，根据不同的设备宽度设置不同的样式；
2 使用flexiblejs，自动根据设备宽度调整根元素的font-size，从而实现移动端适配；
3 使用vw单位，将元素的宽度和高度设置为vw单位，从而实现移动端适配；
4 使用lib-flexible，自动根据设备宽度调整根元素的font-size，从而实现移动端适配。

通常情况下，很多后台管理界面需要有好几套颜色的主题，我们的Vue项目已经集成了ElementUI，本来也支持主题定制，ElementUI使用了Sass开发样式，因此自定义样式也是很方便的。

参考： >