网络编程 
首页 > 网络编程 > 浏览文章

在vue项目中引入vue-beauty操作方法

(编辑:jimmy 日期: 2024/11/29 浏览:3 次 )

vue-beauty有丰富的vue组件库,使用vue-beauty方便项目的开发,下面介绍在vue项目中引入vue-beauty。

1、vue项目初始化

npm install --global vue-cl:全局安装vue脚手架vue init webpack my-projec:初始化cd my-project:进入目录npm install:安装依赖

在vue项目中引入vue-beauty操作方法

2、安装vue-beauty

在vue项目中引入vue-beauty操作方法

3、查看配置文件package.json,是否有vue-beauty组件的版本号

在vue项目中引入vue-beauty操作方法

4、在main.js中引入

以下代码便完成了 vue-beauty 的引入

import 'vue-beauty/package/style/vue-beauty.min.css'import vueBeauty from 'vue-beauty'Vue.use(vueBeauty)

在vue项目中引入vue-beauty操作方法

5、还可以按需引入

当你只需要整个组件库中的几个的时候可以使用下面的方法引入

在vue项目中引入vue-beauty操作方法

6、在项目中使用组件vue-beauty组件,我们以button组件为例:

在vue项目中引入vue-beauty操作方法

7、查看效果

可以看到我们成功的使用了vue-beauty组件库

在vue项目中引入vue-beauty操作方法

上一篇:如何利用ES6进行Promise封装总结
下一篇:Vue表单控件绑定图文详解
友情链接:杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网 网站地图 SiteMap