• 前端基于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,欢迎下载!     QQ交流群:    ①群:699050440  ②群:824313640

  • 相关阅读:
    React Native之Android应用开发IDE选项
    react-native环境配置——Android工程搭建
    《更换电池》
    canvas绘图是基于状态的绘图方式
    关于JSONP的一些概念
    iOS 学习笔记七 【博爱手把手教你使用2016年gitHub Mac客户端】
    iOS 学习笔记六 【APP中的文字和APP名字的国际化多语言处理】
    iOS 学习笔记五 【2016年百度地图定位详细使用方法】
    iOS 学习笔记四 【xcode 7.3 ESJsonFormat-Xcode 插件不能使用的解决办法】
    iOS 学习笔记三【segmentedControl分段控制器详细使用方法】
  • 原文地址:https://www.cnblogs.com/fatpig-wf/p/11225417.html
Copyright © 2020-2023  润新知