Create React App 2.0 正式发布: 支持 Babel?7,Sass 等等

10年服务1亿Tian开发工程师

注:本文翻译自 React 官方博客,并且已经更新到最新的 React 中文文档中,你也可以在这里查看本文:

Create React App 2.0 已于今天发布,它在一些单独依赖项更新中带来了一年的改进。

虽然 React 本身 ,但是在没有快速测试运行器,用于生产环境的压缩工具和模块化代码库的情况下,编写一个复杂的应用程序可能具有一定的挑战性。 从第一个版本开始, 的目标就是帮助您专注于最重要的事情上 – 您的应用程序代码 – 而 Create React App 会为您处理构建和测试相关的事宜。

Create React App 依赖的许多工具已经发布了包含新功能和性能改进的新版本:, , 和 。但是,手动更新它们并使它们能够很好地协同工作需要花费很多精力。 这正是 在过去几个月一直在忙的事情:迁移配置和依赖项,这样您就不需要自己动手了

现在 Create React App 2.0 完成了测试,正式发布了,让我们看看有什么新东西以及如何尝试它!

注意

升级任何东西请不要感到有压力。 如果您对当前版本的功能集,性能和可靠性感到满意,则可以继续使用当前版本! 在转换到生产环境之前,让2.0版本稳定一点也可能是一个好主意。

有哪些新特性

以下是这个版本中一些新功能的简短摘要:

  • 更多样式选项:您可以直接使用 (Sass 中文文档) 和 。
  • 我们更新到了 (https://babeljs.io/blog/2018/08/27/7.0.0),包括支持 ,并修复了很多 bug。
  • 我们更新到了 ,它可以更智能地自动拆分JS包。
  • 我们更新到了 ,其中包括用于查看快照的 。
  • 我们添加了 ,因此您可以在旧浏览器中使用新的CSS功能。
  • 您可以使用 ,,,和其他第三方转换。
  • 现在可以,并在JSX中使用它。
  • 您可以尝试实验性的 ,以删除 node_modules
  • 现在,您可以在开发中,以匹配后端API。
  • 您现在可以使用为 而不会破坏构建。
  • ?? 如果您只打算兼容现代浏览器,现在可以选择获得较小的CSS包。
  • ♀? 现在可以选择性加入 Service Worker,并使用 Google 的 Workbox 构建。

所有这些功能都是开箱即用的 – 要启用它们,请按照以下说明操作。

用 Create React App 2.0 开始一个新项目

您无需特地的更新任何内容。 从今天开始,当您运行 create-react-app 时,它将默认使用2.0版本的模板。 祝你玩得开心!

如果由于某种原因想要继续使用旧的 1.x 模板,你可以在 create-react-app 后面跟上参数[email protected] 来实现。

将一个项目更新到 Create React App 2.0

将一个 non-ejected 项目升级到 Create React App 2.0 通常应该很简单。 在项目的根目录中打开 package.json ,然后找到 react-scripts

然后将其版本更改为 2.0.3

  // ... 其他依赖项 ...
  "react-scripts": "2.0.3"

运行 npm install(如果你试用Yarn,则运行 yarn)。对于大多数项目来说,修改这一行配置就够了!

在这里,还有一些技巧可以帮助您入门。

当你在升级后第一次运行 npm start,你会得到一个提示,询问你想要支持哪些浏览器。按 y 接受默认值。它们会被写入你的 package.json 中,你可以随时编辑它们。Create React App 将使用此信息生成较小或 polyfill 的 CSS 包,具体取决于您的目标是以现代浏览器还是旧浏览器。

如果在升级后,npm start 仍然不能正常工作,请。在这个版本中有一些重大变化,但是它们的范围是有限的,所以应该不需要花费几个小时来解决问题。请注意,现在可选的,这样以减少 polyfill 的大小。

如果您之前已经 ejected 但现在想要升级,一个常见的解决方案是找到您 ejected 的提交(以及任何后续提交更改配置),还原它们,升级,然后再选择再次 ejected 。你现在支持开箱即用的功能(也许是 Sass 或 CSS Modules?)可能已经提供了内置支持。

注意

由于 npm 中可能存在错误,您可能会看到有关 unsatisfied peer 依赖项的警告。 你应该可以忽略它们。 据我们所知,Yarn 没有这个问题。

重大更改

以下是此版本中重大更改的简短列表:

  • 不再支持Node 6。
  • 对旧版浏览器(例如 IE 9 到 IE 11 )的支持现在可选的,你可以使用。
  • 使用 import() 进行代码拆分,现在更接近于规范,禁用了 require.ensure()
  • 默认的 Jest 环境现在包含了 jsdom 。
  • 支持将对象指定为 proxy 设置已替换为对自定义代理模块的支持。
  • 删除了对 .mjs 扩展的支持,直到它周围的生态系统稳定下来。
  • PropTypes 定义会自动从生产版本中删除。

如果这些点中的任何一个对您有影响,请查看中更详细的说明。

更多学习

您可以在 中找到完整的更改日志。 这是一个更改很大的版本,我们可能错过了一些东西。 你也可以向我们的 报告任何问题,我们会尽力提供帮助。

注意

如果您一直在使用 2.x alpha 版本,我们会为它们提供 。

赞(1) 打赏
未经允许不得转载:WEBTian开发 » Create React App 2.0 正式发布: 支持 Babel?7,Sass 等等

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

Tian开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏