A+Office-SPA项目-WebApp移动端1.2版本-Vue制作

A+Office-SPA项目-WebApp移动端1.2版本-Vue制作

JavaScript Vue.js相关

详细介绍

A+office-SPA-WebApp-Vue制作

本页面需要在服务器环境下通过域名访问,勿直接浏览静态页面

框架基于Vue 2

二次开发时建议安装Editor插件(大部分IDE都支持的插件)统一编辑格式

使用技术:

  • Vuejs 框架
  • Vuex 状态管理
  • Sass 样式预处理器
  • Axios 交互处理
  • Webpack 模块打包
  • Babel ES6转译ES5工具
  • Yarn 模块依赖安装

Components Structure / 组件结构说明:

App.vue ( 根节点 )
    |
    |- Discover.vue             ( "发现"页面 )
    |
    |- HouseResource.vue        ( "房源"页面 )
    |
    |- Map.vue                  ( "地图"页面 )
    |
    |- Service.vue              ( "服务"页面 )
    |
    |- 404.vue                  ( "404"页面 )

Build Setup / 开发流程

# install dependencies/拉取项目,在项目路径下执行
# 国内环境建议使用cnpm install
npm install

# *推荐Yarn
yarn install

# serve with hot reload at localhost:8080
# npm安装依赖后,运行node服务器,打开 localhost:80 预览 (已运行热更新功能)
npm run dev

# build for production with minification
# 当修改代码后,需要手动打包发布时,运行npm run build命令进行打包
npm run build

UI组件库将 使用 Muse UI

当制作多页面时,将引入路由 vue-router 2 来制作SPA单页面应用


测试机器: iPhone 6s

测试浏览器: Chrome/Safari/FireFox/微信

推荐源码