Web前端
项目结构
├─build├─build ├─dist // 项目打包之后的文件存放的目录 ├─mock // 模拟后台接口,返回数据给前端测试 ├─node_modules // 依赖安装目录 ├─public // 存储一些静态资源 ├─src │ ├─api // 存放向后台发请求的方法 │ │ ├─enterprise │ │ ├─login │ │ ├─shiftScheduling │ │ ├─statistics │ │ ├─system │ │ └─thirdParty │ ├─assets // 存储静态资源 │ │ ├─404_images │ │ ├─aliIconfont // 阿里巴巴矢量图标库 │ │ ├─login │ │ │ ├─img │ │ │ ├─plugins │ │ │ │ ├─axRate │ │ │ │ ├─axTree │ │ │ │ │ └─icons │ │ │ │ └─ztree │ │ │ │ └─images │ │ │ └─xiaoBaiTemplate │ │ ├─logo │ │ ├─panel │ │ └─regist │ │ └─img │ ├─components // 存放页面组件 │ │ ├─Breadcrumb │ │ ├─constant │ │ ├─DynamicTitle │ │ ├─Hamburger │ │ ├─ImageCropper │ │ │ └─utils │ │ ├─InstrumentPanel │ │ ├─Message │ │ ├─MonthSelect │ │ ├─Pagination │ │ ├─PanThumb │ │ ├─ParentView │ │ ├─PictureUpload │ │ ├─SvgIcon │ │ └─YearMonthSelect │ ├─icons │ │ └─svg │ ├─layout // 网站主布局文件 │ │ ├─components │ │ │ └─Sidebar // 侧边栏组件 │ │ └─mixin │ ├─router // 路由 │ ├─store // 缓存已登录用户的一些信息,方便页面直接取用,如token、头像、用户名…… │ │ └─modules │ ├─styles // 存放样式文件,即css文件 │ │ ├─background │ │ ├─chart │ │ ├─weekly │ │ └─xiaoBaiLogin │ ├─utils // 存放一些工具方法 │ │ ├─common │ │ └─shiftScheduling │ └─views // 存放页面,有的组件也放在里面(不太规范) │ ├─dashboard │ │ ├─enterpriseManager │ │ ├─storeManager │ │ └─systemManager │ ├─editor │ ├─enterprise │ │ ├─enterprise │ │ ├─organization │ │ │ ├─role │ │ │ └─user │ │ ├─rule │ │ └─store │ │ ├─festival │ │ ├─message │ │ ├─position │ │ ├─store │ │ └─user │ ├─login │ ├─scheduling │ │ ├─result │ │ └─task │ └─system │ ├─log │ │ ├─login │ │ └─operation │ └─menu └─tests // 我没用到这个 └─unit ├─components └─utils
开发环境介绍
开发环境 | 版本 |
node | 16.18.1 |
npm | 8.19.2 |
修改配置文件
安装依赖
npm install
启动
可以使用命令 npm run dev,或者下图的方式
小程序
IDE
小程序基于uniapp开发,需要下载HbuilderX做来作为开发工具,官网链接
使用HbuilderX打开项目,如下图
安装依赖
配置AppID
配置小程序开发工具
改成你的小程序开发工具的路径
打开微信小程序的服务端口
运行项目