Next.js 9.3 vini ak sipò pou jenerasyon sit estatik, 404 optimize ak plis ankò

Next.js 9.3

Next.js se yon fondasyon reyaji pou rann sèvè-bò, ki kreyatè li yo prezante kòm yon konfigirasyon zewo sèl kòmand zouti pou reyaji aplikasyon yo.

Sa a ankadreman bay yon estrikti komen ki pèmèt ou fasil kreye yon reyaji aplikasyon devan-fen ak transparan jere sèvè-bò rann. Next.js vèsyon 9.3 te lanse nan Lendi ak karakteristik nouvo ak kèk amelyorasyon, nan ki nou ka jwenn kapasite nan jenere sit estatik kòm kado prensipal la.

Ki sa ki nan nouvo nan Next.js 9.3?

Avèk liberasyon Next.js 9.0, fondasyon an prezante konsèp nan estatik optimize otomatik yo. Lè yon paj pa gen okenn kondisyon bloke rekiperasyon done tankou getInitialProps, pral otomatikman rann nan HTML yon fwa li te bati.

Gen lòt ka kote ou ta ka vle fè yon paj nan HTML estatik nan tan konpile, menm avèk bloke done ekstraksyon kondisyon. Sa a se ka a, pou egzanp, nan paj maketing patrone pa yon sistèm jesyon kontni (CMS).

Next.js 9.3 entwodui de nouvo metòd rekiperasyon done: getStaticProps ak getServerSideProps.

Nouvo metòd sa yo gen anpil avantaj sou modèl getInitialProps lakòm gen yon distenksyon klè ant sa ki pral vin SSG (Static Side Generation) ak SSR (Server Side Rendering). Yo se testaman API.

Tout karakteristik nouvo yo bak konpatib ak ka adopte piti piti. Pa gen okenn depresyasyon ak getInitialProps kontinye ap travay nòmalman. Yon paramèt getStaticPaths te ajoute pou jwenn routage dinamik.

  • getStaticProps: pèmèt jwenn done pandan konstriksyon;
  • getStaticPaths - Espesifye done ki baze sou dinamik routage;
  • getServerSideProps: pèmèt ou jwenn done pou chak demann.

Yon lòt chanjman ki vle di soti nan nouvo vèsyon sa a se sipò pou mòd preview la. Entwodwi getStaticProps nan Next.js louvri nouvo posiblite, tankou lè l sèvi avèk Next.js rann kapasite sou demann nan sèten kondisyon.

Kòm egzanp lè preview yon bouyon Nan yon CMS, ou pral vle sote rann la estatik ak rann paj sou demann ak kontni bouyon olye pou yo pibliye kontni. Ou vle Next.js sote estatik bati sèlman nan ka sa a espesifik. Dapre ekip Next.js la, mòd preview la pèmèt ou fè sa.

Mòd nan preview pèmèt itilizatè yo sote paj la pwodwi statikman retounen sou demann (SSR) yon paj bouyon, pou egzanp ki sòti nan yon CMS. Sepandan, li pa limite a sèten sistèm CMS. Preview mòd entegre dirèkteman ak getStaticProps ak getServerSideProps pou li ka itilize ak nenpòt ki kalite solisyon rekiperasyon done.

Next.js 9.2 te ajoute sipò pou bati-an CSS, men Next.js 9.3 te ajoute sipò pou Sass. Fèy style Global ak CSS modil yo sipòte, osi byen ke entegre CSS. Next.js kounye a sipòte CSS modil ak dosye Sass lè l sèvi avèk konvansyon an nonmen non [non] .module.scss. Kontrèman ak sipò ki deja disponib nan Next.js 5+ ak pwochen-sass, Sass mondyal la ak CSS modil kapab kounye a coexist.

Modil CSS pèmèt ou jere Sass lokalman pa otomatikman kreye non klas inik.

Avèk vèsyon 9.0 soti nan Next.js, te gen yon paj ki pa te otomatikman rann nan HTML estatik: 404 paj.

Rezon prensipal ki fè dèyè sa a se ke paj la erè manje 404 la te okipe plis pase 404. Pou egzanp, li tou okipe erè. Depi 404 paj yo rann pou chemen ki pa egziste, rann paj la sou demann ta ka mennen nan pi wo depans ak pi wo chaj sèvè. Vèsyon chapant 9.3 amelyore bagay sa yo epi li ofri otomatik optimize estatik pou 404 paj.

Koulye a, lè demann ou an pa gen ladan yon error.js paj koutim, dosye a Next.js otomatikman jenere 404 paj estatikman epi li itilize li lè yo ta dwe sèvi yon 404. Sa rive otomatikman e pa gen okenn chanjman ki nesesè.

Ou kapab tou Customize paj sa a. Pou ranplase default 404 paj la, ou ka kreye yon dosye 404.js.

Si ou vle konnen plis bagay sou li, ou ka konsilte lyen sa a. 


Kontni an nan atik la respekte prensip nou yo nan etik editoryal. Pou rapòte yon erè klike sou isit la.

Se pou premye a fè kòmantè

Kite kòmantè ou

Adrès imèl ou pa pral dwe pibliye. Jaden obligatwa yo make ak *

*

*

  1. Responsab pou done yo: Miguel Ángel Gatón
  2. Objektif done yo: Kontwòl SPAM, jesyon kòmantè.
  3. Lejitimasyon: konsantman ou
  4. Kominikasyon nan done yo: done yo pa pral kominike bay twazyèm pati eksepte pa obligasyon legal.
  5. Done depo: baz done anime pa rezo Occentus (Inyon Ewopeyen)
  6. Dwa: Nenpòt ki lè ou ka limite, refè ak efase enfòmasyon ou yo.