Nuxt 3.7 正式發(fā)布，帶來全新CLI工具！
8 月 25 日，Nuxt.js 3.7 正式發(fā)布！該版本帶來了全新的 CLI，原生Web流和響應(yīng)，渲染優(yōu)化，異步上下文支持等許多新功能，下面就來一探究竟吧！
全新 CLI
Nuxt.js 團(tuán)隊(duì)使用 unjs/citty[1] 重構(gòu)了nuxi，并將其作為獨(dú)立的存儲(chǔ)庫，作為第一個(gè)依賴于新版本的Nuxt發(fā)布。"Nuxi"現(xiàn)在已經(jīng)與主要的 Nuxt 版本解耦，計(jì)劃在未來迭代和更快地發(fā)布"Nuxi"，可以期待很快會(huì)有新的功能推出！
Nuxt.js 團(tuán)隊(duì)致力于開發(fā)一個(gè)新的、簡(jiǎn)約的 CLI 實(shí)現(xiàn)，代號(hào)為“nuxi”，與 Nuxt 3 一起發(fā)布。該項(xiàng)目旨在與 Nuxt 并行地繼續(xù)進(jìn)行 CLI 開發(fā)和增強(qiáng)，主要是為了實(shí)現(xiàn)新目標(biāo)：
- 全局訪問：可以從任何地方立即訪問Nuxt CLI命令，用于啟動(dòng)、初始化、開發(fā)、擴(kuò)展構(gòu)建和部署Nuxt項(xiàng)目。
- 模塊化架構(gòu)：使用新的"citty"框架，可以將CLI子命令和功能從不同的源組合起來，提供可擴(kuò)展性和自定義能力。
- 自動(dòng)化操作：可以通過簡(jiǎn)潔的命令一鍵完成項(xiàng)目的啟動(dòng)、模塊或依賴的添加、Nuxt的升級(jí)、配置的修改和模板的創(chuàng)建。
- 優(yōu)雅的界面：通過更好的核心集成，提供了更加信息豐富和漂亮的CLI界面。
- 可編程接口：通過公開的程序化API接口，可以使用開發(fā)工具和Web瀏覽器與CLI進(jìn)行交互。
- 快速開發(fā)：具備獨(dú)立版本控制和自我升級(jí)支持，可以快速交付更新和實(shí)現(xiàn)新的想法。
原生 Web 流和 Response
隨著 unjs/h3[2] 和 unjs/nitro[3] 的改進(jìn)，現(xiàn)在可以直接從服務(wù)端路由返回Response對(duì)象，這意味著也可以在 Nuxt 中返回和處理流。
HTML渲染優(yōu)化
在這個(gè)版本中，在從服務(wù)端渲染HTML響應(yīng)方面進(jìn)行了一些改進(jìn)。現(xiàn)在，我們會(huì)在構(gòu)建時(shí)確定預(yù)加載/預(yù)獲取資源的方式（可以在build:manifest鉤子中自定義這一設(shè)置）。可以直接在unhead中管理了它們的HTML渲染，這意味著可以配置<link>、<meta>、<script>、<style>等元素的順序，而且根據(jù)初步測(cè)試結(jié)果，它甚至更快！
可以通過experimental.headNext標(biāo)志來選擇即將推出的頭部改進(jìn)。目前，它包括基于capo.js的新排序算法，并允許在未來發(fā)布的unhead中啟用更多的優(yōu)化。
export default defineNuxtConfig({
experimental: {
headNext: true
}
})構(gòu)建環(huán)境快捷方式
在 Nuxt 配置中，現(xiàn)在可以使用 $client 和 $server 快捷方式來輕松定義特定于 Vite 客戶端/服務(wù)端或 Webpack 客戶端/服務(wù)端構(gòu)建的特定配置。以前這只能通過 vite:extendConfig 和 webpack:config 鉤子實(shí)現(xiàn)。
例如：
export default defineNuxtConfig({
vite: {
$client: {
build: {
rollupOptions: {
output: {
chunkFileNames: '_nuxt/[hash].js',
assetFileNames: '_nuxt/[hash][extname]',
entryFileNames: '_nuxt/[hash].js'
}
}
}
}
}
})Vite 4.4 支持
Nuxt.js 團(tuán)隊(duì)決定取消對(duì) Vite 的次要版本限制，這意味著無論 Vite 何時(shí)發(fā)布新的功能版本，都可以立即選擇使用。Vite 4.4 帶來了許多令人興奮的新功能，包括實(shí)驗(yàn)性的 Lightning CSS 支持等！
TypeScript 更新
現(xiàn)在在生成的tsconfig.json中使用純相對(duì)路徑，而不是設(shè)置baseUrl。這意味著在開發(fā)環(huán)境（如Docker鏡像）中，當(dāng)絕對(duì)路徑可能與 IDE 不匹配時(shí)，會(huì)有更好的支持。
此版本還設(shè)置了一些額外的編譯器標(biāo)志默認(rèn)值，以符合 Vite/TS 的建議。
此外，現(xiàn)在可以在setPageLayout和<NuxtLayout name>中獲得類型提示的訪問權(quán)限了。
Async Context 支持
如果你曾經(jīng)遇到過"Nuxt context unavailable"的問題，那么這個(gè)更新可能對(duì)你有所幫助。現(xiàn)在在 Nuxt 和 Nitro 中都支持原生的異步上下文，在 Bun 和 Node 環(huán)境中可以使用實(shí)驗(yàn)性標(biāo)志進(jìn)行開啟。
這使得在服務(wù)端可以使用 Nuxt 組合式函數(shù)，而無需確保它們直接在setup函數(shù)中被調(diào)用。在 Nitro 中也可以實(shí)現(xiàn)相同的功能，通過一個(gè)新的useEvent()實(shí)用工具在服務(wù)端路由中使用。
要嘗試它，需要啟用experimental.asyncContext標(biāo)志：
export default defineNuxtConfig({
experimental: {
asyncContext: true
}
})Watcher 更新
此版本修復(fù)了 watcher 的一些問題，這意味著開發(fā)者應(yīng)該不需要經(jīng)常重啟服務(wù)，并且如果使用圖層，應(yīng)該會(huì)看到顯著的性能提升。
Nitro 2.6
Nitro 2.6 帶來了許多令人興奮的功能，包括更小、更輕的服務(wù)器和新的持久數(shù)據(jù)存儲(chǔ)在 .data 目錄中。
升級(jí)
與往常一樣，建議使用以下命令進(jìn)行升級(jí)：
npx nuxi upgrade --force這將刷新 lockfile，并確保從 Nuxt 依賴的其他依賴項(xiàng)中獲取更新，尤其是在 unjs[4] 生態(tài)系統(tǒng)中。
[1]unjs/citty： http://github.com/unjs/citty
[2]unjs/h3： https://github.com/unjs/h3
[3]unjs/nitro： https://github.com/unjs/nitro
[4]unjs： https://github.com/unjs
