vue 仿ele 开发流程
技术栈:
vue2 vuex vue-router axios webpack eslint better-scroll
1.安装插件
npm install vue-resource babel-runtime --save
npm install babel-preset-es2015 stylus-loader function-bind json-loader --save-dev
2.增加 better-scroll
.eslintrc.js
'space-before-function-paren': 0,
'semi': 0,
'no-new': 0,
'no-unused-vars': 0,
'no-undef': 0
安装插件:
npm install better-scroll fastclick iscroll v-tap vue-scroll --save
3.添加 axios
4.添加 vuex
5.打包
npm run build
.gitignore
.DS_Store
node_modules/
resource/
dist/
npm-debug.log
6.
npm install moment --save
制作时间过滤器,将 时间戳 变为 日期格式
7.设置mock 数据
build/dev-server.js
var appData = require('../static/data.json')
8.
npm install eslint-config-standard --save
9.
npm install watchpack --save
注:下面是关于这些钩子函数的解释:
| hook | 描述 |
|---|---|
| beforeCreate | 组件实例刚被创建,组件属性计算之前 |
| created | 组件实例创建完成,属性已绑定,但是 DOM 还未生成, $el 属性还不存在 |
| beforeMount | 模板编译/挂载之前 |
| mounted | 模板编译/挂载之后 |
| mounted | 模板编译/挂载之后(不保证组件已在 document 中) |
| beforeUpdate | 组件更新之前 |
| updated | 组件更新之后 |
| activated | for keep-alive,组件被激活时调用 |
| deactivated | for keep-alive,组件被移除时调用 |
| beforeDestory | 组件销毁前调用 |
| destoryed | 组件销毁后调用 |
vue 仿ele 开发流程的更多相关文章
- vue 仿QQ 开发流程
技术客栈: vue-cli vue2 vue-router vuex axios stylus webpack2 muse-ui 1.安装脚手架 npm install -g vue-cli 2.开始 ...
- Vue 实战项目开发流程
一 基础配备 ## 一.环境搭建 #### 1.安装node - 去[官网](https://nodejs.org/zh-cn/)下载node安装包 - 傻瓜式安装 - 万一安装后终端没有node环境 ...
- Vue项目的开发流程
我先安装的node.js 1.确认已安装了node.js,可在cmd中输入( node -v和npm -v),如显示出版号,说明安装成功 2.安装webpack 和webpack-cli 在全局下安装 ...
- vue 项目的开发流程
1.$ node -v (检测node版本,node版本需要在 V4 以上) 2.全局安装vue $ npm install -g vue 3.安装脚手架 $ npm install -g vue-c ...
- Vue.js的复用组件开发流程
本文由蔡述雄发表 接下来我们会详细分析下如何完成由多个组件组成一个复用组件的开发流程. 下面先看看我们的需求 列表组件quiList.vue 本节我们主要要完成这样一个列表功能,每一行的列表是一个组件 ...
- Vue 框架-12-Vue 项目的详细开发流程
Vue 框架-12-Vue 项目的详细开发流程 首先,如果你还不了解 Vue 脚手架怎么搭建? 默认的环境中有哪些文件? 文件大概是什么作用? 那么,您要先查看之前的文章才有助于你理解本篇文章: Vu ...
- vue2.0 仿手机新闻站(一)项目开发流程
vue仿手机新闻站: 1.拿到静态页面,直接用vue边布局,边写 2.假数据 没有用任何UI组件,切图完成 做项目基本流程: 1.规划组件结构 Nav.vue Header.vue Home.vue ...
- vue项目搭建和开发流程 vue项目配置ElementUI、jQuery和Bootstrap环境
目录 一.VUE项目的搭建 1. 环境搭建 2. 项目的创建和启动 二. 开发项目 1. 配置vue项目启动功能 2. 开发vue项目 (1)项目文件的作用 (2)vue项目开发流程 (3)vue项目 ...
- Android之仿ele地图定位效果
PS:最近项目要求,希望在选择地址的时候能够仿ele来实现定位效果.因此就去做了一下.不过ele使用高德地图实现的,我是用百度地图实现的.没办法,公司说用百度那就用百度的吧.个人觉得高德应该更加的精准 ...
随机推荐
- PL\SQL结构控制、异常
PL\SQL结构控制 1.IF条件控制语句(三种基本方式+IF语句的嵌套使用) (1)IF... (2)IF...ELSE (3)IF...ELSIF. ...
- HDU 5861 Road(线段树 区间修改 单点查询)
Road Time Limit: 12000/6000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others)Total Submi ...
- Flask实战第64天:帖子加精和取消加精功能完成
帖子加精和取消加精是在cms后台来设置的 后台逻辑 首页个帖子加精设计个模型表,编辑apps.models.py class HighlightPostModel(db.Model): __table ...
- 【数据结构】 最小生成树(二)——kruskal算法
上一期说完了什么是最小生成树,这一期咱们来介绍求最小生成树的算法:kruskal算法,适用于稀疏图,也就是同样个数的节点,边越少就越快,到了数据结构与算法这个阶段了,做题靠的就是速度快,时间复杂度小. ...
- 常见OJ提交结果对照表
Waiting:你的程序刚刚提交,正在等待OJ评测你的程序. Compiling:OJ正在编译你的程序. Accepted:OK!你的程序是正确的 ^_^. Wrong Answer:你的 ...
- 【BZOJ 3175】 3175: [Tjoi2013]攻击装置(二分图匹配)
3175: [Tjoi2013]攻击装置 Description 给定一个01矩阵,其中你可以在0的位置放置攻击装置.每一个攻击装置(x,y)都可以按照“日”字攻击其周围的 8个位置(x-1,y-2) ...
- NHibernate官方文档中文版——批量插入(Batch inserts)
A naive approach t7o inserting 100 000 rows in the database using NHibernate might look like this: 一 ...
- EasyUI datagrid 复选框可以多选但不能全选功能实现
1.功能需求: 实现多选,但是不能够全选功能 2.js代码 //帮卖列表页面,可以多选但是不能够全选实现 $(".datagrid-header-check").children ...
- python wheel 包命名规则和 abi 兼容
wheel 包的命名规定 wheel 包的命名格式为 {distribution}-{version}(-{build tag})?-{python tag}-{abi tag}-{platform ...
- 阻止jQuery事件冒泡
Query对DOM的事件触发具有冒泡特性.有时利用这一特性可以减少重复代码,但有时候我们又不希望事件冒泡.这个时候就要阻止 jQuery.Event冒泡. 在jQuery.Event 的文档 中的开头 ...