Rspress 2.0 Dikeluarkan: Peningkatan Baru Berfokus pada Pengalaman dan AI

Kami dengan gembira mengumumkan pelancaran rasmi Rspress 2.0!

Rspress adalah pembangkit laman statik yang berasaskan Rsbuild, direka khusus untuk alat laman dokumentasi bagi pembangun. Sejak pelancaran rasmi pada tahun 2023, Rspress 1.x telah melalui 144 versi dan melibatkan 125 penyumbang dalam pembangunan projek. Semakin ramai pembangun memilih Rspress, memanfaatkan prestasi pengkompilasian yang efisien, penghalaan berdasarkan konvensi, dan pratonton perpustakaan komponen untuk membina laman dokumentasi yang menarik dan boleh dipercayai.

Berdasarkan maklum balas dan cadangan daripada komuniti, Rspress 2.0 telah meningkatkan aspek kecantikan tema, AI-native, pengalaman pembangunan dokumentasi, dan penggunaan bersama Rslib.

Mengapa Rspress 2.0

Rspress 1.x telah menyelesaikan masalah prestasi pengkompilasian rangka kerja laman dokumentasi, tetapi masih terdapat beberapa isu yang mempengaruhi pengalaman teras sebagai alat pembangunan dokumentasi. Versi 2.0 tidak hanya menumpukan pada pencarian prestasi pengkompilasian, tetapi juga memberi tumpuan kepada aspek lain pengalaman laman dokumentasi:

• Gaya Tema: Satu set tema lalai yang lebih menarik, dan menyediakan pelbagai cara untuk menyesuaikan tema, menyelesaikan masalah 1.x yang kekurangan API yang stabil untuk penyesuaian tema.
• AI-native: Dokumentasi bukan sahaja berkhidmat kepada pembaca manusia, tetapi juga perlu difahami dan digunakan dengan lebih baik oleh Agen. Rspress kini dilengkapi dengan fungsi penghasilan llms.txt dan SSG-MD yang berasal dari SSG, menghasilkan kandungan Markdown berkualiti tinggi untuk dibaca oleh Agen.
• Pengkompilasian Mengikut Permintaan, Pelancaran Segera: Secara lalai mengaktifkan lazyCompilation, bersama dengan fungsi preload sumber semasa hover pautan, hanya membina fail yang diperlukan apabila mengakses laluan tertentu, memastikan bahawa tidak kira saiz projek, dev juga boleh melancarkan dengan segera.
• Sorotan Kod Shiki: Secara lalai mengintegrasikan Shiki, menyelesaikan sorotan sintaks semasa pembinaan, menyokong pertukaran tema, pengembangan transformer, seperti @rspress/plugin-twoslash, membawa kesan paparan blok kod yang lebih kaya.
• Pengalaman Pembangunan Dokumentasi: Mengoptimumkan HMR untuk fail nav.json, meta.json dan menambah skema json untuk petunjuk kod dalam IDE; secara lalai mengaktifkan fungsi pemeriksaan pautan mati; menambah sintaks blok kod fail, menyokong rujukan fail luaran; @rspress/plugin-preview dan @rspress/plugin-playground menyokong penggunaan serentak dan lain-lain.
• Integrasi Rslib: Kini boleh memilih Rspress sebagai alat dokumentasi semasa menggunakan create-rslib untuk mencipta projek perpustakaan komponen, membina laman dokumentasi komponen dengan cepat.

Ciri Baru 2.0

Tema Baru

Tema lalai 2.0 telah melalui peningkatan sistematik, ia direka oleh pereka pasukan @Zovn Wei, dengan peningkatan yang ketara dalam kesan visual dan pengalaman membaca, dan setiap komponen boleh diganti secara bebas, memberikan tahap penyesuaian yang tinggi.

Penyesuaian Tema

Mengikut tahap penyesuaian dari rendah ke tinggi, terdapat empat cara untuk menyesuaikan tema: pembolehubah CSS, nama kelas BEM, pengalihan semula ESM, dan komponen eject.- CSS Variabel: Tema baru ini memperkenalkan lebih banyak variabel CSS, yang menutupi warna tema, blok kode, gaya halaman utama, dan lain-lain. Anda dapat melihat dan menyesuaikan semua variabel CSS secara interaktif di halaman variabel CSS, dan setelah menemukan konfigurasi yang memuaskan, Anda dapat langsung menyalinnya untuk digunakan dalam proyek.

• Nama Kelas BEM: Komponen bawaan sekarang menggunakan konvensi penamaan BEM. Ini adalah pilihan yang sangat Old School, tetapi juga merupakan keputusan yang telah kami pikirkan dengan matang. Pengguna dapat menyesuaikan gaya dengan tepat menggunakan pemilih CSS, dan struktur HTML menjadi lebih jelas.
• Penggantian Ekspor Ulang ESM: Jika modifikasi pada CSS tidak memenuhi kebutuhan kustomisasi, Anda dapat melakukan kustomisasi yang lebih mendalam melalui JS. Dengan menggunakan ekspor ulang ESM di theme/index.tsx, Anda dapat mengganti komponen bawaan Rspress mana pun.
• Komponen eject: Anda dapat menggunakan perintah baru rspress eject [component], yang akan menyalin kode sumber komponen yang ditentukan ke direktori theme/components/, dan Anda dapat memodifikasi kode ini sesuka hati, bahkan langsung menyerahkannya kepada AI untuk dimodifikasi, untuk mencapai kustomisasi yang mendalam.

Tag Navigasi, Sidebar

Rspress 2.0 telah mengimplementasikan komponen Tag, sekarang Anda dapat menggunakan atribut tag dalam frontmatter untuk menandai UI di sidebar atau navigasi.

Dukungan Multibahasa Bawaan

Dalam versi 1.x, Rspress hanya memiliki teks bahasa Inggris bawaan, jika menggunakan bahasa lain seperti zh, semua teks harus dikonfigurasi, yang cukup merepotkan. Sekarang tema 2.0 memiliki teks terjemahan untuk berbagai bahasa seperti zh, en, ja, ko, ru, dan sistem akan secara otomatis melakukan "Tree Shaking" berdasarkan konfigurasi bahasa, hanya mengemas teks dan bahasa yang Anda gunakan.

Dukungan llms.txt

Rspress sekarang mengintegrasikan kemampuan menghasilkan llms.txt ke dalam inti, dan telah mewujudkan kemampuan SSG-MD (Static Site Generation to Markdown, Generasi Situs Statis ke Markdown) yang baru.

Dalam kerangka depan yang dirender secara dinamis berdasarkan React, sering kali ada masalah sulitnya mengekstrak informasi statis, Rspress juga menghadapi tantangan yang sama. Rspress memungkinkan pengguna untuk meningkatkan ekspresi dokumen melalui fragmen MDX, komponen React, Hooks, dan fitur dinamis seperti rute TSX. Namun, konten dinamis ini menghadapi masalah berikut saat diubah menjadi teks Markdown:

• Memberikan input MDX langsung kepada AI akan mengandung banyak kebisingan sintaksis kode, dan kehilangan konten komponen React
• Mengubah HTML menjadi Markdown sering kali tidak memberikan hasil yang baik, kualitas informasi sulit dijamin

Untuk mengatasi masalah ini, Rspress 2.0 memperkenalkan fitur SSG-MD. Ini adalah fungsi baru yang mirip dengan generasi situs statis (SSG), tetapi perbedaannya adalah ia merender halaman Anda sebagai file Markdown, bukan file HTML, dan menghasilkan file llms.txt dan llms-full.txt terkait.

Sorotan Kode Blok dengan Shiki CompilerRspress 2.0 secara default menggunakan Shiki untuk penyorotan kod. Berbanding dengan penyelesaian penyorotan masa jalan prism 1.x, Shiki menyelesaikan pemprosesan penyorotan semasa kompilasi.

• Menyokong pelbagai gaya tema, seperti di halaman pembolehubah CSS yang membolehkan anda menukar dan melihat tema Shiki yang berbeza secara interaktif.
• Pada masa yang sama, Shiki juga membenarkan penggunaan transformer tersuai untuk memperkayakan penulisan, seperti twoslash dan lain-lain.
• Memasukkan bahasa pengaturcaraan mengikut keperluan, tanpa menambah beban masa jalan dan saiz pakej.
• Berdasarkan sintaks TextMate untuk mencapai penyorotan sintaks yang tepat yang konsisten dengan VS Code.

Peningkatan Prestasi Pembinaan

Rspress 2.0 didorong oleh Rsbuild dan versi pratonton Rspack 2.0, dan secara default mengaktifkan kompilasi mengikut keperluan dan cache yang berkekalan.

Kompilasi Mengikut Keperluan

Secara default, dev.lazyCompilation diaktifkan, hanya apabila anda mengakses halaman tertentu, halaman tersebut akan dikompilasi, yang meningkatkan kelajuan permulaan pembangunan dengan ketara, malah mencapai permulaan sejuk dalam milisaat. Rspress juga melaksanakan strategi preload untuk penghalaan, di mana halaman penghalaan sasaran akan dimuatkan terlebih dahulu apabila tetikus melayang di atas pautan, bersama dengan lazyCompilation untuk mencapai pengalaman pembangunan tanpa kerugian.

Cache Berkekalan

2.0 juga secara default mengaktifkan cache berkekalan, menggunakan semula hasil kompilasi sebelumnya dalam permulaan panas, meningkatkan kelajuan pembinaan sebanyak 30%-60%. Ini bermakna selepas menjalankan rspress dev atau rspress build buat kali pertama, kelajuan permulaan seterusnya akan meningkat dengan ketara.

Pengalaman Pembangunan Dokumen

Pemeriksaan Pautan Mati Secara Default Diaktifkan

Rspress 2.0 secara default mengaktifkan fungsi pemeriksaan pautan mati. Dalam proses pembinaan, pautan tidak sah dalam dokumen akan dikesan secara automatik, membantu anda mengenal pasti dan membaikinya dengan segera.

Blok Kod Fail

Anda boleh menggunakan atribut file="./path/to/file" untuk merujuk fail luaran sebagai kandungan blok kod, meletakkan kod contoh dalam fail berasingan untuk diselenggara.

Penggunaan meta preview yang lebih fleksibel

@rspress/plugin-preview kini menggunakan atribut meta, lebih fleksibel, dan juga boleh digabungkan dengan blok kod fail.

Rslib & Rspress

Apabila menggunakan create-rslib untuk mencipta projek, anda kini boleh memilih alat Rspress. Ini membolehkan anda membina laman dokumen yang berkaitan dengan cepat semasa membangunkan perpustakaan komponen, untuk menulis arahan penggunaan komponen, memaparkan rujukan API, atau melihat kesan komponen secara langsung.

Lebih Banyak Plugin Rasmi Rspress

Rspress 2.0 menambah beberapa plugin rasmi:

• @rspress/plugin-algolia: menyokong penggantian carian terbina dalam Rspress dengan Algolia DocSearch
• @rspress/plugin-twoslash: menambah petunjuk jenis untuk blok kod TypeScript
• @rspress/plugin-llms: menyediakan keupayaan penghasilan llms.txt untuk projek yang tidak menyokong SSG dan SSG-MD
• @rspress/plugin-sitemap: secara automatik menghasilkan fail Sitemap, untuk mengoptimumkan SEO

Perubahan yang Mengganggu

Migrasi dari Rspress 1.x

Jika anda adalah pengguna projek 1.x, kami telah menyediakan dokumen migrasi yang terperinci untuk membantu anda menaik taraf dari 1.x ke 2.0. Anda boleh menggunakan fungsi "salin Markdown" dalam halaman untuk memasukkannya kepada agen pengkodan biasa anda (seperti Claude Code dan lain-lain) untuk menyelesaikan migrasi.Rspress 2.0 memerlukan versi Node.js 20+, versi React 18+.\n\n## Langkah Seterusnya\n\nPelancaran Rspress 2.0 hanyalah titik permulaan yang baru. Selepas pelancaran ini, Rspress akan terus berinovasi:\n\n- Mempercepat Integrasi Ekosistem: Menggabungkan dengan Rslib, Rstest dengan lebih mendalam, menyediakan pengalaman pembangunan yang terintegrasi untuk projek frontend dan projek perpustakaan komponen.\n- Meneroka Integrasi AI dengan Dokumen dengan Lebih Mendalam: Seperti soal jawab pintar, ringkasan automatik, dan lain-lain; memperbaiki SSG-MD untuk menjadikannya stabil dan lebih mudah digunakan.\n\nGunakan atau tingkatkan ke Rspress 2.0 sekarang, alami perjalanan pembangunan dokumen yang baru!\n\nnpm create rspress@latest