【前提】

1、安装webpack   　　 cnpm install webpack -g

2、安装vue/vue-cli   　　cnpm install vue vue-cli -g

3、初始化vue  　　　　vue init webpack + 项目名称

4、在项目目录文件夹下运行 cnpm run dev ，如果没有问题，则进行安装ElementUI

【安装ElementUI】

cnpm install element-ui -s

【引入Element-UI】

在main.js中引入Element-UI

【创建.vue文件】

【在App.vue中引入.vue文件,并进行注册】

【使用cnpm run dev开启访问】

【浏览器访问localhost:8080】

 

如何在Vue项目中使用Element组件的更多相关文章

  1. 如何在vue项目中引入elementUI组件

    个人博客同步文章 https://mr-houzi.com/2018/02/... 前提:已经安装好Vue 初始化vue vue init webpack itemname 运行初始化demo 运行一 ...

  2. 如何在Vue项目中使用Typescript

    0.前言 本快速入门指南将会教你如何在Vue项目中使用TypeScript进行开发.本指南非常灵活,它可以将TypeScript集成到现有的Vue项目中任何一个阶段. 1.初始化项目 首先,创建一个新 ...

  3. 如何在VUE项目中添加ESLint

    如何在VUE项目中添加ESLint 1. 首先在项目的根目录下 新建 .eslintrc.js文件,其配置规则可以如下:(自己小整理了一份),所有的代码如下: // https://eslint.or ...

  4. 如何在Vue项目中给路由跳转加上进度条

    1.前言 在平常浏览网页时,我们会注意到在有的网站中,当点击页面中的链接进行路由跳转时,页面顶部会有一个进度条,用来标示页面跳转的进度(如下图所示).虽然实际用处不大,但是对用户来说,有个进度条会大大 ...

  5. 如何在Vue项目中，通过点击DOM自动定位VScode中的代码行？

    作者:vivo 互联网大前端团队- Youchen 一.背景 现在大型的 Vue项目基本上都是多人协作开发,并且随着版本的迭代,Vue 项目中的组件数也会越来越多,如果此时让你负责不熟悉的页面功能开发 ...

  6. 解决vue项目中遇到父组件的按钮或操作控制重新挂载子组件但是子组件却无效果的情况

    在vue项目中终会遇到需要父组件的按钮或操作控制重新挂载子组件的需求,我在新项目中就遇到这种需求.真实场景是父组件的早,中,晚三个按钮(代表三个时间段)来控制子组件的table表格列的动态加载. 子组 ...

  7. 转：如何在Vue项目中使用vw实现移动端适配

    https://www.w3cplus.com/mobile/vw-layout-in-vue.html 有关于移动端的适配布局一直以来都是众说纷纭,对应的解决方案也是有很多种.在<使用Flex ...

  8. 如何在Vue项目中引入jQuery?

    假设你的项目由vue-cli初始化 (e.g. vue init webpack my-project). 在你的vue项目目录下执行: npm install jquery --save-dev 打 ...

  9. 如何在Vue项目中使用vw实现移动端适配(转)

    有关于移动端的适配布局一直以来都是众说纷纭,对应的解决方案也是有很多种.在<使用Flexible实现手淘H5页面的终端适配>提出了Flexible的布局方案,随着viewport单位越来越 ...

随机推荐

  1. 2019/11/8 CSP模拟

    T1 药品实验 内网#4803 由概率定义,有\[a + b + c = 0\] 变形得到\[1 - b = a + c\] 根据题意有\[p_i = a p _{i - 1} + b p_i + c ...

  2. 数据结构C++版-线性表

    PS:资料来源慕课网视频. 一.什么是线性表 线性表是n个数据元素的有限序列. 分类: 二.补充知识点 1.栈和队列有出操作.入操作,对应线性表(数组)为插入元素和删除元素,而线性表中要获取指定元素值 ...

  3. Java-Class-C：java.util.ArrayList

    ylbtech-Java-Class-C:java.util.ArrayList 1.返回顶部 1.1. import java.util.ArrayList;import java.util.Lis ...

  4. ionic-CSS：ionic 列表

    ylbtech-ionic-CSS:ionic 列表 1.返回顶部 1. ionic 列表 列表是一个应用广泛的界面元素,在所有移动app中几乎都会使用到. 列表可以是基本文字.按钮,开关,图标和缩略 ...

  5. jquery判断对象是undifined，判断对象是null

    判断对象是undifined: var aaa = undefined; if (typeof(aaa) == "undefined") { ... } typeof 返回的是字符 ...

  6. maven-dependencyManagement和dependencies区别

    在多模块的maven项目中,如果各个子项目的依赖包相同但版本不同的话,对于测试.发布和管理非常困难 dependencyManagement就是起统一版本作用的一个标签,好处有2,一是统一版本,二是子 ...

  7. 记一次java简单的if语句使用多态重构

    场景描述: 一个controller中,部门领导有布置任务,查看任务整体情况,查看部门成员,查看部门成员完成情况,导出任务详情,如下: @RestController @RequestMapping( ...

  8. WebApi的Swagger多版本控制实现

    WebApi + Swagger2.0接口文档多版本控制设计实现 最近前后端分离的项目越来越多,API的对接对于前后端开发交流得最多的一块内容,一个好的API文档生成工具就显得非常重要,选取了Swag ...

  9. .Net串口通讯中的若干问题（C#多串口硬件识别、热插拔、Close方法报错问题、IsOpen的可靠性问题）

    一.需求场景 最近有时间静下心来研究SDK,串口通讯的.要求实现识别cp210x和cp2303驱动的两款硬件,并且2303的优先级高,即有2303识别之,没有再识别210x:要求实现热插拔,拔掉自动断 ...

  10. wish - 简单的窗口式(windowing) shell

    总览 wish [filename] [arg] [arg ...] 选项 -colormap new 指定窗口使用一个新的私有的调色板(colormap)而不使用给屏幕的缺省的调色板. -displ ...