πŸš€ Как Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ JavaScript Π² VS Code? Π£Ρ‡Π΅Π±Π½ΠΎΠ΅ пособиС для Π½Π°Ρ‡ΠΈΠ½Π°ΡŽΡ‰ΠΈΡ… программистов

Как Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ JavaScript Π² Visual Studio Code?

Для запуска JavaScript-ΠΊΠΎΠ΄Π° Π² Visual Studio Code Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ шаги:

  1. УстановитС ΠΈ настройтС Node.js Π½Π° вашСм ΠΊΠΎΠΌΠΏΡŒΡŽΡ‚Π΅Ρ€Π΅, Ссли Π΅Π³ΠΎ Π΅Ρ‰Π΅ Π½Π΅Ρ‚.
  2. ΠžΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ ΠΏΠ°ΠΏΠΊΡƒ ΠΈΠ»ΠΈ Ρ„Π°ΠΉΠ» с вашим JavaScript-ΠΊΠΎΠ΄ΠΎΠΌ Π² Visual Studio Code.
  3. ΠžΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ встроСнный Ρ‚Π΅Ρ€ΠΌΠΈΠ½Π°Π», Π½Π°ΠΆΠ°Π² Ctrl+` (ΠΈΠ»ΠΈ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² "Π’ΠΈΠ΄" -> "Π’Π΅Ρ€ΠΌΠΈΠ½Π°Π»" -> "Новый Ρ‚Π΅Ρ€ΠΌΠΈΠ½Π°Π»").
  4. Π’ Ρ‚Π΅Ρ€ΠΌΠΈΠ½Π°Π»Π΅ ΡƒΠ±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ ΠΏΡƒΡ‚ΡŒ ΠΊ Π²Π°ΡˆΠ΅ΠΌΡƒ JavaScript-Ρ„Π°ΠΉΠ»Ρƒ являСтся Ρ€Π°Π±ΠΎΡ‡Π΅ΠΉ Π΄ΠΈΡ€Π΅ΠΊΡ‚ΠΎΡ€ΠΈΠ΅ΠΉ.
  5. Π’Π²Π΅Π΄ΠΈΡ‚Π΅ ΠΊΠΎΠΌΠ°Π½Π΄Ρƒ node имя_Ρ„Π°ΠΉΠ»Π°.js, Π³Π΄Π΅ "имя_Ρ„Π°ΠΉΠ»Π°" - это Π½Π°Π·Π²Π°Π½ΠΈΠ΅ вашСго JavaScript-Ρ„Π°ΠΉΠ»Π°.
  6. НаТмитС Enter, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ ΠΊΠΎΠΌΠ°Π½Π΄Ρƒ ΠΈ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ Π²Ρ‹Π²ΠΎΠ΄ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ΠΎΠ² Π² Ρ‚Π΅Ρ€ΠΌΠΈΠ½Π°Π»Π΅.

Π’ΠΎΡ‚ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ запуска простого JavaScript-Ρ„Π°ΠΉΠ»Π° с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Node.js ΠΈ Visual Studio Code:

// ΠŸΡ€ΠΈΠΌΠ΅Ρ€ ΠΊΠΎΠ΄Π° Π² Ρ„Π°ΠΉΠ»Π΅ example.js
console.log("ΠŸΡ€ΠΈΠ²Π΅Ρ‚, ΠΌΠΈΡ€!");

Π§Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ этот Ρ„Π°ΠΉΠ», слСдуйтС инструкциям Π²Ρ‹ΡˆΠ΅, Π·Π°ΠΌΠ΅Π½ΠΈΠ² "имя_Ρ„Π°ΠΉΠ»Π°.js" Π½Π° "example.js". Π’Ρ‹ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ тСкст "ΠŸΡ€ΠΈΠ²Π΅Ρ‚, ΠΌΠΈΡ€!" Π² Π²Ρ‹Π²ΠΎΠ΄Π΅ Ρ‚Π΅Ρ€ΠΌΠΈΠ½Π°Π»Π°.

Π”Π΅Ρ‚Π°Π»ΡŒΠ½Ρ‹ΠΉ ΠΎΡ‚Π²Π΅Ρ‚

Как Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ Π² VS Code JS

Π§Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ JavaScript-ΠΊΠΎΠ΄ Π² Visual Studio Code (VS Code), Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ нСсколько шагов. Π’ этой ΡΡ‚Π°Ρ‚ΡŒΠ΅ ΠΌΡ‹ рассмотрим процСсс запуска JavaScript-ΠΊΠΎΠ΄Π° с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½ΠΈΡ Code Runner.

Π¨Π°Π³ 1: Установка VS Code

ΠŸΠ΅Ρ€Π²Ρ‹ΠΌ шагом являСтся установка VS Code Π½Π° ваш ΠΊΠΎΠΌΠΏΡŒΡŽΡ‚Π΅Ρ€. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π·Π°Π³Ρ€ΡƒΠ·ΠΈΡ‚ΡŒ VS Code с ΠΎΡ„ΠΈΡ†ΠΈΠ°Π»ΡŒΠ½ΠΎΠ³ΠΎ сайта (https://code.visualstudio.com) ΠΈ ΡΠ»Π΅Π΄ΠΎΠ²Π°Ρ‚ΡŒ инструкциям для установки Π½Π° Π²Π°ΡˆΡƒ ΠΎΠΏΠ΅Ρ€Π°Ρ†ΠΈΠΎΠ½Π½ΡƒΡŽ систСму. Π£Π±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ Ρƒ вас установлСна послСдняя вСрсия VS Code.

Π¨Π°Π³ 2: Установка Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½ΠΈΡ Code Runner

ПослС установки VS Code ΠΎΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅. Π’ Π»Π΅Π²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ ΠΊΠ»ΠΈΠΊΠ½ΠΈΡ‚Π΅ Π½Π° ΠΈΠΊΠΎΠ½ΠΊΡƒ "Extensions" ΠΈΠ»ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ сочСтаниС клавиш "Ctrl+Shift+X", Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ Ρ€Π°Π·Π΄Π΅Π» Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½ΠΈΠΉ. Π’ поисковой строкС Π²Π²Π΅Π΄ΠΈΡ‚Π΅ "Code Runner" ΠΈ Π½Π°ΠΉΠ΄ΠΈΡ‚Π΅ Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½ΠΈΠ΅, Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Π°Π½Π½ΠΎΠ΅ Jun Han (twolights). НаТмитС ΠΊΠ½ΠΎΠΏΠΊΡƒ "Install", Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½ΠΈΠ΅.

Π¨Π°Π³ 3: Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΈ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΠΈΠ΅ Ρ„Π°ΠΉΠ»Π° JavaScript

Π’Π΅ΠΏΠ΅Ρ€ΡŒ, ΠΊΠΎΠ³Π΄Π° Ρƒ вас установлСн VS Code ΠΈ Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½ΠΈΠ΅ Code Runner, Π΄Π°Π²Π°ΠΉΡ‚Π΅ создадим ΠΈ ΠΎΡ‚ΠΊΡ€ΠΎΠ΅ΠΌ Ρ„Π°ΠΉΠ» JavaScript. Π’ VS Code Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ "File" (Π€Π°ΠΉΠ») Π² Π²Π΅Ρ€Ρ…Π½Π΅ΠΌ мСню, Π° Π·Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ "New File" (Новый Ρ„Π°ΠΉΠ») ΠΈΠ»ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ сочСтаниС клавиш "Ctrl+N". Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ Ρ„Π°ΠΉΠ» с Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½ΠΈΠ΅ΠΌ ".js" (Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, "script.js").

Шаг 4: НаписаниС JavaScript-кода

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π½Π°ΠΏΠΈΡΠ°Ρ‚ΡŒ свой JavaScript-ΠΊΠΎΠ΄ Π² ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΠΎΠΌ Ρ„Π°ΠΉΠ»Π΅. Π’Π²Π΅Π΄ΠΈΡ‚Π΅ ваш ΠΊΠΎΠ΄, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Π»ΡŽΠ±Ρ‹Π΅ рСдакторскиС возмоТности VS Code, Ρ‚Π°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ подсвСтка синтаксиса, Π°Π²Ρ‚ΠΎΠ·Π°ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΠΈ ΠΏΡ€ΠΎΠ²Π΅Ρ€ΠΊΠ° ошибок. НапримСр, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π½Π°ΠΏΠΈΡΠ°Ρ‚ΡŒ простой ΠΊΠΎΠ΄, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π²Ρ‹Π²ΠΎΠ΄ΠΈΡ‚ сообщСниС "ΠŸΡ€ΠΈΠ²Π΅Ρ‚, ΠΌΠΈΡ€!" Π² консоль:


console.log("ΠŸΡ€ΠΈΠ²Π΅Ρ‚, ΠΌΠΈΡ€!");

Π¨Π°Π³ 5: Запуск ΠΊΠΎΠ΄Π° с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Code Runner

Π’Π΅ΠΏΠ΅Ρ€ΡŒ, ΠΊΠΎΠ³Π΄Π° Ρƒ вас Π΅ΡΡ‚ΡŒ JavaScript-ΠΊΠΎΠ΄, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ Π΅Π³ΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½ΠΈΡ Code Runner. Π§Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ ΠΊΠΎΠ΄, Π½Π°ΠΆΠΌΠΈΡ‚Π΅ сочСтаниС клавиш "Ctrl+Alt+N" ΠΈΠ»ΠΈ ΠΊΠ»ΠΈΠΊΠ½ΠΈΡ‚Π΅ ΠΏΡ€Π°Π²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΌΡ‹ΡˆΠΈ Π² Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΎΡ€Π΅ ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ "Run Code" (Π—Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ ΠΊΠΎΠ΄) Π² контСкстном мСню. Π’Π°ΠΌ Π±ΡƒΠ΄Π΅Ρ‚ ΠΏΠΎΠΊΠ°Π·Π°Π½ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ выполнСния вашСго ΠΊΠΎΠ΄Π° Π² Π½ΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ Π²Ρ‹Π²ΠΎΠ΄Π° "Output" (Π’Ρ‹Π²ΠΎΠ΄) Π½ΠΈΠΆΠ΅ Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΎΡ€Π° ΠΊΠΎΠ΄Π°.

ΠŸΡ€ΠΈΠΌΠ΅Ρ‡Π°Π½ΠΈΠ΅:

По ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ Code Runner ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ Node.js для выполнСния JavaScript-ΠΊΠΎΠ΄Π°. Если Π²Ρ‹ Π½Π΅ Π²ΠΈΠ΄ΠΈΡ‚Π΅ ΠΎΠΆΠΈΠ΄Π°Π΅ΠΌΡ‹ΠΉ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ ΠΈΠ»ΠΈ ΠΏΠΎΠ»ΡƒΡ‡Π°Π΅Ρ‚Π΅ ΠΎΡˆΠΈΠ±ΠΊΡƒ, ΡƒΠ±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ Ρƒ вас установлСн Node.js Π½Π° вашСм ΠΊΠΎΠΌΠΏΡŒΡŽΡ‚Π΅Ρ€Π΅.

Π¨Π°Π³ 6: ΠžΡ‚Π»Π°Π΄ΠΊΠ° ΠΊΠΎΠ΄Π° (Π½Π΅ΠΎΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ)

VS Code Ρ‚Π°ΠΊΠΆΠ΅ прСдоставляСт Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ ΠΎΡ‚Π»Π°Π΄ΠΊΠΈ JavaScript-ΠΊΠΎΠ΄Π°. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ Ρ‚ΠΎΡ‡ΠΊΠΈ останова, ΡΠ»Π΅Π΄ΠΈΡ‚ΡŒ Π·Π° значСниями ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Π½Π½Ρ‹Ρ… ΠΈ ΡˆΠ°Π³Π°Ρ‚ΡŒ ΠΏΠΎ ΠΊΠΎΠ΄Ρƒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ½ΡΡ‚ΡŒ, ΠΊΠ°ΠΊ ваш ΠΊΠΎΠ΄ выполняСтся. Однако, для запуска JavaScript-ΠΊΠΎΠ΄Π° ΠΎΡ‚Π»Π°Π΄Ρ‡ΠΈΠΊΠ° JavaScript (Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, Node.js) Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±Ρ‹Ρ‚ΡŒ установлСн ΠΈ настроСн Π½Π° вашСм ΠΊΠΎΠΌΠΏΡŒΡŽΡ‚Π΅Ρ€Π΅.

Π’ Π·Π°ΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΠ΅

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π²Ρ‹ Π·Π½Π°Π΅Ρ‚Π΅, ΠΊΠ°ΠΊ Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ JavaScript-ΠΊΠΎΠ΄ Π² Visual Studio Code. УстановитС VS Code, установитС Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½ΠΈΠ΅ Code Runner, создайтС ΠΈ ΠΎΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ Ρ„Π°ΠΉΠ» JavaScript, Π½Π°ΠΏΠΈΡˆΠΈΡ‚Π΅ свой ΠΊΠΎΠ΄, Π° Π·Π°Ρ‚Π΅ΠΌ запуститС Π΅Π³ΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Code Runner. ΠΠ°ΡΠ»Π°ΠΆΠ΄Π°ΠΉΡ‚Π΅ΡΡŒ ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ Π½Π° JavaScript Π² вашСй любимой срСдС Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ!

Π’ΠΈΠ΄Π΅ΠΎ ΠΏΠΎ Ρ‚Π΅ΠΌΠ΅

Как Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ JavaScript + HTML ΠΊΠΎΠ΄ Π² Vs Code

ΠžΡΠ½ΠΎΠ²Ρ‹ Javascript #3. Запуск ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π° Π² VSCode

[Π˜Π—Π‘ΠΠ’Π¬ Π‘Π•Π‘Π― ОВ Π‘Π’Π ΠΠ”ΠΠΠ˜Π™] Автоматизация запуска ΠΊΠΎΠ΄Π° Π² Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΎΡ€Π΅ VS Code, запуск ΠΊΠΎΠ΄Π° ΠΏΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ΅

ΠŸΠΎΡ…ΠΎΠΆΠΈΠ΅ ΡΡ‚Π°Ρ‚ΡŒΠΈ:

Как ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ Git Π½Π° Windows Ρ‡Π΅Ρ€Π΅Π· CMD? πŸ“₯πŸ’»

πŸ”’ Как ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Ρ„Π°ΠΉΠ» нСотслСТиваСмым git: Π»Π΅Π³ΠΊΠΈΠΉ шаг-Π·Π°-шагом Π³Π°ΠΉΠ΄

πŸš€ Как Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ JavaScript Π² VS Code? Π£Ρ‡Π΅Π±Π½ΠΎΠ΅ пособиС для Π½Π°Ρ‡ΠΈΠ½Π°ΡŽΡ‰ΠΈΡ… программистов

Как ΡΠ²Π΅Ρ€Π½ΡƒΡ‚ΡŒ всС ΠΏΠ°ΠΏΠΊΠΈ Π² VS Code? πŸ“‚ ΠŸΡ€ΠΎΡΡ‚Ρ‹Π΅ инструкции ΠΈ совСты