通用 React 框架 Next.js 发布 5.0 版本

  • Kevin Ball
  • 宋康婧

2018 年 3 月 1 日

话题:JavaScript语言 & 开发

看新闻很累?看技术新闻更累?试试下载 InfoQ 手机客户端,每天上下班路上听新闻,有趣还有料!

Next.js是用于通用 React.js 应用程序的开源工具包,已发展到 5.0 版本。这个版本改进了 Next.js 应用程序的可配置性,加入了对服务端 Webpack 的支持以及针对模块化配置的插件系统。它还增加了对 TypeScript 的支持,能更好地支持诸如 Preact 之类的 React 替代包(alt-libs),同时也增加了名为 Zones 的多应用程序组合功能。

Next.js 在最初的版本里就支持自定义 Webpack 配置,但最新版本克服了一些主要限制。在版本 5.0 的发布介绍里,Next.js 开发人员 Tim Neutkens 和 Arunoda Susuripala 如此解释:

如果 Webpack 只能在客户端(浏览器端)打包(bundle)执行,你将错过使用这个强大的工具链进行服务器渲染的可能性。

我们很高兴地宣布,我们已经扩展重构了代码库,使得 Webpack 既可以在客户端也能在服务端执行。

对你们来说,所有的变化仅仅只是向装饰器函数传递一个额外的 isServer 属性。但是,这个新的语法意味着,现在你可以使用应用范围更广的 Webpack 装载机(loaders)了。

这个功能可以更好地控制 Next.js 的配置,为了提供更简单的方法来管理配置,Next.js 创建了用于配置的插件系统,并建立了常用可复用插件的开源仓库。在撰写本文时,已有的可用插件包括用于导入 css、less 和 scss 的配置,以及为在项目中使用 Preact 或 TypeScript 做的配置。社区已经有人发起合并请求(pull requests),为GraphQL 标签以及Webpack 打包分析器等功能添加插件。

这个插件架构也是在 Next.js 里为什么能有最好的 TypeScript 支持的原因,它使得在 Next.js 应用程序中,只需要两行简单的代码就能开始使用 TypeScript 了:

const withTs = require('next-typescript');
module.exports = withTs({ /* additional config*/ })

在 React etc 博客里的一篇文章中,Jorgé回应:

Next.js 持续地对用户提出的支持有用功能的请求作出响应。这再次证明了 TypeScript 如何像风暴一样影响 JavaScript 社区。TypeScript 不仅提供 Typing 和额外的语言功能,还提供非常强大的调试和重构功能。

由于使用 TypeScript 可以很好地编写 React 应用程序,因此这个功能将给 Next.js 的开发带来更好的开发体验。

Next.js 5.0 还增加了一个名为“Zones”的功能,文档里称这个功能可以将多个 Next.js 应用程序合并到一个应用程序中:

这与微服务的概念完全相同,只不过它针对的是前端应用。

这个功能与代理相结合,允许你使用 React 的标签来链接其他的应用程序,使得原本相隔离的应用程序能够无缝集成。为了方便开发和部署,开发团队发布了一个名为微代理(microproxy)的 Node 包,这个功能也可以很好地与 NGINX 和 HAProxy 等传统代理解决方案搭配使用。

查看英文原文:Universal React Framework Next.js Releases Version 5.0

JavaScript语言 & 开发