一:软件安装

1.1 检测node 是否安装

1.2 安装淘宝镜像 cnpm

1.3 安装vue-cli

1.4 检查是否安装vue-cli脚手架成功

1.5安装webpack 模块管理工具

二:创建Vue项目

2.1 创建一个基于webpack项目

2.2 进入项目文件

2.3以生产环境启动项目

2.4打开浏览器

三:安装插件

3.1 安装ajax插件axios  (vue-resource在2.0以后就不在更新了)

3.2 安装状态管理工具vuex (组件间数据传输)

3.3 安装框架Element Ui

3.4 安装less插件

3.5安装animate插件

四:配置插件

4.1 配置axios插件

4.2 配置vuex

4.3 配置Element Ui

4.5 配置使用animate插件

五:开始首页(头部尾部)

5.1:home主页

5.2 头部

5.3 尾部

六:模拟数据

6.1 装插件  mockjs,一个模仿接口的小东西

6.2 配置插件

正式写数据

用vue前后端分离项目开发记录的更多相关文章

  1. 喜大普奔,两个开源的 Spring Boot + Vue 前后端分离项目可以在线体验了

    折腾了一周的域名备案昨天终于搞定了. 松哥第一时间想到赶紧把微人事和 V 部落部署上去,我知道很多小伙伴已经等不及了. 1. 也曾经上过线 其实这两个项目当时刚做好的时候,我就把它们部署到服务器上了, ...

  2. 两个开源的 Spring Boot + Vue 前后端分离项目

    折腾了一周的域名备案昨天终于搞定了. 松哥第一时间想到赶紧把微人事和 V 部落部署上去,我知道很多小伙伴已经等不及了. 1. 也曾经上过线 其实这两个项目当时刚做好的时候,我就把它们部署到服务器上了, ...

  3. Springboot+vue前后端分离项目,poi导出excel提供用户下载的解决方案

    因为我们做的是前后端分离项目 无法采用response.write直接将文件流写出 我们采用阿里云oss 进行保存 再返回的结果对象里面保存我们的文件地址 废话不多说,上代码 Springboot 第 ...

  4. Jeecg-Boot 2.0 版本发布,基于Springboot+Vue 前后端分离快速开发平台

    目录 Jeecg-Boot项目简介 源码下载 升级日志 Issues解决 v1.1升级到v2.0不兼容地方 系统截图 Jeecg-Boot项目简介 Jeecg-boot 是一款基于代码生成器的智能开发 ...

  5. SpringBoot+Vue前后端分离项目,maven package自动打包整合

    起因:看过Dubbo管控台的都知道,人家是个前后端分离的项目,可是一条打包命令能让两个项目整合在一起,我早想这样玩玩了. 1. 建立个maven父项目 next 这个作为父工程,next Finish ...

  6. 21.Shiro在springboot与vue前后端分离项目里的session管理

    1.前言 当决定前端与后端代码分开部署时,发现shiro自带的session不起作用了. 然后通过对请求head的分析,然后在网上查找一部分解决方案. 最终就是,登录成功之后,前端接收到后端传回来的s ...

  7. React+Flask打造前后端分离项目开发环境

    目录 前言 Backend-Flask Frontend-React Done References 前言 新的一年,开始水第一篇技术文.碰巧最近React玩得多,撸一篇文章纪念一下开发环境的搭建.

  8. Django+Vue前后端分离项目的部署

    部署静态文件: 静态文件有两种方式 1:通过django路由访问 2:通过nginx直接访问 方式1: 需要在根目录的URL文件中增加 url(r'^$', TemplateView.as_view( ...

  9. 基于Vue的前后端分离项目实践

    一.为什么需要前后端分离 1.1什么是前后端分离  前后端分离这个词刚在毕业(15年)那会就听说过,但是直到17年前都没有接触过前后端分离的项目.怎么理解前后端分离?直观的感觉就是前后端分开去做,即功 ...

随机推荐

  1. 记录下安装ES过程中遇到的错误及解决

    1.集群配置 需要修改 cluster.name .node.name .network.host: 0.0.0.0[此处默认localhost].http.port: 9200 只要集群名相同,且机 ...

  2. 数据库历险记(二) | Redis 和 Mecached 到底哪个好?

    文章首发于微信公众号「陈树义」,专注于 Java 技术分享的社区.点击链接扫描二维码,与500位小伙伴一起共同进步.微信公众号二维码 http://p3npq6ecr.bkt.clouddn.com/ ...

  3. 设计模式 笔记 策略模式 Strategy

    //---------------------------15/04/28---------------------------- //Strategy 策略模式----对象行为型模式 /* 1:意图 ...

  4. winform 保存文件 打开文件 选择文件 字体样式颜色(流 using System.IO;)

    string filePath = ""; private void 保存SToolStripMenuItem_Click(object sender, EventArgs e) ...

  5. OpenStack与OpenDaylight的对接过程

    由于项目中需要使用OpenDaylight(Oxygen)替换OpenStack(Otaca)中的neutron-openvswitch-agent,能找到的一些资料都是比较旧的版本,官网上的文档也一 ...

  6. Hive的一些理解

    首先谈一下关于hive和hbase的区别的疑问(完全不是一个东西): 本质上来说hive和hbase没什么关系,虽然都是表,查数据等,但是他们根本就不是一个层面的东西 hive就是一个rapduce的 ...

  7. linux/Centos下查看和修改网卡Mac地址(ifconfig命令)

    本文转载自http://www.169it.com/article/14360294838474691537.html linux/Centos下查看网卡Mac地址,输入命令: #ifconfig - ...

  8. 《linux内核设计与实现》第一章

    第一章Linux内核简介 一.unix 1.Unix的历史 Unix是现存操作系统中最强大和最优秀的系统. ——1969年由Ken Thompson和Dernis Ritchie的灵感点亮的产物. — ...

  9. ubuntu18.04配置nvidia docker和远程连接ssh+远程桌面连接(一)

    ubuntu18.04配置nvidia docker和远程连接ssh+远程桌面连接(一) 本教程适用于想要在远程服务器上配置docker图形界面用于深度学习的用户. (一)ubuntu18.04配置n ...

  10. css3-文本新增属性

    rgba:a是设透明度值 应用:background:rgb(255,255,255,0.5) color:rgb(255,255,255,0.5) border:1px solid rgb(255, ...