routes gen

Tentang

routes-gen adalah kerangka kerja alat CLI agnostik untuk rute penguraian dan pembuatan penolong yang aman untuk penggunaan rute yang aman. Anggap saja sebagai prisma, tetapi untuk rute.

Instalasi

Pertama, Anda harus menginstal generator rute itu sendiri:

 yarn add routes-gen

Pengemudi resmi

Generator bekerja dengan "driver", yang merupakan parser rute untuk kerangka kerja yang berbeda.

Pengemudi	Instalasi
Remix	yarn add @routes-gen/remix
SolidStart	yarn add @routes-gen/solid-start

Contoh Penggunaan

Anda bisa menjalankan:

 yarn routes-gen -d @routes-gen/remix

Ini akan menguraikan dan mengekspor rute, berdasarkan pengemudi yang telah Anda berikan.

Misalnya, driver @routes-gen/remix akan mengekspor rute secara default ke /app/routes.d.ts .

Perhatikan bahwa Anda dapat mengubah jalur output melalui flag --output atau -o .

Sekarang Anda dapat mengimpor pembantu route yang dihasilkan di mana saja dan menikmati pengetikan:

 import { route } from "routes-gen" ;

// Compiles to /products
route ( "/products" ) ;

// Compiles to /products/1337
route ( "/products/:productId" , {
    productId : "1337" ,
} ) ; 

Penggunaan Jenis Params

Anda dapat menggunakan tipe RouteParams untuk menambahkan pengetikan ke parameter/segmen rute dinamis Anda. Contoh:

 import { RouteParams } from "routes-gen" ;

const { productId } = params as RouteParams [ "/products/:productId" ] ;

Contoh remix :

 import { LoaderFunction , useParams } from "remix" ;
import { RouteParams } from "routes-gen" ;

export const loader : LoaderFunction = async ( { params } ) => {
  const { productId } = params as RouteParams [ "/products/:productId" ] ;
} ;

export default function Product ( ) {
  const { productId } = useParams < RouteParams [ "/products/:productId" ] > ( ) ;

  return < div / >;
} 

Opsi CLI

Pilihan	Alias	Keterangan
--membantu		Cetak pesan bantuan dan keluar
--versi	-v	Cetak versi CLI dan keluar
--keluaran	-Hai	Jalur untuk Ekspor Rute
--pengemudi	-D	Pengemudi menangani rute yang parsing
--jam tangan	-W	Perhatikan perubahan
--Post-Export		Jalankan Perintah Setelah Rute Ekspor

Menulis sopir Anda

Jika tidak ada driver untuk kerangka kerja pilihan Anda, Anda dapat menulis sendiri. Misalnya, buat file driver.js sederhana di proyek Anda, dengan konten berikut:

 module . exports = {
    // Where to export the typings if the "output" flag was not provided.
    defaultOutputPath : "src/routes.d.ts" ,
    
    // The routes parser. Must export and array of routes matching the { path: string } interface.
    routes : async ( ) => {
        return [
            {
                path : "/products" ,
            } ,
            {
                path : "/products/:productId" , // Note that the dynamic segments must match the :myVar pattern.
            } ,
        ] ;
    } ,

    // The paths to be watched for changes. Must return and array of relative paths.
    watchPaths : async ( ) => {
        return [ "/my-routes/**/*.{ts,tsx,js,jsx}" ] ;
    } ,
}

Sekarang Anda dapat dengan mudah menggunakannya:

 routes-gen -d driver.js

Anda juga dapat mempublikasikannya ke NPM, menginstalnya, dan menggunakannya sebagai paket:

 routes-gen -d my-driver-package

Harap pertimbangkan untuk mengirimkan driver Anda ke repositori ini.