混合反应引导和普通引导是一个坏主意

ver*_*ata 3 css react-bootstrap bootstrap-4

我正在开发一个大型团队项目,该项目有react-bootstrap 1.0.0 以及bootstrap 4.3.1 的css+js。一些开发人员更喜欢使用 React-Bootstrap 组件,而另一些开发人员更喜欢使用 Bootstrap 类来设置样式元素。所以我们最终得到了两种不同风格的代码:

<ListGroup>
  <ListGroup.Item>
    Cras justo odio
  </ListGroup.Item>
Run Code Online (Sandbox Code Playgroud)

<ul className="list-group">
  <li className="list-group-item">
    Cras justo odio
  </li>
Run Code Online (Sandbox Code Playgroud)

如果继续这样下去,我们可能会遇到什么障碍?

我看到的一个问题可能是将来升级react-bootstrap 或bootstrap。由于react-bootstrap依赖于bootstrap,因此升级一个需要同时升级另一个。这意味着同时遵循两种迁移策略。

Qua*_*yen 6

答案可能会因你问的人而异,但我怀疑大多数人都会同意这是一个坏主意。确实不存在“只是不一致”这样的事情。应该避免这种情况的很多原因都可以归结为某个地方的某些事物不一致。这里有一些例子:

  • 跨库交互- 我认为最大的原因是 Bootstrap 是一个 DOM 操作的 JavaScript 框架,而 React 是一个 JavaScript UI 库。换句话说,Bootstrap 可能会意外修改 React 组件,从而导致意想不到的副作用。想象一下使用 jQuery 来操作你的 React 组件。使用 Bootstrap,这实际上就是您正在做的事情。React Bootstrap 的构建是为了复制 Bootstrap,JS 实现是从头开始重建的,但重用了核心 BS JS 可以定位的类名。
  • 速度/性能- 通过包含 Bootstrap 和 React Bootstrap,您将拥有两个具有完全相同目的的依赖项。无论它有多小,您都可以通过删除其中一个来节省一些额外的字节。
  • 可维护性- 如果您的应用程序需要更新,您要么需要找到具有特定专业知识的人,要么让某人学习这种风格。即使所有开发人员都熟悉这两种风格,在两种不同的思维方式之间切换也会让人感到困惑。
  • 可预期性- 应用程序的哪些部分使用哪种风格?你怎么知道?开发人员如何知道何时需要切换样式?如果整个应用程序保持一致,那么每个人都会更容易,而不是通过抛硬币来决定何时使用什么。
  • 招聘/培训——在任何团队中,更不用说大型团队,人们都会来来去去。因此,如果您失去了一名开发人员并需要替换他们,那么这是一个需要考虑的额外因素,无论是在招聘流程本身还是(更有可能)培训的一部分。