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. android.database.sqlite.SQLiteException: no such column: aaa (code 1): , while compiling: DELETE FROM users WHERE user_name=aaa解决办法

    在写安卓登录注册时注销按钮闪退发现: 这是因为此处错误: 因为用户名为字符串,不是整型,数据库查询要引号,少了引号查询不了,导致闪退 解决后成功运行 正确用法: 下次谨记,细节决定成败呀!

  2. 新更新,又是一年了。这次记录下关于android版的WeiboDemo的问题

    时隔一年多,现在又开始折腾android的代码了.之前看了Learning android,就想看下能否移植到Weibo.然后就下了weibo的代码,代码包里有个实例叫WeiboSDKDemo. 为了 ...

  3. 安卓开发:UI组件-图片控件ImageView(使用Glide)和ScrollView

    2.7ImageView 2.7.1插入本地图片 一个图片控件,可以用来显示本地和网络图片. 在首页添加按钮ImageView,指向新页面(步骤与前同,不再详写). activity_image_vi ...

  4. 智能POS常见问题整理

    智能POS预警值为小于所设的数量,H5就会变为锁定状态 智能POS查看数据库方法: 商米D1:设置-存储设备和USB-内部存储设备-浏览-winboxcash tablet.db为智能POS数据库 W ...

  5. RHEL 6.6下Python 2.6.6升级到Python 3.6.6

      最近一段时间shell脚本写得很溜,很有成就感,一想到被自己落下的Python就感到十分心虚.开始坚持学习Python!先将自己的测试机器的Python升级到Python 3.6.6.简单整理.记 ...

  6. GitHub的初级使用

    最近准备学习一个GitHub的使用 一.账号创建 1.百度找到GitHub官方网站(https://github.com/ ) 2.点击Sign up注册GitHub账号 下图为注册页面 第一步:填写 ...

  7. GIL:全局解释器锁 VS 用户程序锁

    既然有了GIL锁,CPython还要多线程干什么? ''' GIL:全局解释器锁的来历 四核:同一时刻真正有四个任务在运行,多核的意义在于此 单核:看上去是并发的,因为进行了上下文切换,单核永远是串行 ...

  8. 爬虫系列---scrapy post请求、框架组件和下载中间件+boss直聘爬取

    一 Post 请求 在爬虫文件中重写父类的start_requests(self)方法 父类方法源码(Request): def start_requests(self): for url in se ...

  9. [已决解]关于Hadoop start-all.sh启动问题

    问题一:出现Attempting to operate on hdfs namenode as root 写在最前注意: 1.master,slave都需要修改start-dfs.sh,stop-df ...

  10. C# FileSystemWatcher 并发

    using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threa ...