vue学习笔记(三)- vue2.x引入Element-ui
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的更多相关文章
- vue学习笔记(三)class和style绑定
前言 通过上一章的学习vue学习笔记(二)vue的生命周期和钩子函数,我们已经更近一步的知道了关于vue的一些知识,本篇博客将进一步探讨vue其它方面的内容,vue中关于class和style绑定,关 ...
- Vue学习笔记三:v-bind,v-on的使用
目录 v-bind:绑定属性值,内容相当于js,缩写: v-on:绑定方法,缩写@ 总结 v-bind:绑定属性值,内容相当于js,缩写: 我添加了一个input标签,如下 <input typ ...
- VUE 学习笔记 三 模板语法
1.插值 a.文本 数据绑定最常见的形式就是使用“Mustache”语法 (双大括号) 的文本插值 <span>Message: {{ msg }}</span> v-once ...
- vue学习笔记(三):vue-cli脚手架搭建
一:安装vue-cli脚手架: 1:为了确保你的node版本在4.*以上,输入 node -v 查看本机node版本,低于4请更新. 2:输入: npm install -g vue-cli ...
- vue学习笔记三:常见的表单绑定
<template> <div id="app"> <input type="checkbox" id="checked ...
- vue学习笔记(四)事件处理器
前言 在上一章vue学习笔记(三)class和style绑定的内容中,我们学习了如何在vue中绑定class和style,介绍了常用的绑定方法,class的数组绑定和对象绑定以及style的数组绑定和 ...
- Vue学习笔记-Vue.js-2.X 学习(三)===>组件化高级
(四) 组件化高级 1.插槽(slot)的基本使用 A:基本使用: <slot></slot> B:默认置:<slot><h1>中间可以放默认值< ...
- vue学习笔记(八)组件校验&通信
前言 在上一章博客的内容中vue学习笔记(七)组件我们初步的认识了组件,并学会了如何定义局部组件和全局组件,上一篇内容仅仅只是对组件一个简单的入门,并没有深入的了解组件当中的其它机制,本篇博客将会带大 ...
- vue学习笔记(十)路由
前言 在上一篇博客vue学习笔记(九)vue-cli中的组件通信内容中,我们学习组件通信的相关内容和进行了一些组件通信的小练习,相信大家已经掌握了vue-cli中的组件通信,而本篇博客将会带你更上一层 ...
- iView学习笔记(三):表格搜索,过滤及隐藏列操作
iView学习笔记(三):表格搜索,过滤及隐藏某列操作 1.后端准备工作 环境说明 python版本:3.6.6 Django版本:1.11.8 数据库:MariaDB 5.5.60 新建Django ...
随机推荐
- TabLayout您可能不知道的实用用法
一.修改点击的动画 函数:setUnboundedRipple 这是默认的点击的动画 我们用代码修改一下: mGlueTabLayout.setUnboundedRipple(true); 这是之后的 ...
- httpservlet里单纯分页
@Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletExcep ...
- Ubuntu忘记密码后强制修改密码
环境:Ubuntu 16.04 由于很久不用我的Ubuntu系统导致密码忘记,就想着应该有什么办法可以强制修改root密码,就上百度找了一下,果然Ubuntu有办法强制修改root密码. 在这里要谢谢 ...
- Python开发【第五篇】内置函数
abs() 函数返回数字的绝对值 __author__ = "Tang" a = -30 all() 函数用于判断给定的可迭代参数iterable中的所有元素是否都为True,如果 ...
- Taro文件上传:Blob Url下载Blob对象本身并通过接口上传到服务器
最近项目的文件上传遇到一个问题,就是Taro的chooseImage传给回调的是一个Blob对象,一般来说,上传控件都会导出Data Url,而Taro给了一个Blob Url,问题在于,我直接令im ...
- JAVA常用API的总结(2)
这篇是常用API的结束了,写完的话可以继续往后复习了. 1.基本类型包装类的介绍与相关代码实现 对于数据包装类的特点就是可以将基本数据类型与字符串来回切换,接下来我会通过介绍Integer类的形式,来 ...
- org.apache.ibatis.builder.IncompleteElementException: Could not find result map com.hp.entity.Emp
错误提示代码: org.apache.ibatis.builder.IncompleteElementException: Could not find result map com.hp.entit ...
- Linux学习笔记(一)----Ubuntu下的apt命令
一.原理与目录 先介绍几个和apt-get相关的目录: /var/lib/dpkg/available文件的内容是软件包的描述信息, 该软件包括当前系统所使用的 Debian 安装源中的所有软件包,其 ...
- .net core iis配置
微软官方教程: https://docs.microsoft.com/en-us/aspnet/core/publishing/iis?tabs=aspnetcore2x 在vs中创建.net cor ...
- 关于Eclipse的版本、分支、衍生版本
Eclipse 简介: Eclipse的历史: Eclipse的发布版本: Eclipse分支: 关于不同分支版本的区别,点击链接: http://www.eclipse.org/downloads/ ...
