You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
160 lines
5.4 KiB
160 lines
5.4 KiB
## 运行步骤 |
|
- 安装共享目录下的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 进行代码格式化 |
|
```json |
|
{ |
|
"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](https://www.cnblogs.com/alice-fee/p/8038367.html) |
|
- 火狐浏览器安装 vue-devtool：直接上扩展组件搜索 |
|
|
|
## 相关文档 |
|
- [vue](https://cn.vuejs.org/v2/guide/)，构建数据驱动的 web 界面的渐进式框架 |
|
- [vue-router](https://router.vuejs.org/zh-cn/)，vue 路由管理 |
|
- [ECMAScript 6](http://es6.ruanyifeng.com/)，JavaScript 语言的下一代标准 |
|
- [ESLint](http://eslint.cn/docs/user-guide/configuring)，用于统一 JS 代码风格 |
|
- [JavaScript Standard Style](https://standardjs.com/readme-zhtw.html)，JS 编码风格规范，用于 ESLint |
|
- [element-ui](http://element.eleme.io/#/zh-CN/component/installation)，UI 框架 |
|
- [Vuex](https://vuex.vuejs.org/zh-cn/)，vue 状态管理 |
|
- [axios](https://github.com/mzabriskie/axios)，ajax 库 |
|
- [webpack](http://webpack.github.io/)，前端打包工具 |
|
|
|
## 发布 |
|
```bash |
|
# 构建测试环境 |
|
npm run build:test |
|
|
|
# 构建生产环境 |
|
npm run build:prod |
|
``` |
|
|
|
## 其它 |
|
|
|
```bash |
|
# 预览发布环境效果 |
|
npm run preview |
|
|
|
# 预览发布环境效果 + 静态资源分析 |
|
npm run preview -- --report |
|
|
|
# 代码格式检查 |
|
npm run lint |
|
|
|
# 代码格式检查并自动修复 |
|
npm run lint -- --fix |
|
``` |
|
|
|
## 项目结构 |
|
```bash |
|
├─.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 |
|
``` |