V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
yazoox
V2EX  ›  程序员

旧事重提 - 大家创建一个新的正式项目,是用 create-react-app, eject 后改改配置还是自己搭,或者有更好的 boilerplate 推荐使用?

  •  
  •   yazoox · 2020-04-30 18:15:13 +08:00 · 4139 次点击
    这是一个创建于 1666 天前的主题,其中的信息可能已经有所发展或是发生改变。

    刚才搜索了一下,貌似有个 2017 的帖子讲这个。前端变化快,大家都知道。

    现在 2020 年了,如果创建一个正式项目,前端,还是 react & typescript,更复杂点比如再加上( redux/saga/mobx,等等)。

    大家是用 facebook 的 create-react-app,然后npm run eject,还是自己搭配呢?或者,有没有比较好的 boilerplate 推荐一下?

    谢谢!

    另,祝大家五一节目快乐!

    p.s. 本人自己用 create-react-app 试过,eject 后,感觉好"繁杂"...... p.s. 好痛苦......

    28 条回复    2020-05-14 20:45:57 +08:00
    fancy2020
        1
    fancy2020  
       2020-04-30 18:21:20 +08:00
    同样被这个问题困扰过,后来自己弄了个精简版的 boilerplate 项目:
    https://github.com/fanchangyong/react-express-starter-kit
    yuang
        2
    yuang  
       2020-04-30 18:28:33 +08:00 via Android
    建议不要 eject,eject 出来的配置太过复杂,改的头大,还不如重新用 webpack 搞
    FreMaNgo
        3
    FreMaNgo  
       2020-04-30 18:31:33 +08:00
    用 cra + react-app-rewired + customize-cra
    randyo
        4
    randyo  
       2020-04-30 18:33:34 +08:00 via Android
    eject
    Hanggi
        5
    Hanggi  
       2020-04-30 18:34:20 +08:00
    ng new app
    lichenshuai12138
        6
    lichenshuai12138  
       2020-04-30 18:44:07 +08:00
    @Hanggi hhhh
    well
        7
    well  
       2020-04-30 18:49:24 +08:00
    脚手架:react-boilerplate
    git clone --depth=1 github.com/react-boilerplate/react-boilerplate.git
    hantsy
        8
    hantsy  
       2020-04-30 19:05:46 +08:00
    react & typescript 还是用 CRA 生成 TS 项目。

    添加 ESLINT,Prettier 支持。https://dev.to/robertcoopercode/using-eslint-and-prettier-in-a-typescript-project-53jb

    不过,话说回来,TS 和 React 一起用感觉完全不如 Angular 中那么舒服。React 一直在改进 Hooks,但其重心一直是 Function,而不是 OOP 编程体验。对于 OOP 写法,在 React 中一直不受待见,作用 TS 唯一借用 TS 的 Strong Type 代替 Flow 类型检测而已。
    hantsy
        9
    hantsy  
       2020-04-30 19:13:29 +08:00
    不知道 React Create APP 有没有类似 Angular semantics 的机制,就我试用 RCA 的体验,感觉 RCA 出来的项目,添加其它配置也是比较麻烦的。
    ccraohng
        10
    ccraohng  
       2020-04-30 19:18:07 +08:00 via Android
    umijs
    lqzhgood
        11
    lqzhgood  
       2020-04-30 20:11:21 +08:00
    CRA 好难受~~ eject 一时爽 后面更难受……
    woniuppp
        12
    woniuppp  
       2020-04-30 20:27:23 +08:00
    umi
    uxstone
        13
    uxstone  
       2020-04-30 22:09:04 +08:00
    参考 CRA 中的 react-scripts 和 templates,自己定制两个 npm 包
    以后项目更新也只要修改版本号就行了

    原则上就是不要暴露太多与业务无关的脚手架配置,能隐藏到依赖中的尽量隐藏。
    tyrealgray
        14
    tyrealgray  
       2020-04-30 22:17:36 +08:00
    没事不要 eject,Facebook 给你维护后续各种工具不好吗?
    xuanbg
        15
    xuanbg  
       2020-04-30 22:18:46 +08:00
    搞个模板项目,然后都是复制粘贴改一改……
    liuzhaowei55
        16
    liuzhaowei55  
       2020-04-30 22:19:13 +08:00 via Android
    用阿里的 umi 最近更新了 3.0 新版本,相比以前配置简化了不少
    VDimos
        17
    VDimos  
       2020-04-30 22:20:16 +08:00 via Android
    CRA eject 这个体验真的糟糕,不知道为什么 react 官方推荐这个方式,相当糟心
    randyo
        18
    randyo  
       2020-04-30 22:23:37 +08:00 via Android
    不 eject 的话该配置简直不知道有多麻烦,各种报错,还得 eject 出来后才知道怎么改才不报错。说白了就是各种难改,vue-cli 好改多了
    lihongming
        19
    lihongming  
       2020-05-01 03:20:27 +08:00 via iPhone
    umijs+1

    虽然可能是 KPI 产物,但真的省事
    vone
        20
    vone  
       2020-05-01 09:49:35 +08:00 via Android
    试试 parcel?
    Mutoo
        21
    Mutoo  
       2020-05-01 12:23:34 +08:00
    目前用的是 react-boilerplate 在 /develop 上未发布的 5.0 版本,然后自己魔改过。
    yazoox
        22
    yazoox  
    OP
       2020-05-01 12:54:47 +08:00 via Android
    @vone
    这个 parcel 相当于什么工具? webpack?
    DOLLOR
        23
    DOLLOR  
       2020-05-01 13:47:29 +08:00 via Android
    开始我也不愿 eject,都是在项目内用各种奇技淫巧修修补补,担心 eject 出来的配置太复杂导致失控。但无奈这 CRA 实在是太简陋了,各种修补之后复杂度跟重建 webpack 还有啥区别。
    后来果断 eject,发现以前那些奇技淫巧才是在浪费时间。eject 后改那些配置文件没有传说中那么可怕,至少对写过 webpack 的我来说如此。
    ericgui
        24
    ericgui  
       2020-05-01 14:12:40 +08:00
    我现在觉得 parcel + babel 就够用了
    vone
        25
    vone  
       2020-05-01 16:39:31 +08:00 via Android
    @yazoox 自己看官网吧,有中文文档。有很多预设,使用体验比 webpack 好很多。
    yuanfnadi
        26
    yuanfnadi  
       2020-05-01 17:06:10 +08:00 via iPhone
    umijs

    路由,按需加载,antd,ts 还有一大堆东西你都不用管了。
    有人专人维护,内部大量使用。
    jinliming2
        27
    jinliming2  
       2020-05-01 20:07:08 +08:00 via iPhone
    我是自己搞了一套自用的模板,随时更新,新项目用最新的搭,基本上就是 git clone 然后删 .git 重新 git init,然后 yarn……
    create react app 感觉太重了(很多用不到的东西,不想留着
    yazoox
        28
    yazoox  
    OP
       2020-05-14 20:45:57 +08:00
    @jinliming2 能分享一下么?我去看看,学习一下!
    thx.
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1046 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 22:33 · PVG 06:33 · LAX 14:33 · JFK 17:33
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.