webpack+vue2.x+element-ui

作者:狐狸家的鱼

本文链接:vue2.x引入Element-ui

GitHub:sueRimn

1、新建项目

vue init webpack vue-elementUi //vue-elementUi是项目名
cd vue-elementUi //进入项目文件
npm install //安装依赖
npm run dev //启动项目

2、安装Loader模块

 npm install style-loader -D
npm install css-loader -D
npm install file-loader -D

3、安装Element-ui框架

npm install element-ui --save

4、修改webpack.base.conf.js

在配置里添加这些代码:

{
test: /\\\\\\\\.css$/,
loader: "style!css"
},
{
test: /\\\\\\\\.(eot|woff|woff2|ttf)([\\\\\\\\?]?.*)$/,
loader: "file"
}

5、引入Element-ui

打开项目,找到src/main.js目录,添加如下代码

import Element from 'element-ui
import 'element-ui/lib/theme-chalk/index.css' Vue.use(Element)

6、测试

<el-button type="primary">主要按钮</el-button>
<el-button type="text">文字按钮</el-button>

 

vue学习笔记(三)- vue2.x引入Element-ui的更多相关文章

  1. vue学习笔记(三)class和style绑定

    前言 通过上一章的学习vue学习笔记(二)vue的生命周期和钩子函数,我们已经更近一步的知道了关于vue的一些知识,本篇博客将进一步探讨vue其它方面的内容,vue中关于class和style绑定,关 ...

  2. Vue学习笔记三:v-bind,v-on的使用

    目录 v-bind:绑定属性值,内容相当于js,缩写: v-on:绑定方法,缩写@ 总结 v-bind:绑定属性值,内容相当于js,缩写: 我添加了一个input标签,如下 <input typ ...

  3. VUE 学习笔记 三 模板语法

    1.插值 a.文本 数据绑定最常见的形式就是使用“Mustache”语法 (双大括号) 的文本插值 <span>Message: {{ msg }}</span> v-once ...

  4. vue学习笔记(三):vue-cli脚手架搭建

    一:安装vue-cli脚手架: 1:为了确保你的node版本在4.*以上,输入 node -v 查看本机node版本,低于4请更新. 2:输入:  npm install -g vue-cli     ...

  5. vue学习笔记三:常见的表单绑定

    <template> <div id="app"> <input type="checkbox" id="checked ...

  6. vue学习笔记(四)事件处理器

    前言 在上一章vue学习笔记(三)class和style绑定的内容中,我们学习了如何在vue中绑定class和style,介绍了常用的绑定方法,class的数组绑定和对象绑定以及style的数组绑定和 ...

  7. Vue学习笔记-Vue.js-2.X 学习(三)===>组件化高级

    (四) 组件化高级 1.插槽(slot)的基本使用 A:基本使用: <slot></slot> B:默认置:<slot><h1>中间可以放默认值< ...

  8. vue学习笔记(八)组件校验&通信

    前言 在上一章博客的内容中vue学习笔记(七)组件我们初步的认识了组件,并学会了如何定义局部组件和全局组件,上一篇内容仅仅只是对组件一个简单的入门,并没有深入的了解组件当中的其它机制,本篇博客将会带大 ...

  9. vue学习笔记(十)路由

    前言 在上一篇博客vue学习笔记(九)vue-cli中的组件通信内容中,我们学习组件通信的相关内容和进行了一些组件通信的小练习,相信大家已经掌握了vue-cli中的组件通信,而本篇博客将会带你更上一层 ...

  10. iView学习笔记(三):表格搜索,过滤及隐藏列操作

    iView学习笔记(三):表格搜索,过滤及隐藏某列操作 1.后端准备工作 环境说明 python版本:3.6.6 Django版本:1.11.8 数据库:MariaDB 5.5.60 新建Django ...

随机推荐

  1. Linux 环境 Maven 安装&仓源配置

    索引: 目录索引 参看代码 GitHub: maven.txt 一.Linux (DeepinOS) 环境 1.官网下载 https://maven.apache.org/download.cgi 2 ...

  2. win10系统电脑常用基本操作快捷键

    win:开始 ==  ctrl + ESC :开始菜单 win + X: 开始菜单 win + i : 控制面板 win + L:快速锁屏 win +A:操作中心 win+Tab 时间轴(1803版本 ...

  3. input file实现多选和限制文件上传类型

    <!-- input file  accept 属性设置可上传文件的类型  multiple属性设置可多文件上传--> <!-- accept 并未真正的实现限制上传文件类型,只是在 ...

  4. 从0开始的Python学习010return语句&DocStrings

    return语句 return语句用来从一个函数中 返回 即跳出函数.当然也可以从函数中返回一个值. #return 语句从一个函数返回 即跳出函数.我们也可选从函数返回一个值 def maximum ...

  5. Python装饰器、内置函数之金兰契友

    装饰器:装饰器的实质就是一个闭包,而闭包又是嵌套函数的一种.所以也可以理解装饰器是一种特殊的函数.因为程序一般都遵守开放封闭原则,软件在设计初期不可能把所有情况都想到,所以一般软件都支持功能上的扩展, ...

  6. c/c++ 网络编程 getaddrinfo 函数

    网络编程 getaddrinfo 函数 解析网址,返回IP地址. 例子: #include <iostream> #include <string.h> #include &l ...

  7. 本地windows下搭建git的本地服务器

    本地windows下搭建git的本地服务器 准备工作: 本地安装java环境,配置环境变量(略) 下载gitblit文件,百度一大堆 开始第一步: 减压gitblit压缩包到某个目录下,比如我在:H: ...

  8. Mockito单元测试

    Mockito简介 Mockito是一个单元测试框架,需要Junit的支持.在我们的项目中,都存在相当多的依赖关系,当我们在测试某一个业务相关的接口或则方法时,绝大多数时候是没有办法或则很难去添加所有 ...

  9. 基本数据对象(int,float,str)

    一.整型(int) # int对象初始化 x = 2 y = int(3) n = int("A3",12) # 运算符(+.-.*././/.%.**) ''' 相关的函数 '' ...

  10. WINFORM因为 线程崩溃

    1.如果WinForm程序中使用了线程,而线程调用的代码中会抛出异常,该异常没有任何Try块处理.就会导致程序从主线程中跳出,导致WinForm程序突然崩溃性关闭.2.程序读写某些外部资源,比如数据库 ...