vue构建完整项目-以及实现
简介
由于开发vue项目的时候,需要重新搭建项目的架子,比较麻烦,其实之前做过的项目好多都可以直接拿过来用,比如接下来的这个项目,就可以满足平常的vue单页面开发.
该项目包括了: 全局配置axios , 全局配置接口集合 , 切换页面动画 , 全局配置vuex(其中vuex做的很经典 规范 ,可以参考), 页面请求数据增加loading效果
项目地址: https://github.com/YalongYan/vue-markert-h5
主要结构目录
.
├── build // webpack配置文件
├── config // 项目打包路径
├── src // 源码目录
│ ├── api // 接口
│ │ ├── axios.config.js // axios 配置文件
│ │ └── index.js // 接口集合
│ ├── assets // 资源
│ │ ├── css
│ │ │ └── common.css // 公共样式文件
│ │ └── loading.gif // 加载图
│ ├── components // 组件集合
│ ├── lib // 包括公共方法和数组等的定义
│ ├── pages // 页面
│ ├── router
│ │ └── router.js // 路由配置
│ ├── vuex // vuex的状态管理
│ │ ├── modules // store模块
│ │ │ ├── base.js
│ │ │ ├── carPicker.js
│ │ │ └── user.js
│ │ ├── index.js // 引用vuex,创建store
│ │ └── mutation-types.js // 定义常量muations名
│ ├── App.vue // 页面入口文件
│ └── main.js // 程序入口文件,加载各种公共组件
├── static // 静态资源
│ ├── css
│ │ └── reset.css // 重置节点的css
│ └── images // 图片
├── test // 测试部分(暂时未用到)
├── index.html // 入口html文件
.
由于请求的接口是我们内部使用的,所以大家参考代码的结构,使用方法就行,项目结构除了src 和static其他都是通用的,可以在此基础上直接开发,很方便.
vue构建完整项目-以及实现的更多相关文章
- vue 构建前端项目并关联github
这几天尝试用node开发一个网站,后端的接口已经初步开发完成,现在开始构建前端的项目,记录下过程,在学习下吧. 用vue-cli 构建项目,myproject.(构架过程略过) 每次在本地构建项目后和 ...
- vue工厂化完整项目目录
- Flask & Vue 构建前后端分离的应用
Flask & Vue 构建前后端分离的应用 最近在使用 Flask 制作基于 HTML5 的桌面应用,前面写过<用 Python 构建 web 应用>,借助于完善的 Flask ...
- Vue(1):用Vue-cli构建Vue3项目
使用Vue-cli构建Vue3项目 1.检查node版本 node -v 以上node版本位14.15.0满足Vue3项目的创建条件(Vu3需要node 版本8以上) 为什么需要安装node? vue ...
- Vue + iView + vuex + vee-validate 完整项目总结
build/*.js config/*.js src/旧代码文件夹 部门最近的一个新项目启动,很幸运由我来主导整个前端部分的技术选型和整体架构,项目工作量很大,但是却没有足够的人手,只有三个连CSS都 ...
- Eclipse 中构建 Maven 项目的完整过程 - SpringBoot 项目
进行以下步骤的前提是你已经安装好本地maven库和eclipse中的maven插件了(有的eclipse中已经集成了maven插件) 一.Maven项目的新建 1.鼠标右键---->New--- ...
- vue 构建项目vue-cli
1.首先得有node和npm的环境,node的下载:http://nodejs.org/download/.安装node之后,npm也自动生成了,显示版本号就意味着安装成功 2.接下来就是安装vue- ...
- vue 构建项目遇到的请求本地json问题
在本地测试的json没有问题,但是打包后,发现json 的路径不对了,变成了绝对路径 解决方法: 建立的json文件需要放置 根目录/static下.如项目名/static/data.json,这边 ...
- vue 构建项目 文件引入
1.vue引用依赖文件. 举例:axios 先安装 axios.如果直接安装 vue-axios 会报错 npm install axios npm install --save axios vue ...
随机推荐
- MySQL配置参数:wait_timeout
作者:老王 如果你没有修改过MySQL的配置,缺省情况下,wait_timeout 的初始值是. wait_timeout过大有弊端,其体现就是MySQL里大量的SLEEP进程无法及时释放,拖累系统性 ...
- 墨卡托投影、高斯-克吕格投影、UTM投影及我国分带方法
转自原文 墨卡托投影.高斯-克吕格投影.UTM投影及我国分带方法 一.墨卡托投影.高斯-克吕格投影.UTM投影 1. 墨卡托(Mercator)投影 墨卡托(Mercator)投影,是一种" ...
- UVa 816 (BFS求最短路)
/*816 - Abbott's Revenge ---代码完全参考刘汝佳算法入门经典 ---strchr() 用来查找某字符在字符串中首次出现的位置,其原型为:char * strchr (cons ...
- 【Hadoop】Hadoop MR 性能优化 Combiner机制
1.概念 2.参考资料 提高hadoop的mapreduce job效率笔记之二(尽量的用Combiner) :http://sishuo(k).com/forum/blogPost/list/582 ...
- ECSHOP后台开发模块步骤
一.建数据库二.添加到后台导航栏并配置相关语言包三.权限配置四.添加增删查改五.增加其他功能(复制,搜索(暂时调不出来页面),排序,转移,AJAX) 以添加支付信息模块为例 第一步首先我们用phpmy ...
- Jenkins 安装卡住不动的解决方案
如果在安装jenkins时卡在getting startted的界面,如下所示 jenkins在安装插件前总是尝试连接www.google.com,来判断网络是否连通.谷歌的网站在大陆是连不上的,所以 ...
- SpringMVC 文本文件下载的配置
页面: <fieldset> <legend>Download annotator list</legend> <img src="pages/to ...
- MySQL的左外连接
代码: select t1.descid, IFNULL(t2.cnt,) as countnew, t1.description from uosdesc t1 left outer join t2 ...
- node-表单验证
var http = require('http'); var url = require('url'); var fs = require('fs'); var querystring = requ ...
- PHP 在源代码中实现换行使得页面源代码更精致美观
常量 : PHP_EOL 换行实例: <? php echo $this->doctype($this->doctype) . PHP_EOL;?> <html> ...