Next.js 9.3 wa pẹlu atilẹyin fun iranle aaye aimi, iṣapeye 404 ati diẹ sii

Itele.js 9.3

Next.js jẹ ilana Iṣeṣe fun sisọ ẹgbẹ-olupin, eyiti awọn akọda rẹ gbekalẹ bi iṣeto-ọrọ odo kanṣoṣo irinṣẹ irinṣẹ fun Awọn ohun elo atunṣe.

Fireemu yii pese eto ti o wọpọ ti o fun laaye laaye lati ṣẹda irọrun ohun elo Iṣe iwaju-fesi kan ati ni gbangba ṣiṣakoso atunṣe olupin-ẹgbẹ. Next.js ẹya 9.3 ti ṣe ifilọlẹ ni awọn aarọ pẹlu awọn ẹya tuntun ati diẹ ninu awọn ilọsiwaju, eyiti a le rii agbara lati ṣe awọn aaye aimi gẹgẹbi aratuntun akọkọ.

Kini tuntun ni Next.js 9.3?

Pẹlu itusilẹ ti Next.js 9.0, ilana naa ṣafihan imọran ti iṣapeye adaṣe aimi. Nigbati ọkan oju-iwe ko ni awọn ibeere idena imularada data bi getInitialProps, yoo ṣe ni adaṣe ni HTML ni kete ti o ti kọ.

Awọn ọran miiran wa nibiti o le fẹ ṣe oju-iwe ni HTML aimi ni akoko ikojọpọ, paapaa pẹlu didi awọn ibeere isediwon data. Eyi ni ọran, fun apẹẹrẹ, ti awọn oju-iwe titaja agbara nipasẹ eto iṣakoso akoonu (CMS).

Next.js 9.3 ṣafihan awọn ọna imularada data tuntun meji: getStaticProps ati getServerSideProps.

Awọn ọna tuntun wọnyi wọn ni ọpọlọpọ awọn anfani lori awoṣe getInitialPropsBii iyatọ ti o wa larin ohun ti yoo di SSG (Generation Side Static) ati SSR (Rendering Side Server). Wọn jẹ awọn afikun API.

Gbogbo awọn ẹya tuntun jẹ ibaramu sẹhin ati le gba di graduallydi gradually. Ko si irẹwẹsi ati getInitialProps tẹsiwaju lati ṣiṣẹ ni deede. A ti fi kun paramita getStaticPaths lati gba afisona agbara.

  • getStaticProps: ngbanilaaye gbigba data lakoko ikole;
  • getStaticPaths - Pato afisona ipa-ipa orisun data;
  • getServerSideProps: gba ọ laaye lati gba data fun ibeere kọọkan.

Iyipada miiran ti o duro lati ẹya tuntun yii jẹ atilẹyin fun ipo awotẹlẹ. Ifihan getStaticProps ni Itele.js ṣii awọn aye tuntun, bii lilo awọn agbara fifunni Next.js lori ibeere labẹ awọn ipo kan.

Fun apẹẹrẹ, nigbati o ṣe akọwo akọpamọ kan Ninu CMS kan, iwọ yoo fẹ lati foju atunṣe aimi ati ṣe oju-iwe lori ibeere pẹlu akoonu kikọ dipo akoonu ti a gbejade. O fẹ Next.js lati foju kọ aimi nikan ni ọran yii. Gẹgẹbi ẹgbẹ Next.js, ipo awotẹlẹ gba ọ laaye lati ṣe eyi.

Ipo ti awotẹlẹ ngbanilaaye awọn olumulo lati foju oju-iwe ti o ṣẹda ni iṣiro lati pada si ibere (SSR) oju-iwe apẹrẹ, fun apẹẹrẹ lati CMS kan. Sibẹsibẹ, ko ni opin si awọn eto CMS kan. Ipo awotẹlẹ ṣepọ taara pẹlu getStaticProps ati getServerSideProps nitorinaa o le lo pẹlu eyikeyi iru ojutu imularada data.

Next.js 9.2 ṣafikun atilẹyin fun CSS ti a ṣe sinu, ṣugbọn Next.js 9.3 ṣafikun atilẹyin fun Sass. Awọn oju-iwe aṣa agbaye ati awọn modulu CSS ni atilẹyin, bii ifibọ CSS. Next.js ṣe atilẹyin awọn modulu CSS bayi pẹlu awọn faili Sass lilo apejọ orukọ lorukọ [orukọ] .module.scss. Ko dabi atilẹyin ti o wa tẹlẹ ni Next.js 5 + pẹlu atẹle-sass, awọn Sass agbaye ati awọn modulu CSS le ni ajọṣepọ bayi.

Awọn modulu CSS gba ọ laaye lati ṣakoso Sass ni agbegbe nipasẹ ṣiṣẹda awọn orukọ kilasi alailẹgbẹ laifọwọyi.

Pẹlu ẹya 9.0 lati Next.js, oju-iwe kan wa ti a ko ṣe ni adaṣe ni HTML aimi: 404 iwe.

Idi pataki ti o wa lẹhin eyi ni pe oju-iwe aṣiṣe aṣiṣe 404 ti ṣakoso diẹ sii ju 404. Fun apẹẹrẹ, o tun ṣe awọn aṣiṣe. Niwọn igba ti awọn oju-iwe 404 ti ṣe fun awọn ọna ti kii ṣe tẹlẹ, fifun oju-iwe lori ibeere le ja si awọn idiyele ti o ga julọ ati fifuye giga olupin. Ẹya Framework 9.3 ṣe ilọsiwaju awọn nkan ati pe o funni ni iṣapeye aimi laifọwọyi fun 404 oju-iwe.

Nisisiyi nigbati ibeere rẹ ko ba pẹlu oju-iwe aṣa error.js kan, faili naa Next.js ṣe ipilẹṣẹ oju-iwe 404 ni iṣiro ati lilo rẹ nigbati o yẹ ki a ṣiṣẹ 404. Eyi ṣẹlẹ laifọwọyi ati pe ko si awọn ayipada ti o nilo.

O tun le ṣe oju-iwe yii. Lati rọpo oju-iwe 404 aiyipada, o le ṣẹda faili 404.js kan.

Ti o ba fẹ lati mọ diẹ sii nipa rẹ, o le kan si alagbawo ọna asopọ atẹle. 


Awọn akoonu ti nkan naa faramọ awọn ilana wa ti awọn ilana olootu. Lati jabo aṣiṣe kan tẹ nibi.

Jẹ akọkọ lati sọ ọrọ

Fi ọrọ rẹ silẹ

Adirẹsi imeeli rẹ yoo ko le ṣe atejade. O beere aaye ti wa ni samisi pẹlu *

*

*

  1. Lodidi fun data naa: Miguel Ángel Gatón
  2. Idi ti data naa: SPAM Iṣakoso, iṣakoso ọrọ asọye.
  3. Ofin: Iyọọda rẹ
  4. Ibaraẹnisọrọ data: Awọn data kii yoo ni ifọrọhan si awọn ẹgbẹ kẹta ayafi nipasẹ ọranyan ofin.
  5. Ibi ipamọ data: Alaye data ti o gbalejo nipasẹ Awọn nẹtiwọọki Occentus (EU)
  6. Awọn ẹtọ: Ni eyikeyi akoko o le ni opin, gba pada ki o paarẹ alaye rẹ.