cari
Rumahhujung hadapan webtutorial cssPasang npm dalam beberapa langkah mudah

Pasang npm dalam beberapa langkah mudah

Adakah anda memahami konsep asas Pengurus Pakej? Sudah tiba masanya untuk meletakkan pengetahuannya! Pertama, kita perlu memasang NPM.

Panduan ini akan membimbing anda untuk memasang Node dan NPM dan membuat projek sampel yang akan membantu anda menguasai asas-asas NPM dan aplikasinya dalam pembangunan front-end.

Bab Panduan

  1. Siapa panduan ini?
  2. Apa maksud "npm"?
  3. Apakah baris arahan?
  4. Apa itu nod?
  5. Apa itu Pengurus Pakej?
  6. Bagaimana cara memasang npm? (Lokasi semasa anda!)
  7. Bagaimana cara memasang pakej npm?
  8. Apakah arahan NPM?
  9. Bagaimana cara memasang projek NPM yang sedia ada?

Periksa sama ada npm dipasang

Sebelum memasang npm, periksa sama ada ia dipasang. Buka terminal (aplikasi terminal macOS, terminal bersepadu untuk editor kod seperti kod VS, atau terminal baris arahan lain).

Masukkan arahan berikut (perhatikan bahawa watak $ tidak termasuk dalam contoh):

 <code>node -v</code>

Perintah ini memaparkan versi nod semasa (jika dipasang). Jika nod dipasang, baris arahan mengembalikan nombor versi nod yang dipasang:

 <code>v16.9.1</code>

Versi anda mungkin berbeza, tetapi selagi nombor versi dipaparkan, ini bermakna NPM dipasang! Nombor versi itu sendiri tidak penting.

Jika npm atau nod tidak dipasang, anda akan melihat mesej seperti "perintah tidak dijumpai". Jika NPM dipasang tetapi nod tidak dipasang (dan sebaliknya), adalah disyorkan untuk menyahpasang terlebih dahulu dan kemudian teruskan.

Jika anda perlu memasang NPM dan Node, kami akan mengikuti Panduan NPM Rasmi untuk memasang melalui program NVM.

Pasang Pengurus Versi Node

Pengurus Versi Node (NVM) membolehkan anda memasang, mengemas kini, dan menyahpasang nod pada sistem anda dan menguruskan pelbagai versi nod.

Bahasa sisi pelayan mempunyai versi sendiri (mis., Node 17.1.0) dan tidak ada kaitan dengan versi penyemak imbas (mis., Chrome 96). Kami hanya memerlukan versi terkini Node, jadi NVM tidak diperlukan pada masa ini, tetapi ia mungkin berguna pada masa akan datang.

Memasang satu program hanya untuk memasang yang lain, yang nampaknya berlebihan, tetapi ia adalah kaedah yang disyorkan, dan melakukannya dengan betul dari awal akan memudahkan operasi kemudian.

Pasang NVM pada Windows

Jika anda menggunakan Windows, proses pemasangan akan lebih mudah. Anda memerlukan NVM yang didedikasikan untuk Windows, tetapi bernasib baik, Windows sudah mempunyai pemasang, hanya muat turun dan lari. Untuk butiran, sila rujuk kepada NVM untuk repositori Windows di GitHub.

  • Muat turun versi terkini NVM untuk Windows. Ia juga boleh dipasang secara manual.
  • Buka terminal dan jalankan nvm list available untuk melihat senarai versi nod yang boleh dimuat turun dan dipasang.
  • Jalankan arahan nvm use diikuti oleh nombor versi nod untuk digunakan (contohnya nvm use 16.9.1 ) untuk menggunakan versi tertentu. Sebagai alternatif, anda boleh menggunakan latest , lts , atau newest dan bukannya nombor versi tertentu, di mana newest adalah versi terkini yang dipasang.

Selepas pemasangan, NVM berfungsi dengan cara yang sama pada mesin Windows sebagai sistem lain.

Pasang NVM pada macOS

Untuk memasang NVM pada macOS, langkah pertama ialah memuat turunnya menggunakan arahan berikut:

 <code>curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash</code>

0.39.0 adalah versi terkini pada masa pelepasan, tetapi anda mungkin perlu menyemak pemasangan NVM ReadMe dan mendapatkan versi terkini (jika berbeza).

Selepas menampal arahan ke terminal dan menekan Enter , anda akan melihat bahawa terminal mengeluarkan banyak maklumat yang tidak relevan. Malah, kebanyakan masa, tiada siapa yang akan membaca maklumat ini di terminal. Kami hanya mengambil berat tentang:

  1. Perintah itu akhirnya selesai;
  2. Perintah itu tidak berakhir dengan mesej ralat.

Jika anda diminta untuk memasukkan arahan semasa proses pemasangan, tekan kekunci Q untuk keluar dan teruskan.

Apabila kursor input berkedip sekali lagi, ini bermakna arahan telah selesai dan terminal sedang menunggu input anda. Setelah pemasangan NVM selesai, anda mungkin melihat:

 <code>=> Close and reopen your terminal to start using nvm or run the following to use it now:</code>

Jika anda tidak melihat ralat pada masa ini, disyorkan untuk keluar dan memulakan semula aplikasi terminal yang anda gunakan sebelum meneruskan. Ini adalah cara yang baik untuk memastikan anda bermula dengan keadaan yang bersih.

Cara memasang npm melalui nod

Sekarang bahawa NVM dipasang, kami sudah bersedia untuk melakukan apa yang kami mahu lakukan: Pasang NPM dan Nod pada sistem.

Adalah lebih baik untuk mengesahkan bahawa NVM dipasang dengan betul, dengan menjalankan nvm -v . Jika terminal memaparkan nombor versi yang dipasang, semuanya baik -baik saja! Jika tidak, ingatlah bahawa anda mungkin perlu memulakan semula aplikasi terminal untuk melengkapkan pemasangan.

Sekarang kita mempunyai NVM, arahan untuk memasang nod sangat pendek:

 <code>nvm install node</code>

Cukup mudah, bukan?

Anda harus melihat mesej seperti "memuat turun dan memasang nod v17.1.0", walaupun nombor versi mungkin tidak sepadan, tidak mengapa. Anda akan mendapat versi stabil terbaru runtime. Tunggu perintah selesai berjalan - Begitu juga, apabila anda kembali ke prompt lalai dan dapat menaip lebih banyak arahan, anda tahu ia selesai.

Selepas itu, anda sudah selesai! Perintah mudah ini bukan sahaja memasang nod, tetapi juga memasang npm. Begitu juga, anda boleh menggunakan npm -v dan <code>node -v</code> untuk mengesahkan bahawa semuanya dipasang dan dikemas kini. Jika semuanya berjalan lancar, anda akan mendapat nombor versi.

Langkah seterusnya

Ok, sekarang kami mempunyai NVM untuk memasang dan menguruskan nod, nod sendiri, dan NPM untuk mengendalikan pakej nod. Di bahagian seterusnya panduan NPM ini, kami akan memasang beberapa pakej ke dalam projek!

← Bab 5 Bab 7 →

Atas ialah kandungan terperinci Pasang npm dalam beberapa langkah mudah. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Apakah grid CSS?Apakah grid CSS?Apr 30, 2025 pm 03:21 PM

CSS Grid adalah alat yang berkuasa untuk mewujudkan susun atur web yang rumit dan responsif. Ia memudahkan reka bentuk, meningkatkan kebolehcapaian, dan menawarkan lebih banyak kawalan daripada kaedah yang lebih lama.

Apakah CSS Flexbox?Apakah CSS Flexbox?Apr 30, 2025 pm 03:20 PM

Artikel membincangkan CSS Flexbox, kaedah susun atur untuk penjajaran yang cekap dan pengedaran ruang dalam reka bentuk responsif. Ia menerangkan penggunaan Flexbox, membandingkannya dengan grid CSS, dan butiran sokongan penyemak imbas.

Bagaimanakah kita boleh membuat laman web kami responsif menggunakan CSS?Bagaimanakah kita boleh membuat laman web kami responsif menggunakan CSS?Apr 30, 2025 pm 03:19 PM

Artikel ini membincangkan teknik untuk membuat laman web responsif menggunakan CSS, termasuk tag Meta Viewport, grid fleksibel, media cecair, pertanyaan media, dan unit relatif. Ia juga meliputi menggunakan grid CSS dan Flexbox bersama -sama dan mengesyorkan rangka kerja CSS

Apakah harta saiz kotak CSS?Apakah harta saiz kotak CSS?Apr 30, 2025 pm 03:18 PM

Artikel ini membincangkan harta saiz kotak CSS, yang mengawal bagaimana dimensi elemen dikira. Ia menerangkan nilai seperti kotak kandungan, kotak sempadan, dan kotak padding, dan kesannya terhadap reka bentuk susun atur dan penjajaran bentuk.

Bagaimanakah kita boleh menghidupkan CSS?Bagaimanakah kita boleh menghidupkan CSS?Apr 30, 2025 pm 03:17 PM

Artikel membincangkan membuat animasi menggunakan CSS, sifat utama, dan menggabungkan dengan JavaScript. Isu utama adalah keserasian penyemak imbas.

Bolehkah kita menambah transformasi 3D ke projek kami menggunakan CSS?Bolehkah kita menambah transformasi 3D ke projek kami menggunakan CSS?Apr 30, 2025 pm 03:16 PM

Artikel membincangkan menggunakan CSS untuk transformasi 3D, sifat utama, keserasian penyemak imbas, dan pertimbangan prestasi untuk projek web. (Kira -kira aksara: 159)

Bagaimana kita boleh menambah kecerunan dalam CSS?Bagaimana kita boleh menambah kecerunan dalam CSS?Apr 30, 2025 pm 03:15 PM

Artikel ini membincangkan menggunakan kecerunan CSS (linear, radial, mengulangi) untuk meningkatkan visual laman web, menambah kedalaman, fokus, dan estetika moden.

Apakah unsur-unsur pseudo dalam CSS?Apakah unsur-unsur pseudo dalam CSS?Apr 30, 2025 pm 03:14 PM

Artikel membincangkan unsur-unsur pseudo dalam CSS, penggunaannya dalam meningkatkan gaya HTML, dan perbezaan dari kelas pseudo. Menyediakan contoh praktikal.

See all articles

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

mPDF

mPDF

mPDF ialah perpustakaan PHP yang boleh menjana fail PDF daripada HTML yang dikodkan UTF-8. Pengarang asal, Ian Back, menulis mPDF untuk mengeluarkan fail PDF "dengan cepat" dari tapak webnya dan mengendalikan bahasa yang berbeza. Ia lebih perlahan dan menghasilkan fail yang lebih besar apabila menggunakan fon Unicode daripada skrip asal seperti HTML2FPDF, tetapi menyokong gaya CSS dsb. dan mempunyai banyak peningkatan. Menyokong hampir semua bahasa, termasuk RTL (Arab dan Ibrani) dan CJK (Cina, Jepun dan Korea). Menyokong elemen peringkat blok bersarang (seperti P, DIV),

SublimeText3 Linux versi baharu

SublimeText3 Linux versi baharu

SublimeText3 Linux versi terkini

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

EditPlus versi Cina retak

EditPlus versi Cina retak

Saiz kecil, penyerlahan sintaks, tidak menyokong fungsi gesaan kod