前端基于vue,后台采用springboot+shiro的方式搭建的一个移动端商品展示平台
基于vue实现的移动端商品展示页,可以web-view的方式嵌入到小程序中,布局简约、大气,减少初学者或开发者不必要的工作量。后台维护采用的springboot+shiro的方式,为广大爱好者提供展示模板,方便快速构建属于自己的商户展示平台。
采用的技术如下:
1、前端使用vue-cli脚手架创建前端项目,采用axios前后端请求,store存储登陆状态等信息
//vue-cli脚手架 运行流程
1、npm run dev
执行的是package.json 中scripts部分中key(上述命令是dev,即dev中对应的命令)对应的value
//"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js"
webpack-dev-server 一种node.js的服务器 --inline代表会将webpack-dev-server客户端加入到webpack入口文件的配置中。
--progress 代表是否显示滚动条 --config 指定一个新的配置文件
scripts部分除了上述的dev 还包括
start: 是命令yarn start的入口, npm与yarn殊途同归,区别不大 任选。
lint:值“eslint --ext .js,.vue src”,代表执行npm run lint命令时,直接该脚本,是为了检查代码是否符合ESlint的规范。
build:"node build/build.js",打包生产命令 当运行npm run build时执行。
package.json中其他部分
1、项目依赖:dependencies npm run build 时候构建项目的包。这些包的代码会被打包添加到实际的应用代码之中
依赖的几种写法:
(1)"vue": "2.5.2", 表示固定版本,只依赖2.5.2版,之后有新版也不会更新
(2)"vue": "~2.5.2", 表示只安装 2.5.X 系列版本的最新版,而 2.6.X 的或其他的不会更新
(3)"vue": "^2.5.2", 表示安装当前库的最新版
2、
开发依赖:devDependencies 与dependencies 区别是:开发依赖里面的东西不会添加到生产环境中,
只是在开发阶段辅助编译开发等功能。比如:autoprefixer,babel-core 等,他只是在编译的时候给CSS样式添加一些浏览器兼容的前缀,
和把ES6 转译成ES5。当打包结束时就会被抛弃,并不会添加到打包的结果中。
3、engines 主要是规定开发时候的环境的node.js 和 npm 的版本不能太低
4、browserslist
一个阈值。表示是否要去兼容某些浏览器,如果小于阈值的部分在ES6的转译时可能将会忽略。
5、main: 代表入口js
//webpack 模块化管理、打包工具
//vue学习心得
vue-cli脚手架创建项目
1、3.0的vue create project-name
2、2.9 vue init webpack project-name (出来的目录结构是有区别的)
二、后台搭建采用springboot框架,集成shiro控制权限。采用maven的方式打包发布
1、mvn clean
2、mvn install -Dmaven.test.skip=true
前端代码存在码云,访问地址:https://gitee.com/lxming/private_warehouse,欢迎下载!
前端基于vue,后台采用springboot+shiro的方式搭建的一个移动端商品展示平台的更多相关文章
- 基于Vue+Spring MVC+MyBatis+Shiro+Dubbo开发的分布式后台管理系统
本文项目代码: 服务端:https://github.com/lining90567/dubbo-demo-server 前端:https://github.com/lining90567/dubbo ...
- 基于vue(element ui) + ssm + shiro 的权限框架
zhcc 基于vue(element ui) + ssm + shiro 的权限框架 引言 心声 现在的Java世界,各种资源很丰富,不得不说,从分布式,服务化,orm,再到前端控制,权限等等玲琅满目 ...
- 前端基于VUE的v-charts的曲线显示
目录 前端基于VUE的v-charts的曲线显示 1. 应用背景 2. 分析数据生产者生成 3. 取出数据消费者 4. 前端显示 4.1 安装V-charts插件 4.2 引入veline曲线插件 4 ...
- 基于Vue、web3的以太坊项目开发及交易内幕初探 错误解决总结
基于Vue.web3的以太坊项目开发及交易内幕初探 本文通过宏观和微观两个层面窥探以太坊底层执行逻辑. 宏观层面描述创建并运行一个小型带钱包的发币APP的过程,微观层面是顺藤摸瓜从http api深入 ...
- 基于vue+leaflet+echart的足迹分享评论平台
(其实题目是随便取的,目的只是用来证明Vue+leaflet+springboot技术栈的可行性) 效果 小专栏不支持上传视频?想看的话可以去我的知乎看最新的文章,那个应该可以.在这里 主要功能描述 ...
- 在基于ABP框架的前端项目Vue&Element项目中采用日期格式处理,对比Moment.js和day.js的处理
Day.js 是一个轻量的处理时间和日期的 JavaScript 库,和 Moment.js 的 API 设计保持完全一样. 如果您曾经用过 Moment.js, 那么您已经知道如何使用 Day.js ...
- 在基于ABP框架的前端项目Vue&Element项目中采用电子签章处理文件和打印处理
在一些内部OA或者流转的文件,或者给一些客户的报价文件.合同,或者一些医院出示的给保险机构的病历资料等,有时候可能都希望快速的使用电子签章的处理方式来给文件盖上特定的印章,本篇随笔介绍基于Vue&am ...
- 在基于ABP框架的前端项目Vue&Element项目中采用电子签名的处理
在前面随笔介绍了<在基于ABP框架的前端项目Vue&Element项目中采用电子签章处理文件和打印处理>的处理,有的时候,我们在流程中或者一些文件签署的时候,需要签上自己的大名,一 ...
- 「免费开源」基于Vue和Quasar的前端SPA项目crudapi后台管理系统实战之自定义组件(四)
基于Vue和Quasar的前端SPA项目实战之序列号(四) 回顾 通过上一篇文章 基于Vue和Quasar的前端SPA项目实战之布局菜单(三)的介绍,我们已经完成了布局菜单,本文主要介绍序列号功能的实 ...
随机推荐
- js一道面试题
题目是这样的,按照以下函数的结果写一个sub()方法: sub(1)(2)(3);/*return 6*/ sub(4)(3)(3);/*return 10*/ 我的山寨做法: function su ...
- Asp.Net Core 项目 EntityFramework Core 根据登录用户名过滤数据
1.创建ASP.NET Core Web Applicatoin (MVC)项目,并且使用 Individual User Account 2.创建数据筛选接口 Models->IDataFil ...
- Laravel --- 如何较优雅的使用公用函数
一.创建公用文件 App/Helpers/CommonHelper.php 二.创建Provider php artisan make:provider HelperServiceProvider C ...
- 04 body中的相关标签
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- maven的私服私包镜像地址配置settings.xml
新建一个setting节点——镜像标签 <mirror> 添加你的mirror_id,name,url是该镜像的信息,一般都没有什么问题. mirrorOf是被镜像的服务器的id,可以是 ...
- 了解selenium--(虫师的博客)
Selenium is a portable software-testing framework for web applications. Selenium is composed of seve ...
- HDU 6053:TrickGCD(莫比乌斯反演)
题目链接 题意 给出n个数,问在这n个数里面,有多少组bi(1<=bi<=ai)可以使得任意两个bi不互质. 思路 想法就是枚举2~min(ai),然后去对于每个ai都去除以这些质数,然后 ...
- Codeforces 758B:Blown Garland(模拟)
http://codeforces.com/problemset/problem/758/B 题意:给出一个字符串,每4个位置对应一个颜色,如果为‘!’的话,代表该灯泡是坏的,问最后每个颜色坏的灯泡的 ...
- curl推送示例:熊掌号,百度站长的链接推送(系统环境变量配置)
curl推送示例:熊掌号,百度站长的链接推送(需要用户系统环境变量配置)这篇文章主要讲解curl推送,熊掌号,百度站长的链接推送,我们很多seo朋友都搞不定curl的推送链接,而且还要配置系统的环境变 ...
- 浅谈SpringBoot
关于SpringBoot有哪些特性,SpringBoot官网是这么描述的: Features Create stand-alone Spring applications Embed Tomcat, ...