vue怎么引入和配置使用element-ui框架

第一步,利用vue-cli脚手架工具创建一个vue项目,创建好的文件目录,如下图。


第二步,找到官方文档,找到使用npm安装的方法,然后打开命令行工具,指定到项目路径,输入【npm i element-ui -S】,如下图



第三步,安装好,如下图【element-ui】后,在项目中【src】目录下找到【main.js】,在一下位置添加【import ElementUI from 'element-ui';】【import 'element-ui/lib/theme-chalk/index.css';】,详细如下图


第四步,引入后,在【main.js】下面写多以下代码【Vue.use(ElementUI);】,意思是,vue使用了element-ui,详细如下图


第五步,可以使用element-ui里面的组件了,在element-ui官网随便找一个按钮的样式,复制代码进去页面就可以使用了,如下图


第六步,在页面中复制代码,如下图


第七步,使用【npm run dev】运行项目,然后就可以查看详细页面效果了,如下图


©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容