(踩坑回忆录)Dva踩坑与解决方案

前言

问题

antd-pro组件的使用

1. 首先到antd-pro，使用git命令clone项目
2. 项目目录中找到src/components
3. 找到你想用的组件，例如 我想使用chart(图表),将整个Charts文件夹拷贝到我们的dva项目的components目录下
4. 例如我想使用Pie，那么 import {Pie} from '../../components/charts',也可以配置webpack 使用别名"@"
5. 重启应用，各种缺少依赖，相应安装
6. 如果出现react-dom的报错，估计是webpack的配置问题，去掉webpack.config.js进行尝试。
7. 最后，引入成功 不报错后， 可以按照antd-pro的使用文档，配置使用。

antd-pro Pie的小数使用

定位yuan函数，将const yuan = val => ¥ ${numeral(val).format('0,0')};改为const yuan = val => ¥ ${numeral(val).format('0,0.00')};

dva配置webpack支持模板与资源分离的组件动态加载

概要

1. dva/dynamic 配置组件动态加载=》代码拆分=》多个异步脚本=》chunk.js
2. dva/roadhog 配置 SET_PUBLIC_PATH 开启 webpack 临时变量暴露
3. 服务器模板脚本 写入window.__webpack_public_path__ = "资源服务器地址"
4. dva/roadhog/template/setPublicPath.js 读取外部变量 赋值。setPublicPath.js

小结

未完待续...
持续追更...