Davinci可视化平台——前端部分代码开发
Davinci 是⼀个 DVaaS(Data Visualization as a Service)平台解决⽅案,⾯向业务⼈员/数据⼯程师/数据分析师/数据科学家,致⼒于提供⼀站式数据可视化解决⽅案。
Davinci源码⼤概分为三部分:
采⽤React的前端⼯程
采⽤Spring Boot的后端⼯程
采⽤Jekyll + Minmal Mistakes的⽂档⼯程,⽤来介绍Davinci的⽤户操作⽅法
本篇⽂章将介绍如何从整个⼯程中将前端部分代码抽离出来单独开发
笔者环境:
系统:Windows10 64位
Davinci:davinci-0.3.0-beta.8
node版本:v12.13.1
npm版本:6.12.1
⽬录
前端部分代码在Davinci源码根⽬录的 webapp/ ⽬录中
⽬录结构
├── app              # 主应⽤源码
├── assets          # 资源⽂件
├── components      # 通⽤组件
├── containers      # 路由容器组件
├── utils            # 通⽤实⽤⽅法
└── app.tsx          # 主应⽤⼊⼝
├── internals        # 开发⼯程⽂件
├── libs            # 改动后的项⽬依赖
├── server          # 开发服务器
├── share            # 分享页源码
└── package.json
开发环境
建议:
node: “>=8.10.0”
npm: “>=5”
安装依赖
免费平台源码资源网npm install
开发
根⽬录运⾏命令:
npm start
前后端联调:
为了⽅便前后端联调不跨域,开发环境下有请求代理,配置真实后台接⼝地址⽂件为:server/middlewares/addDevMiddlewares.js
Lint
npm run lint
Test
npm run test
打包
npm run build
常见问题
npm install执⾏过程中报错:npm ERR! Unexpected end of JSON input while parsing near ‘xxx’
解决办法:
删除掉已经⾃动⽣成的node_module⽂件夹,然后再运⾏如下命令
npm cache clean --force
npm install
npm install执⾏过程中报错:Error: Command failed: C:\WINDOWS\ /s /c,或者报错:Error: pngquant failed to build, make sure that libpng-dev is installed
解决办法:
换个⽹络环境重新执⾏npm install,确保⽹络能够访问到npm源和git源
npm start执⾏完后,可以正常访问登陆页⾯,但是控制台提⽰很多类似TS232的错误
解决办法:
这个可能是源码中的TypeScript语法不规范引起的,笔者将在后⾯尝试修复这些错误,这些错误不影响正常开发,可以忽略GitHub

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。