需求覆盖：关联*用户进行自动登录、疫情防控、数据采集、问题上报、用户权限控制等 技术栈：Vue3.2+Vue-Router@4+Vue-cli@5+Vuex@4+Sass+Vant3+Axios+Git 1. 使用 vue3.2 新增的 setup 语法糖进行开发 2. 在 APP.vue 中使用 keep-alive 缓存组件，通过监听每个路由 meta 参数中的 keepAlive 是否为 true，来动 态修改组件缓存的 include 数组，并 provide 暴露 clearCache 方法来移除 include 数组中的指定元素 3. 系统用户分为管理员和普通用户，调用接口获取当前系统用户信息，在前端对用户信息进行判断来决定用户允 许进行哪些操作 4. 在用户首次登录系统时，调用*授权获取 code，再通过 code 获取每个用户相对公众号而言的唯一 openid，将此 openid 与当前要登录的用户进行关联，在非首次登录，只需调用 code 获取 openid 就知道哪个 用户要进行登录从而实现自动登录 5. 在公众号后台设置好 JS 接口安全域名后，引入 JS 文件，后端按照*要求的方式和算法生成使用 JS-SDK 的 config 签名，并将生成签名的时间戳、随机字符串、签名返回给前端，前端再调用*提供的 getLocation 方法 获取用户当前地理位置并在地图上标记出来 6. 封装系统中的分页、卡片信息、询问弹窗等公共模块组件，封装系统公共方法，将常用样式定义成 mixins 7. 对用户登录密码、隐私信息等数据前端通过 cryptoJs 插件进行 SHA1 加密后进行传输

需求覆盖：多入口登录、会务预定、 餐饮服务、一卡通审核办理等 技术栈：Vue3.0+Vue-Router@4+Vue-cli@4+Vuex@4+Sass+Vant3+Axios+Echarts+SVN 1. 使用 vue 脚手架搭建项目，安装 postcss-px-to-viewport 并根据项目实际需求进行 postcss 配置，来适应不 同尺寸的* 2. 安装 prettier、eslint-plugin-prettier、eslint-config-prettier 并修改 eslint 配置来约束代码规范和格式化 3. 安装 vant3，安装 babel-plugin-import 来实现 vant 组件样式的按需加载 4. 安装 axios，根据后端定义好的接口规范，在项目中封装 axios 请求实例 5. 封装路由实例，并在 APP.vue 中监听路由的 meta 参数，从而实现根据每个路由的 meta 参数进行一些自定义 的功能，比如页面标题内容、是否需要缓存路由对应的组件、点击左上角返回指定路由页面等 6. 对用户输入的密码进行 MD5 加密进行登录，将后端返回的 token 存在浏览器本地，在每次请求时通过 axios 拦截器携带在请求头上从而实现登录状态下调用系统接口 7. 按照设计稿和原型，将项目的主题颜色等常用样式定义成 mixins，在实际页面编写中进行引用，所有页面 html 结构的 class 命名均遵循 BEM 命名规则进而提高代码阅读的语义化 8. 通过 symbol 引用的方式使用阿里图标 9. 封装系统公共组件，如分页模块、列表模块、步骤条模块等；封装系统共用方法，如图片的上传和删除

需求覆盖：复用平台搭建的配置项、复用平台的公共方法和样式代码、每个页面实例都有自己路由和子组件等 技术栈：webpack5+Eslint+babel@7+Sass+vue3 全家桶+vant3+Axios+Git 1. 初始化项目工程，安装 webpack、webpack-cli、webpack-dev-server，创建 src/main.js 入口文件，创建 webpack 配置文件并添加基础的打包配置项，在 package.json 添加 build 生产环境代码打包、dev 开发环境代 码打包、start 启动 webpackDevServer 等常用命令 2. 使用 css-loader、postcss-loader、sass-loader 打包样式文件，使用 mini-css-extract-plugin 合并样式文 件并替代 style-loader 的作用 3. 安装使用 autoprefixer、postcss-px-to-viewport 实现给 CSS3 新样式自动添加厂商前缀，px 单位转视窗口 单位 4. 使用 url-loader、file-loader 打包图片、音频、文档附件 5. 安装使用 babel-loader、@babel/core、@babel/preset-env 将高级 js 语法转化为配置的目标环境 js 代码 6. 安装 vue3.2，安装使用 vue-loader、@vue/compiler-sfc 实现打包 vue 文件 7. 通过 clean-webpack-plugin 自动清除打包文件，通过 html-webpack-plugin 生成打包后的 html 入口文件 8. 优化项目的工程目录，在 src/pages 下创建多页面实例，每个实例都有自己的入口 js 文件和模板 html 文件， 在 webpack 配置文件中动态读取 src/pages 下入口 js 文件，并通过 html-webpack-plugin 生成相应的 html 文件 9. 在 webpack 配置文件中合理使用 resolve 配置来定义路径别名等，使用 splitChunks 优化打包出的文件