运行步骤

• 安装共享目录下的node.js，一路下一步
• 配置环境变量。node -v正常显示版本即配置成功
• 配置淘宝镜像 npm config set registry https://registry.npm.taobao.org;
• 使用VsCode打开项目，执行npm i命令，待装包完成
• 执行npm run dev命令，启动项目

插件安装

• Chinese (Simplified) Language Pack for Visual Studio Code：中文插件。前端开发不要求全英文环境
• ESLint：js严格语法检查插件
• Vetur：vue语法 代码高亮插件
• vscode-icons：包结构插件

编辑器配置

-- 开启ESlint后，需要配置编辑器自动纠错功能。开发中禁止使用 alt+shift+f 进行代码格式化

{
    "vetur.format.defaultFormatter.js": "vscode-typescript",
    "editor.tabSize": 2,
    "files.associations": {
        "*.vue": "vue"
    },
    "eslint.autoFixOnSave": true,
    "eslint.options": {
        "extensions": [
            ".js",
            ".vue"
        ]
    },
    "eslint.validate": [
        "javascript",
        {
            "language": "vue",
            "autoFix": true
        },
        "html",
        "vue"
    ],
    "search.exclude": {
        "**/node_modules": true,
        "**/bower_components": true,
        "**/dist": true
    },
    "emmet.syntaxProfiles": {
        "javascript": "jsx",
        "vue": "html",
        "vue-html": "html"
    },
    "git.confirmSync": false,
    "window.zoomLevel": 0,
    "editor.cursorBlinking": "smooth",
    "editor.minimap.enabled": true,
    "editor.minimap.renderCharacters": false,
    "window.title": "${dirty}${activeEditorMedium}${separator}${rootName}",
    "editor.codeLens": true,
    "editor.snippetSuggestions": "top",
    "git.autofetch": true
}

git规范

• 项目中需自己创建分支，开发全部在自己的分支上进行开发
• 一个版本发布后，开发人员需要重新拉取master分支到自己分支进行开发
• 代码提交之前请自己测试至少两遍，确认代码无误之后进行提交。
• 每次提交必须说明本次提交所做了哪些东西，格式：新增|更新|删除|修复|临时|干了什么。如新增|添加了用户模块（格式不强制，能体现出干了什么就行）

参数规范

• 前端参数传递形式统一以json形式
• 后端统一以Result包装json格式
• 后端接口严格遵守RESTFUL规范。

Page参数规范

• columns属性：为定制查询列的属性，是一个数组。前端通过传递columns属性，可以自定义需要查询的列。支持下划线规范和驼峰规范，建议使用驼峰规范。
• params属性：params参数为查询条件构造器。条件名_属性名（驼峰规则），如 like_stuName:"杨"，后台会处理拼接成 stu_name like '%杨%' 。如果没有前缀，则视为 stu_name='杨'。条件构造以及含义如下：
  • in：值为数组或者英文逗号隔开的字符串，表示查询指定的值列表的数据
  • gt：大于
  • lt：小于
  • gte：大于等于
  • lte：小于等于
  • eq：等于
  • btw：使用~，-，/隔开，表示在这两个数值之间
  • like：模糊查询
  • null：true为空，false不为空
  • not：不等于
  • notin：相当于in的否定
  • join：保留关键字，后续拓展连表查询

调试代码

• 浏览页面使用火狐浏览器或者谷歌浏览器
  • 谷歌浏览器安装 vue-devtool
  • 火狐浏览器安装 vue-devtool：直接上扩展组件搜索

相关文档

• vue，构建数据驱动的 web 界面的渐进式框架
• vue-router，vue 路由管理
• ECMAScript 6，JavaScript 语言的下一代标准
• ESLint，用于统一 JS 代码风格
• JavaScript Standard Style，JS 编码风格规范，用于 ESLint
• element-ui，UI 框架
• Vuex，vue 状态管理
• axios，ajax 库
• webpack，前端打包工具

发布

# 构建测试环境
npm run build:test

# 构建生产环境
npm run build:prod

其它

# 预览发布环境效果
npm run preview

# 预览发布环境效果 + 静态资源分析
npm run preview -- --report

# 代码格式检查
npm run lint

# 代码格式检查并自动修复
npm run lint -- --fix

项目结构

├─.env.development // 开发环境全局常量
├─.env.production //生产环境全局常量
├─.env.staging // 测试环境全局常量
├─.gitignore // git忽略文件
├─babel.config.js // babel
├─vue.config.js // vue-cli 3.x 配置文件
├─src
|  ├─App.vue // 主组件
|  ├─main.js // 入口文件
|  ├─permission.js // 登录校验
|  ├─settings.js // 系统配置文件
|  ├─views // 页面组件
|  ├─vendor  // 
|  ├─utils // 工具
|  ├─styles // 样式
|  ├─store // vuex
|  ├─router // 路由
|  ├─layout // 项目布局
|  ├─icons // 图标，已废弃
|  ├─filters // 过滤器
|  ├─directive // 自定义指令
|  ├─components // 供复用的组件
|  ├─assets // 资源文件
|  ├─api // 接口
├─public // 公共目录
|   ├─favicon.ico
|   └index.html
├─build // 打包脚本
|   └index.js