我决定放弃dva并自己搭一个基于TypeScript的脚手架

ant谱系简单介绍

  • dva
    dva是三个机缘react和redux的轻量级框架,其命令工具为dva-cli,官网/Github,概念来自elm,协助side effects、热替换、动态加载、react-native、SSRubicon等。近日已在Ali之四川中国广播公司泛应用于蚂蚁金服业务。
  • ant-init
    听他们讲dva的一个调升版本,近来仅还不安静,主要用于demo项目,教程,Github;
  • atool-build
    依照webpack1的三个react脚手架工具,教程,Github
  • dva-cli +droa
    droa 八个实用web开荒插件

  • roadhog
    roadhog 四个基于create-react-app可配的命令行工具,是限制型配置,基于 JSON 格式,给出有限的配置方式;atool-build + dora 是扩充型,表现为插件和编制程序 webpack.config.js 的方式。
    roadhog VS droa

PS:
体系支出须知:

  • droa 开垦服务器,叁个适中的插件话调节和测量试验服务,插件有webpack、proxy、simulator等;
  • atool-build 打包工具
  • droa-plugin-webpack droa的插件,用于和atool-build整合
    补充:
  • antd-tools ,基于atool-build封装的开垦ant-design用的工具
  • ant-tool,二个group的名字,内部含有了幼功创设atool-build,测验atool-test、文书档案atool-doc等劳动;

axios:fetch也不用啦,哪个小用哪个。

没什么好说的,依旧看代码吧,假如您感到能够优化也可以github:

代码在这里地

mobx:TypeScript包容上比较好,能够感到到更轻一点。

react-router v4:看看文书档案配置起来实在很好用。

React-Router v4真的是将前端路由发挥的很好,能够很利索的配置,满含按需加载、事件监听等等,dva也很好,把路由的主干都投身了一块儿,可是类如本身想在Route里面写render好像变难了,无法把models注入里面。一些像样鸡肋,有的时候候很好用的效劳在dva里面变得更难了,小编想笔者要摈弃了。

TypeScript的加载器有七个,awesome-typescript-loaderts-loader,小编比较支持于前三个,更加快。不过本人的门类中用了ts-loader,因为引进了antd,为了不用bable,作者用ts-import-plugin加载样式,在各类本子的尝尝下,用前卫版的awesome-typescript-loader累计最新版的antd并无法很好的加载antd的体制。

webpack零配置啊,那点实乃省了过多查看各样loader和插件版本难题的光阴,按需加载这种也不用去翻文书档案了,叁个true就可以,但是越来越封装的好,可灵活安顿的就越少.webpackrc文件可以配备的也非常少。打包dist下生成0.async.js ..... 31.async.js,几拾叁个文本真的逼死情感障碍。作者想笔者又要放弃了。

爆冷门想用TypeScript重构一下等级次序,怕现在职业越来复杂,项目更大,此前写的会遗忘。dva是支撑TypeScript的,然而配置路由中,因为使用了dva/dynamic,总会有风流浪漫对奇古怪怪的报错消息,最后找到了一流的施行方法,正是把Umi引进进来,早先看官方说的类nextjs的框架,果决放弃了,因为本人用不到,用了后来才知晓,嗯……相像nextjs结构吧,和nextjs好像从没太多相符之处,因为dva+umi+roadhog才是四个完完全全的页面+路由+服务的精品执行。作者的体系认为更是大了,作者想本身要抛弃了。

安贫乐道说,dva真的很好用,下载下来今后平素写作业逻辑代码就足以了,基本不用理会webpack怎么着布署,项目协会怎么兼顾,以至本身得以绝不知道redux的数据流是如何的、saga如何地理异步、react-router路由是什么,怎么按需加载,都得以付出,只要知道react语法就水到渠成了一半,更开玩笑的是,作者只怕用到的插件,在node_modules下后生可畏搜求,基本都有了,差不离不用太有利,然则,小编照旧有必须要遗弃的说辞。

幸幸苦苦项目算是跑起来了,能够认为打包运行时刻好长啊,果然做开采依然要配三个好点的微管理机,不过,小编调控只怕废弃了。

async/await:如今拿它代表一下saga,感觉够用。

tsconfig.json:主借使生机勃勃对ts语法转变的配备,有一些像bable所做的业务,可是小编不想用bable,在管理async/await的时候,要加上"lib": ["es6", "dom"]

webpack4:不是看中它宣传的零配置,真的打包速度比前几个本子快多数,记得单独安装webpack-cli。

其风姿浪漫小编就感到十分不得已了,roadhog也很好,为啥放到docker上运转npm run build就挂起了啊,英特网提了难点,最后照旧自问自答,开掘2.3.0就能够如此,依旧要降低到2.2.0。小编想要么甩掉把。

发二个包,方便用。假使您想尝尝一下

  • npm install -g rwt-cli
  • rwt init <name>
  • cd <name>
  • npm install
  • npm start翻看版本 rwt -v or rwt --version 目前是1.1.6

antd的本子如若3.0早先要在tsconfig.json中加"allowSyntheticDefaultImports": true

webpack:webpack4放弃了CommonsChunkPlugin,引入了optimization.splitChunks,还有optimization.runtimeChunk,搭配HtmlWebpackPlugin 用相比好。

各个版本先升到最新的,经常的话新本子众多会做品质优化。

本文由88必发唯一官网必发布于办公软件,转载请注明出处:我决定放弃dva并自己搭一个基于TypeScript的脚手架

相关阅读