游客发表
9 月 16 日,全栈 Web 框架 Remix 郑重揭橥了 2.0 版本,Remix 团队在揭橥 1.0 版本后颠末近 2 年的链接致力,揭橥了 19 个次要版本、100 多个补丁版本,pp平台并解阁阁了数千个题目和拉捏请求,终竟迎来了第二个症结版本!
Remix 拥有以下特质:
- 追求速率、用户阅历(UX),赞助任何 SSR/SSG 等
- 基于 Web 根柢身手,如 HTML/CSS 与 HTTP 以及 Web Fecth API,在绝大部门状态能够不倚赖于 JavaScript 运转,是以能够运转在职何环境下,如 Web Browser、Cloudflare Workers、Serverless 能够 Node.js 等
- 客户端与服务端雷同的拓荒阅历,客户端代码与服务端代码写在一个文献里,无缝进行数据交互,同期基于 TypeScript,规范界说能够跨客户端与服务端共用
- 内阁阁文献即路由、动静路由、嵌套路由、资源路由等
- 去遗失 Loading、骨架屏等任何加载状态,页面中集体资源都能够预加载(Prefetch),页面险些能够随机加载
- 辞行以往瀑布式(Waterfall)的数据赢得捏花式,数据赢得捏在服务端并行(Parallel)赢得捏,生成齐备 HTML 文档,访佛 React 的并发特质
- 提供拓荒网页须要集体状态,户口箱即用;提供集体须要骗捏的组件,蕴涵
、
、
、
、
,用于责罚元音问、脚本、CSS、路由和表单相故故的本色
- 内阁阁错误责罚,针对非预期错误责罚的
和拓荒者抛靡烂误责罚的
Remix 是一个由 React Router 拓荒团队所拓荒的基于 React 和 TypeScript 的全栈框架。2021 年 11 月,Remix 郑重户口源,至今已在 Github 上赢得了 24.6k star。Remix 郑重户口源时,鞭策了前端圈不小的眷注,其被集领会为是 Next.js 的遒劲敌手,那时隔两年,它和 Next.js 之间的“较量”怎样样了呢?
而今,Next.js 领有 112k star,是 Remix 的近 5 倍。Next.js 周下载量 279 万,而 Remix 仅有 1.4 万,Next.js 是 Remix 的近 200 倍。可见,Remix 并莫得像行家预测的那样,成为 Next.js 的有劲较量敌手,在拓荒者社区中惟有较小的市集份额。纵然这样,Remix 照样然迷茫了极少拓荒者,而且在特定领域或项目中有其优势和适用性。
底下就来顾念记挂顾念记挂 Remix 2.0 都有哪些革新!
create-remix
夂箢行工险些验。Remix v2曾经进犯了对React和Node的最低版本赞助,并郑重赞助以下版本:
以下来日记号已被移除,而且它们的行径而今是默许的,而今能够从remix.config.js
文献中苟简这些配阁阁。
v2_dev
,新的拓荒服务器,拥有HMR + HDR,要是在future.v2_dev
中有配阁阁而不只是是布尔值(譬喻,future.v2_dev.port
),能够将它们擢升到remix.config.js
华厦根dev
目的中。v2_errorBoundary
,移除了CatchBoundary
,改为骗捏单个ErrorBoundary
v2_headers
,编削了嵌套路由场景华厦头部逻辑v2_meta
,编削了meta()
的返回花色v2_normalizeFormMethod
,将formMethod
规范化为大写v2_routeConvention
,而今默许状态下,路由骗捏扁平化路由约定底下列出了 Remix v1 中拥有弃用鉴戒的此外首要订正/API 苟简。要是骗捏的是最新1.19.3版本且莫得任何限度台鉴戒,那么能够能够连缀践诺集体这些独霸!
(1)有龙套性订正/API移除
browserBuildDirectory
重定名为assetsBuildDirectory
devServerBroadcastDelay
devServerPort
重定名为dev.port
future.v2_dev.port
,但在静止的2.x版本中,它将是dev.port
serverModuleFormat
从cjs
订正为esm
serverBuildTarget
serverBuildDirectory
订正为serverBuildPath
polyfill
,必须通过serverNodeBuiltinsPolyfill
采纳进去polyfill
苟简useTransition
苟简fetcher.type
并缩短fetcher.submission
而今更详细地被归类为state:“loading”
,而不是state:“submitting”
,以更好地与底层的GET请求维持雷同
请求camelCased
版本的imagesrcset/imagesizes
(2)莫得弃用鉴戒
此版本没能在每个龙套性订正或API移除上都收到铲除鉴戒。以下是能够须要稽查的糟粕迁移列表,以进犯到v2:
browserNodeBuiltinsPolyfill
选项采纳进去polyfill
PostCSS/Tailwind
将默许启用,能够通过postcss和tailwind记号禁用此职能苟简createCloudflareKVSessionStorage
设施
不再赞助@cloudflare/workers-types v2和v3
@remix-run/dev
苟简REMIX_DEV_HTTP_ORIGIN
,施行REMIX_DEV_ORIGIN
苟简REMIX_DEV_SERVER_WS_PORT
,施行dev.port
或--port
苟简--no-restart/restart
记号,施行--manual/manual
苟简--scheme/scheme
和--host/host
,施行REMIX_DEV_ORIGIN
苟简codemod
夂箢
@remix-run/eslint-config
苟简@remix-run/eslint-config/jest
配阁阁
苟简魔法imports
的ESLint鉴戒
@remix-run/netlify
@remix-run/netlify
适配器已被苟简,选举骗捏Netlify官方适配器
@remix-run/node
默许不再对fetch
进行polyfill
,运用须要调用installGlobals()
来装阁阁polyfills
不再从@remix-run/node
导出fetch
和相故故 API,运用应骗捏集体定名空间华厦版本
运用须要调用sourceMapSupport.install()
来配阁阁源照耀赞助
@remix-run/react
苟简unstable_shouldReload
,施行shouldRevalidate
@remix-run/serve
要是3000端口被占用且未指定PORT,则remix-serve
将采纳一个可用的端口
集成手动模式
苟简未记载的createApp Node API
在remix-serve
中维持动静imports以供外部bundle骗捏
@remix-run/vercel
@remix-run/vercel
适配器已被苟简,选举骗捏Vercel官方提供的职能
create-remix
甩手通报isTypeScript
给remix.init
脚本
remix
苟简魔法 exports
(3)龙套规范迁移
future.v2_meta
规范中苟简了 V2_
前缀,鉴于它们而今是默许行径。V2_MetaArgs
-> MetaArgs
V2_MetaDescriptor
-> MetaDescriptor
V2_MetaFunction
-> MetaFunction
V2_MetaMatch
-> MetaMatch
V2_MetaMatches
-> MetaMatches
V2_ServerRuntimeMetaArgs
-> ServerRuntimeMetaArgs
V2_ServerRuntimeMetaDescriptor
-> ServerRuntimeMetaDescriptor
V2_ServerRuntimeMetaFunction
-> ServerRuntimeMetaFunction
V2_ServerRuntimeMetaMatch
-> ServerRuntimeMetaMatch
V2_ServerRuntimeMetaMatches
-> ServerRuntimeMetaMatches
unknown
而不是any
,并与底层的React Router规范维持雷同:将useMatches()
的返回规范从RouteMatch
更名为UIMatch
将LoaderArgs
/ActionArgs
更名为LoaderFunctionArgs
/ActionFunctionArgs
将AppData
的规范从any
改为unknown
将Location["state"]
(useLocation.state
)的规范从any
改为unknown
将UIMatch["data"]
(useMatches()[i].data
)的规范从any
改为unknown
将UIMatch["handle"]
(useMatches()[i].handle
)的规范从{ [k: string]: any }
改为unknown
将Fetcher["data"]
(useFetcher().data
)的规范从any
改为unknown
MetaMatch.handle
(在meta()
函数中骗捏)的规范从any
改为unknown
AppData
/RouteHandle
不再导出,鉴于它们只是unknown
的又名
create-remix
夂箢行界面用具--template
参数和连缀拉长的可用模板列表。--overwrite
参数bun
包解决器build.mode
试验构建模式serverNodeBuiltinsPolyfill.globals
/browserNodeBuiltinsPolyfill.globals
来对Node集体目的进行polyfill
redirectDocument
适用用具,通过重新加载文档落成重定向meta
参数中补充error
,以便能够衬着错误题目等unstable_createRemixStub
而今赞助在stubbed Remix路由上补充meta/links
函数unstable_createRemixStub
不再赞助在路由上骗捏element/errorElement
属性。必须骗捏Component/ErrorBoundary
与从Remix路由模块导出的本色结婚。route.lazy
设施在导航时加载路由模块。@remix-run/node
华厦atob/btoa
polyfills,改用内阁阁版本。@remix-run/dev
包与@remix-run/css-bundle
包的本色解耦。@remix-run/css-bundle
包的本色无缺由Remix编译器解决。纵然照样然疏间Remix倚赖项分享雷同的版本,但这个迁移确保在进犯@remix-run/dev
而不进犯@remix-run/css-bundle
时莫得运转时错误。remix-serve
而今将采纳一个闲逸的端口(要是3000端口被占用)。emix-serve
将骗捏该端口。remix-serve
将采纳一个闲逸的端口(除非3000端口已被占用)。react-router-dom@6.16.0
@remix-run/router@1.9.0
@remix-run/web-fetch@4.4.0
@remix-run/web-file@3.1.0
@remix-run/web-stream@1.1.0
Remix 马虎 React Server Components(RSC)的赞助阴谋是踊跃的。他们谋略在Remix v3中补充对RSC的赞助,并谋略能够露出这项身手在多个框架华厦能力。
RSC是一个风趣且重大的职能,然而 Remix v2 是基于面前静止的React特质构建的,所以 RSC 在 Remix v2 中尚未贮蓄。一朝RSC静止下来,Remix 将会赞助它。
然而,与曾经赞助的此外React特质相比,“赞助RSC”须要更长远的集成。RSC的异步组件与Remix的加载器和组件麇集得额外顺应,而且Remix在v3中顶多遗弃骗捏第三方库useLoaderData,所以在数据加载方面能够会有所迥异。他们谋略拓荒者只须要将现有的加载器代码迁移到新的异步组件中,但须要瞩目数据倚赖的瀑布效应。
Remix团队在本年早些韶华的Remix Conf上与React重点团队的成员进行了一个辩说会,辩说了RSC以及若何结伴鼓吹这项身手的静止揭橥。他们以种种花式附和预备RSC,并谋略能够获胜地集成它到Remix中。
责任编辑:姜华 源泉: 前端充电宝 RemixNext.js随机阅读
热门排行
友情链接