Next.js CLI
Next.js CLI, uygulamanızı başlatmanıza, oluşturmanıza ve dışa aktarmanıza olanak tanır.
Kullanılabilir CLI komutlarının bir listesini almak için proje dizininizde aşağıdaki komutu çalıştırın:
npx next -h
(npx npm 5.2+ ve üstü ile birlikte gelir)
Çıktı şu şekilde görünmelidir:
Usage
$ next <command>
Available commands
build, start, export, dev, lint, telemetry, info
Options
--version, -v Version number
--help, -h Displays this message
For more information run a command with the --help flag
$ next build --help
Herhangi bir düğüm argümanını next
komutlarına iletebilirsiniz:
NODE_OPTIONS='--throw-deprecation' next
NODE_OPTIONS='-r esm' next
NODE_OPTIONS='--inspect' next
Bilmekte fayda var:
next
adresini bir komut olmadan çalıştırmaknext dev
Build
next build
uygulamanızın optimize edilmiş bir üretim yapısını oluşturur. Çıktı, her rota hakkında bilgi görüntüler.
- Boyut - Sayfaya istemci tarafında gidildiğinde indirilen varlık sayısı. Her rota için boyut yalnızca bağımlılıklarını içerir.
- İlk Yükleme JS - Sayfayı sunucudan ziyaret ederken indirilen varlık sayısı. Herkes tarafından paylaşılan JS miktarı ayrı bir metrik olarak gösterilir.
Bu değerlerin her ikisi de gzip ile sıkıştırılmıştır. İlk yükleme yeşil, sarı veya kırmızı ile gösterilir. Performanslı uygulamalar için yeşili hedefleyin.
React için üretim profili oluşturmayı next build
adresindeki --profile
bayrağı ile etkinleştirebilirsiniz. Bunun için Next.js 9.5 gerekir:
next build --profile
Bundan sonra, profil oluşturucuyu geliştirme sırasında kullandığınız şekilde kullanabilirsiniz.
next build
adresindeki --debug
bayrağı ile daha ayrıntılı derleme çıktısını etkinleştirebilirsiniz. Bu, Next.js 9.5.3 gerektirir:
next build --debug
Bu bayrak etkinleştirildiğinde, yeniden yazmalar, yönlendirmeler ve üstbilgiler gibi ek derleme çıktıları gösterilecektir.
Development
next dev
Sıcak kod yeniden yükleme, hata raporlama ve daha fazlası ile uygulamayı geliştirme modunda başlatır:
Uygulama varsayılan olarak http://localhost:3000
adresinde başlayacaktır. Varsayılan bağlantı noktası -p
ile aşağıdaki gibi değiştirilebilir:
npx next dev -p 4000
Ya da PORT
ortam değişkenini kullanarak:
PORT=4000 npx next dev
Bilmenizde fayda var: HTTP sunucusunun başlatılması diğer kodlar başlatılmadan önce gerçekleştiği için
PORT
.env
adresinde ayarlanamaz.
Ana bilgisayar adını 0.0.0.0
varsayılanından farklı olarak da ayarlayabilirsiniz, bu, uygulamayı ağdaki diğer cihazlar için kullanılabilir hale getirmek için yararlı olabilir. Varsayılan ana bilgisayar adı -H
ile şu şekilde değiştirilebilir:
npx next dev -H 192.168.1.2
HTTPS for Local Development
Web kancaları veya kimlik doğrulama gibi belirli kullanım durumları için, localhost
adresinde güvenli bir ortama sahip olmak için HTTPS kullanmak gerekebilir. Next.js aşağıdaki gibi next dev
ile kendinden imzalı bir sertifika oluşturabilir:
next dev --experimental-https
Ayrıca --experimental-https-key
ve --experimental-https-cert
ile özel bir sertifika ve anahtar sağlayabilirsiniz. İsteğe bağlı olarak, --experimental-https-ca
ile de özel bir CA sertifikası sağlayabilirsiniz.
next dev --experimental-https --experimental-https-key ./certificates/localhost-key.pem --experimental-https-cert ./certificates/localhost.pem
next dev --experimental-https
yalnızca geliştirme için tasarlanmıştır ve mkcert
ile yerel olarak güvenilen bir sertifika oluşturur. Üretimde, güvenilir yetkililerden uygun şekilde verilen sertifikaları kullanın. Vercel'e dağıtım yaparken, Next.js uygulamanız için HTTPS otomatik olarak yapılandırılır.
Production
next start
uygulamayı üretim modunda başlatır. Uygulama şu şekilde derlenmelidir next build
Birincisi.
Uygulama varsayılan olarak http://localhost:3000
adresinde başlayacaktır. Varsayılan bağlantı noktası -p
ile aşağıdaki gibi değiştirilebilir:
npx next start -p 4000
Ya da PORT
ortam değişkenini kullanarak:
PORT=4000 npx next start
Bildiğim iyi oldu:
- HTTP sunucusunun başlatılması diğer kodlar başlatılmadan önce gerçekleştiği için
PORT
.env
adresinde ayarlanamaz.
next start
output: 'standalone'
veyaoutput: 'export'
ile kullanılamaz.
Keep Alive Timeout
Next.js'yi bir aşağı akış proxy'sinin (örneğin AWS ELB/ALB gibi bir yük dengeleyici) arkasına konuşlandırırken Next'in temel HTTP sunucusunu, aşağı akış proxy'sinin zaman aşımlarından daha büyük olan canlı tutma zaman aşımları ile yapılandırmak önemlidir. Aksi takdirde, belirli bir TCP bağlantısı için canlı tutma zaman aşımına ulaşıldığında, Node.js aşağı akış proxy'sine bildirimde bulunmadan bu bağlantıyı hemen sonlandıracaktır. Bu, Node.js'nin zaten sonlandırdığı bir bağlantıyı yeniden kullanmaya çalıştığında bir proxy hatasıyla sonuçlanır.
Üretim Next.js sunucusunun zaman aşımı değerlerini yapılandırmak için --keepAliveTimeout
adresini (milisaniye cinsinden) next start
adresine şu şekilde iletin:
npx next start --keepAliveTimeout 70000
Lint
next lint
pages/
, app/
, components/
, lib/
ve src/
dizinlerindeki tüm dosyalar için ESLint'i çalıştırır. Ayrıca, ESLint uygulamanızda zaten yapılandırılmamışsa, gerekli bağımlılıkları yüklemek için kılavuzlu bir kurulum sağlar.
Tiftiklemek istediğiniz başka dizinler varsa, bunları --dir
bayrağını kullanarak belirtebilirsiniz:
next lint --dir utils
Telemetry
Next.js genel kullanım hakkında tamamen anonim telemetri verileri toplar. Bu anonim programa katılım isteğe bağlıdır ve herhangi bir bilgi paylaşmak istemiyorsanız katılmayabilirsiniz.
Telemetri hakkında daha fazla bilgi edinmek için lütfen adresindeki bu belgeyi okuyun.
Next Info
next info
Next.js hatalarını bildirmek için kullanılabilecek mevcut sistemle ilgili ayrıntıları yazdırır. Bu bilgiler İşletim Sistemi platformu/arch/versiyonu, İkililer (Node.js, npm, Yarn, pnpm) ve npm paket versiyonlarını (next
, react
, react-dom
) içerir.
Projenizin kök dizininde aşağıdakileri çalıştırın:
next info
size bu örnekteki gibi bilgiler verecektir:
Operating System:
Platform: linux
Arch: x64
Version: #22-Ubuntu SMP Fri Nov 5 13:21:36 UTC 2021
Binaries:
Node: 16.13.0
npm: 8.1.0
Yarn: 1.22.17
pnpm: 6.24.2
Relevant packages:
next: 12.0.8
react: 17.0.2
react-dom: 17.0.2
Bu bilgiler daha sonra GitHub Sorunlarına yapıştırılmalıdır.
Kurulum sorunlarını teşhis etmek amacıyla, sistem ve sonraki ilgili paketlerin kurulumu hakkında ek bilgi yazdırmak için next info --verbose
adresini çalıştırabilirsiniz.