vitext

Vitext ⚡

O próximo.js como a estrutura do React para uma melhor experiência de usuário e desenvolvedor

• Iniciar o servidor instantâneo
• ? Suporte de suspense
• ⚫ Next.js como API
• ? Compilação otimizada
• ? Construir e exportar em mosca
• Lightning SSG/SSR
• ⚡ Fast HMR
• ? Vite e Rollup Compatível

Intro.MP4

 npm install vitext

O Vitext (Vite + Next) é uma ferramenta SSG/SSR Fast Lightning que permite desenvolver aplicativos front-end melhor e mais rápidos. Consiste nessas partes principais:

Iniciar o servidor instantâneo

O servidor de desenvolvimento usa módulos N nativos, então você terá o seu servidor de aplicativos React renderizado e o cliente renderizado muito rápido, com menos de meio segundo para mim.

? Suporte de suspense

O Vitext suporta o React Suspense & Lazy Out of the Box.

 import { lazy , Suspense } from 'react' ;

const Component = lazy ( ( ) => import ( '../components/Component' ) ) ;
const Loading = ( ) => < p > Loading the Component < / p>;

const App = ( ) => {
  return (
    < Suspense fallback = { < Loading / > } >
	  < Component / >
    < / Suspense >
  ) ;
} ;

⚫ Next.js como API

Se você vier de um fundo do próximo.js, tudo funcionará da mesma maneira para você. O Vitext tem um design de API semelhante ao Next.JS.

 // pages/Page/[id].jsx
const Page = ( { id } ) => {
  return < div > { id } < / div>;
} ;

// build time + request time (SSG/SSR/ISR)
export function getProps ( { req , res , query , params } ) {
  // props for `Page` component
  return { props : { id : params . id } } ;
}

// build time (SSG)
export async function getPaths ( ) {
  // an array of { params: ... }, which every `params` goes to `getProps`  
  return {
    paths : [ { id : 1 } ] ,
  } ;
}

export default IndexPage ;

getPaths & getProps são opcionais. Se a execução do getPaths foi feita, todos os itens paths serão passados para uma função getProps e, quando o usuário solicita a página específica, eles receberão o HTML exportado (SSG). Mas se getPaths não foi feito ou não houver uma página HTML exportada para a solicitação do usuário, o getProps será chamado com os params (SSR) do URL da solicitação.

? Compilação otimizada

A Vitext usa a abordagem de construção e agrupamento da Vite, por isso agrupa seu código de uma maneira rápida e otimizada.

? Construir e exportar em mosca

Você não precisa aguardar as exportações HTML do seu aplicativo porque o Vitext Export Pages para HTML simultaneamente enquanto serve seu aplicativo, portanto, nenhuma next export .

Lightning SSR/SSG

Os módulos ES, compiladores rápidos e trabalhadores da web capacitam a estratégia Vitext SSR/SSG, para que você tenha uma SSR/SSG surpreendentemente rápida.

⚡ Fast HMR

O Vitext usa @vitejs/plugin-react-refresh sob o capô, para que você tenha um HMR rápido aqui.

? Vite e Rollup Compatível

Podemos chamar Vitext de superset de Vite; Isso significa que o Vitext suporta tudo o que o Vite suporta com vitext.config.js .

 // exact Vite's config API 
export default {
  plugins : [ ... ] ,
  optimizeDeps : { ... } ,
  ...
} ; 

Exemplos

Você pode consultar o diretório de pacotes/exemplos para ver exemplos que foram implementados usando o Vitext.

Contribuição

Agora estamos nos estágios iniciais, precisamos da sua ajuda no Vitext; Tente as coisas, recomende novos recursos e emitir coisas. Você também pode conferir os problemas para ver se pode trabalhar em alguns.

Licença

Mit