विजुअल स्टूडियो कोड में जावास्क्रिप्ट चलाएँ

Question

क्या जावास्क्रिप्ट को निष्पादित करने और विजुअल स्टूडियो कोड का उपयोग करके परिणाम प्रदर्शित करने का एक तरीका है ?

उदाहरण के लिए, एक स्क्रिप्ट फ़ाइल जिसमें:

console.log('hello world');

मुझे लगता है कि Node.js की जरूरत होगी, लेकिन यह कैसे करना है काम नहीं कर सकता?

विजुअल स्टूडियो कोड द्वारा मेरा मतलब है Microsoft से नया कोड संपादक - विजुअल स्टूडियो का उपयोग करके लिखा गया कोड नहीं।

Comments

यह एक ए / बी समस्या की तरह लगता है। समस्या क्या है जिसे आप वास्तव में हल करने की कोशिश कर रहे हैं?

— जॉर्डन रनिंग

@ क्रिस वह एक सॉफ्टवेयर की बात कर रहा है। VSCode एक संपादक है

— क्षितिज शर्मा

मैंने अभी सिर्फ वीएस कोड के लिए एक नया एक्सटेंशन बनाया है, इसके लिए "Node.JS REPL" आज़माएं। marketplace.visualstudio.com/…

— Lostfields

परिणाम देखने का सबसे आसान तरीका गोटो देखें => एकीकृत टर्मिनल और प्रकार: नोड <myfile> .js

— मैटल

Answer 1

यह समाधान वर्तमान में नोड में खुली फ़ाइल चलाने और VSCode में आउटपुट दिखाने का इरादा रखता है।

मेरा भी यही सवाल था और मुझे नई शुरुआत मिली tasks इस विशिष्ट उपयोग के मामले के लिए उपयोगी । यह थोड़ा परेशानी भरा है, लेकिन यहाँ मैंने जो किया है:

अपने .vscodeप्रोजेक्ट के रूट में एक डायरेक्टरी बनाएं और tasks.jsonउसमें एक फाइल बनाएं । इस कार्य परिभाषा को फाइल में जोड़ें:

{
    "version": "0.1.0",
    "command": "node",
    "isShellCommand": true,
    "args": [
        "--harmony"
    ],

    "tasks": [
        {
            "taskName": "runFile",
            "suppressTaskName": true,
            "showOutput": "always",
            "problemMatcher": "$jshint",
            "args": ["${file}"]
        }
    ]
}

फिर आप कर सकते हैं: press F1 > type `run task` > enter > select `runFile` > enter अपना कार्य चलाने के लिए, लेकिन मैंने कार्य सूचियों को खोलने के लिए एक कस्टम कुंजी बंधन जोड़ना आसान पाया।

कुंजी बंधन को जोड़ने के लिए, VSCode UI मेनू में, 'कोड'> 'प्राथमिकताएं'> 'कीबोर्ड शॉर्टकट' पर जाएं। इसे अपने कीबोर्ड शॉर्टकट में जोड़ें:

{
    "key": "cmd+r",
    "command": "workbench.action.tasks.runTask"
}

बेशक आप कुंजी संयोजन के रूप में जो चाहें चुन सकते हैं।

अपडेट करें:

मान लें कि आप इसका परीक्षण करने के लिए जावास्क्रिप्ट कोड चला रहे हैं , तो आप अपनी संपत्ति को सेट करके अपने कार्य को परीक्षण कार्य के रूप में चिह्नित कर सकते हैं और फिर आप कमांड की कुंजी को बांध सकते हैं।isTestCommandtrueworkbench.action.tasks.test एकल-क्रिया मंगलाचरण के लिए ।

दूसरे शब्दों में, आपकी tasks.jsonफ़ाइल में अब शामिल होगा:

{
    "version": "0.1.0",
    "command": "node",
    "isShellCommand": true,
    "args": [
        "--harmony"
    ],

    "tasks": [
        {
            "taskName": "runFile",
            "isTestCommand": true,
            "suppressTaskName": true,
            "showOutput": "always",
            "problemMatcher": "$jshint",
            "args": ["${file}"]
        }
    ]
}

... और आपकी keybindings.jsonफ़ाइल में अब शामिल होगा:

{
    "key": "cmd+r",
    "command": "workbench.action.tasks.test"
}

Comments

एक परियोजना होने के बारे में ओपी ने कुछ नहीं कहा। ऐसा लगता है कि वे वर्तमान में खुली हुई एकल फ़ाइल को निष्पादित करना चाहते हैं, जो कि एक पाठ संपादक से प्राप्त करना बहुत ही उचित बात है।

— मार्क विल्बर

Answer 2

जावास्क्रिप्ट को चलाने के लिए बहुत आसान तरीका है, किसी कॉन्फ़िगरेशन की आवश्यकता नहीं है:

1. कोड रनर एक्सटेंशन स्थापित करें
2. पाठ संपादक का JavaScript फ़ाइल खोलें, फिर का उपयोग शॉर्टकट Control+ Alt+ N(या ⌃ Control+ ⌥ Option+ NMacOS पर), या प्रेस F1और फिर / प्रकार Run Code, कोड चलेंगे और उत्पादन आउटपुट विंडो में दिखाया जाएगा।

इसके अलावा, आप जावास्क्रिप्ट कोड का हिस्सा चुन सकते हैं और कोड स्निपेट चला सकते हैं। एक्सटेंशन भी बिना सहेजे गए फ़ाइलों के साथ काम करता है, इसलिए आप बस एक फ़ाइल बना सकते हैं, इसे जावास्क्रिप्ट में बदल सकते हैं और कोड तेजी से लिख सकते हैं (जब आपको बस कुछ जल्दी करने की आवश्यकता हो)। बहुत ही सुविधाजनक!

Comments

मुझे भी 3- की आवश्यकता है। Node.js नोड js.org/en को स्थापित करने के लिए 4- 4- एनवायरमेंट वेरिएबल्स पर जाएं और "Node" को वैल्यू के साथ जोड़ें: "C: \ Program Files \ nitjs \ नोड.exe"

— TheBigSign

बस @TheBigShot बिंदु पर जोड़ने के लिए 4- अगर VScode के अंदर 'कोड- runner.executorMap' के लिए एक प्रविष्टि जोड़कर कोड रनर्स कॉन्फ़िगरेशन गाइड लिंक का उपयोग किया जाता है, तो पथ मान "\" C: \\ प्रोग्राम फ़ाइलें \\ नोड्स \\ नोड .exe \ "" ने मेरे लिए काम किया।

— Useless_Wizard

आपके सभी विकास फ़ोल्डरों के लिए काम करने का सबसे तेज़ तरीका संभव है! चियर्स !!

— चारिस थियो

मैं जावास्क्रिप्ट विकास और VSCode के लिए अपेक्षाकृत नया हूं, और अब तक यह सबसे सरल समाधान था।

— जोस क्विजादा

अच्छी तरह से काम! ठीक वही जो मेरे द्वारा खोजा जा रहा था।

— ट्रैपर डेविस

Answer 3

मुझे आश्चर्य है कि इसका उल्लेख अभी तक नहीं किया गया है:

बस .jsवी.एस. कोड में प्रश्न में फ़ाइल खोलें , 'डीबग कंसोल' टैब पर जाएं, लेफ्ट नेवी बार में डीबग बटन दबाएं, और रन आइकन (प्ले बटन) पर क्लिक करें!

नोडज स्थापित करने की आवश्यकता है!

Comments

और इस समाधान के साथ एक एक्सटेंशन स्थापित करने की आवश्यकता नहीं है! क्या डिबगर में कोड रनर जैसी ही विशेषताएं हैं?

— रोबिन मेट्रल

मैं कोड रनर से परिचित नहीं हूँ, लेकिन, यह किसी भी अन्य डीबगर ब्रेक पॉइंट, फंक्शन स्टेपिंग इन / आउट, वैरिएबल / एक्सप्रेशन देखने, इत्यादि की तरह व्यवहार करता है

— टेनवेस्ट

यह सबसे अधिक समझ में आता है

— खोई

लेकिन इस तरह आप सही डिबगिंग कर रहे हैं और प्रोग्राम नहीं चला रहे हैं। जब तक और कोई विराम बिंदु नहीं है, यह चलने वाले कार्यक्रम की तरह है, क्या आपका मतलब वही है?

— विक्रमवी

ठीक है, सवाल एक कार्यक्रम चलाने के लिए नहीं कह रहा था, यह "जावास्क्रिप्ट निष्पादित करने और परिणाम प्रदर्शित करने के लिए कहता है", यह दोनों करता है :)

— दस

Answer 4

मेरी राय में यह आपके लिए सबसे तेज़ तरीका है;

• दृश्य स्टूडियो कोड पर एकीकृत टर्मिनल खोलें ( View > Integrated Terminal)
• प्रकार 'node filename.js'
• एंटर दबाए

नोट : नोड सेटअप आवश्यक (यदि आपके पास टर्मिनल पर एक होमब्रेव सिर्फ 'काढ़ा स्थापित नोड' है)

नोट 2 : होमब्रेव और नोड अत्यधिक अनुशंसित हैं यदि आपके पास पहले से नहीं है।

आपका दिन शुभ हो।

Answer 5

एकीकृत टर्मिनल का शॉर्टकट ctrl+ है `, फिर टाइप करें node <filename>।

वैकल्पिक रूप से आप एक कार्य बना सकते हैं। यह मेरे कार्यों का एकमात्र कोड है। Json:

{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "0.1.0",
"command": "node",
"isShellCommand": true,
"args": ["${file}"],
"showOutput": "always"
}

यहां से एक शॉर्टकट बनाएं। यह मेरी कीबाइंडिंग है। संदेश:

// Place your key bindings in this file to overwrite the defaults
[
{   "key": "cmd+r",
"command": "workbench.action.tasks.runTask"
},
{   "key": "cmd+e",
"command": "workbench.action.output.toggleOutput"
}
]

यह कमांड पैलेट में 'रन' को खोलेगा, लेकिन आपको अभी भी उस माउस के साथ टाइप या सिलेक्ट करना होगा जिसे आप चलाना चाहते हैं, इस स्थिति में नोड। दूसरा शॉर्टकट आउटपुट पैनल को जन्म देता है, इसके लिए पहले से ही एक शॉर्टकट है, लेकिन ये कुंजी एक दूसरे के बगल में हैं और साथ काम करना आसान है।

Answer 6

ठीक है, बस कोड को चलाने के लिए और कंसोल पर आउटपुट दिखाने के लिए आप एक कार्य बना सकते हैं और इसे निष्पादित कर सकते हैं, @canerbalci के रूप में बहुत कुछ उल्लेख करते हैं।

इसका नकारात्मक पक्ष यह है कि आप केवल आउटपुट प्राप्त करेंगे और इसे संपादित करेंगे।

मैं वास्तव में क्या करना पसंद करता हूं, कोड को डिबग करने में सक्षम होना चाहिए, मैं कहता हूं कि मैं एक छोटे एल्गोरिथ्म को हल करने की कोशिश कर रहा हूं या एक नया ईएस 6 फीचर की कोशिश कर रहा हूं, और मैं इसे चलाता हूं और इसके साथ कुछ गड़बड़ है, मैं इसे वीएससी के अंदर डिबग कर सकता हूं।

इसलिए, इसके लिए एक कार्य बनाने के बजाय, मैंने इस निर्देशिका में .vscode / launch.json फ़ाइल को संशोधित किया है:

{
"version": "0.2.0",
"configurations": [
    {
        "name": "Launch",
        "type": "node",
        "request": "launch",
        "program": "${file}",
        "stopOnEntry": true,
        "args": [],
        "cwd": "${fileDirname}",
        "runtimeExecutable": null,
        "runtimeArgs": [
            "--nolazy"
        ],
        "env": {
            "NODE_ENV": "development"
        },
        "externalConsole": false,
        "sourceMaps": false,
        "outDir": null
    }
]
}

यह क्या करता है कि यह VSC के डिबगर के भीतर, आप जो भी वर्तमान में हैं, उसे लॉन्च करेंगे। इसकी शुरुआत पर रोक लगाने के लिए।

इसे लॉन्च करने के लिए, F5 कुंजी दबाएं, उस फ़ाइल में जिसे आप डीबग करना चाहते हैं।

Comments

अच्छा है, लेकिन आपको डिबगर को रोकने के लिए अंत में Shift + F5 दबाना होगा

— पीटर डोटचेव

आप अपने कोड में एक process.exit () भी जोड़ सकते हैं: D

— lebobbi

Answer 7

मुझे इस सटीक समस्या का सामना करना पड़ा, जब मैंने पहली बार विस्तार के साथ वीएस कोड का उपयोग करना शुरू कियाCode Runner

आपको जिन चीजों को करने की आवश्यकता है, वह यूजर सेटिंग्स में नोड.जेएस पथ सेट करें

जैसे ही आप इसे अपने विंडोज मशीन में इंस्टॉल करते हैं, आपको पथ सेट करना होगा ।

मेरे लिए यह था \"C:\\Program Files\\nodejs\\node.exe\"

जैसा कि मेरी फ़ाइल निर्देशिका नाम में एक स्थान है

इस छवि को नीचे देखें। मैं पहली बार में कोड चलाने में विफल रहा क्योंकि मैंने पाथ नाम में एक गलती की थी

आशा है कि यह आपकी मदद करेगा।

और incourse, Your Question ने मेरी मदद की, क्योंकि मैं भी JSअपने VS CODE में चलने के लिए यहाँ आया था

Answer 8

वीएस कोड में इन चरणों का पालन करें। [विंडोज़ ओएस में प्रदर्शन किया गया]

1. नई फ़ाइल बनाएँ

2. इसमें जावास्क्रिप्ट कोड लिखें

3. फ़ाइल को filename.js के रूप में सहेजें

4. डिबगिंग मेनू पर जाएं

5. प्रारंभ डीबगिंग पर क्लिक करें

6. या बस F5 दबाएँ

डिबगिंग शुरू करने का स्क्रीनशॉट

टर्मिनल में js कोड के आउटपुट का स्क्रीनशॉट

Answer 9

मैंने Node Exec का उपयोग किया है, किसी भी विन्यास की आवश्यकता नहीं है, उस फ़ाइल का निर्माण करता है जिसे आप वर्तमान में समाप्त कर रहे हैं या जो कभी चुना गया है और VSCode के अंदर आउटपुट करता है।

https://marketplace.visualstudio.com/items?itemName=miramac.vscode-exec-node

थोड़े कॉन्फिग के साथ आप बबल को फ्लाई ट्रांसप्लिंग पर भी कर सकते हैं।

Answer 10

यह बहुत सरल है, जब आप वीएस कोड में एक नई फ़ाइल बनाते हैं और इसे चलाते हैं, यदि आपके पास पहले से कॉन्फ़िगरेशन फ़ाइल नहीं है तो यह आपके लिए एक बनाता है, केवल एक चीज जिसे आपको सेटअप करने की आवश्यकता है वह है "प्रोग्राम" मान, और इसे सेट करें। आपकी मुख्य JS फ़ाइल का पथ, इस तरह दिखता है:

{
    "version": "0.1.0",
    // List of configurations. Add new configurations or edit existing ones.  
    // ONLY "node" and "mono" are supported, change "type" to switch.
    // ABSOLUTE paths are required for no folder workspaces.
    "configurations": [
        {
            // Name of configuration; appears in the launch configuration drop down menu.
            "name": "Launch",
            // Type of configuration. Possible values: "node", "mono".
            "type": "node",
            // ABSOLUTE path to the program.
            "program": "C:\\test.js", //HERE YOU PLACE THE MAIN JS FILE
            // Automatically stop program after launch.
            "stopOnEntry": false,
            // Command line arguments passed to the program.
            "args": [],
            // ABSOLUTE path to the working directory of the program being debugged. Default is the directory of the program.
            "cwd": "",
            // ABSOLUTE path to the runtime executable to be used. Default is the runtime executable on the PATH.
            "runtimeExecutable": null,
            // Optional arguments passed to the runtime executable.
            "runtimeArgs": [],
            // Environment variables passed to the program.
            "env": { },
            // Use JavaScript source maps (if they exist).
            "sourceMaps": false,
            // If JavaScript source maps are enabled, the generated code is expected in this directory.
            "outDir": null
        }, 
        {
            "name": "Attach",
            "type": "node",
            // TCP/IP address. Default is "localhost".
            "address": "localhost",
            // Port to attach to.
            "port": 5858,
            "sourceMaps": false
        }
    ]
}

Comments

यह काम करता है, लेकिन आपको इस फ़ाइल को मॉडिफाई करना होगा जिसे आप एक नई फ़ाइल बनाते हैं, यह वह नहीं है जो ओपी पूछ रहा है मुझे लगता है

— एंड्रीज रहमान

Answer 11

दृश्य स्टूडियो कोड में जावास्क्रिप्ट, अजगर, आदि पर कोड चलाने के लिए वातावरण को सेट करने की कोई आवश्यकता नहीं है, बस आपको कोड रनर एक्सटेंशन स्थापित करना है और फिर उस कोड के भाग का चयन करें जिसे आप चलाना चाहते हैं और हिट करना चाहते हैं। ऊपरी दाएं कोने पर मौजूद रन बटन।

Answer 12

यह अब सबसे आसान हो सकता है, जैसा कि v1.32:

{
    "key": "ctrl+shift+t",
    "command": "workbench.action.terminal.sendSequence",
    "args": { "text": "node '${file}'\u000D" }
  }

अपनी खुद की कीबाइंडिंग का उपयोग करें।

रिलीज़ नोट देखें: sendSequence और वैरिएबल ।

Vscode v1.32 के साथ आप sendSequenceटर्मिनल जैसे चर का उपयोग कर सकते हैं${file} , जो वर्तमान फ़ाइल है। यदि आप वहां कोई दूसरा रास्ता चाहते हैं, तो ऊपर दिए गए कीबाइंडिंग में $ {फाइल} को अपने पाथनेम के साथ बदलें।

यह \u000Dएक वापसी है इसलिए यह तुरंत चलेगा।

यदि आपकी फ़ाइल पथ में रिक्त स्थान है, तो मैंने चर के 'चारों ओर जोड़ा ${file}, जैसेc:Users\Some Directory\fileToRun

Answer 13

मैं आपको एक सरल और आसान प्लगइन का उपयोग करने का सुझाव दूंगा जिसे क्वोकका कहा जाता है जो इन दिनों बहुत लोकप्रिय है और आपको चलते-चलते अपने कोड को डीबग करने में मदद करता है। Quokka.js । इस प्लगइन का उपयोग करने में एक सबसे बड़ा लाभ यह है कि आप वेब ब्राउज़र पर जाने के लिए और अपने कोड का मूल्यांकन करने के लिए बहुत समय बचाते हैं, इसकी मदद से आप वीएस कोड में होने वाली हर चीज को देख सकते हैं, जो बहुत समय बचाता है।

Answer 14

विजुअल स्टूडियो कोड में जावास्क्रिप्ट को चलाने के कई तरीके हैं।

यदि आप नोड का उपयोग करते हैं, तो मैं VSC में मानक डीबगर का उपयोग करने की सलाह देता हूं।

मैं आम तौर पर एक डमी फ़ाइल बनाता हूं, जैसे कि टेस्ट। जेएस जहां मैं बाहरी परीक्षण करता हूं।

आपके फ़ोल्डर में जहां आपका कोड होता है, आप ".vscode" नामक एक फ़ोल्डर बनाते हैं और एक फ़ाइल बनाते हैं जिसे "launch.son" कहा जाता है।

इस फाइल में आप निम्नलिखित पेस्ट करें और सेव करें। अब आपके पास अपने कोड का परीक्षण करने के लिए दो विकल्प हैं।

जब आप "Nodemon Test File" चुनते हैं तो आपको अपना कोड test.js. में परीक्षण करने की आवश्यकता होती है।

VSC में नोडम के साथ डीबग करने के तरीके के बारे में अधिक जानकारी स्थापित करने के लिए, मैं इस लेख को पढ़ने की सलाह देता हूं , जो लॉन्च.जॉसन फ़ाइल पर दूसरा भाग और एक्सप्रेसजेएस में डीबग करने के तरीके के बारे में अधिक विस्तार से बताता है।

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Nodemon Test File",
            "runtimeExecutable": "nodemon",
            "program": "${workspaceFolder}/test.js",
            "restart": true,
            "console": "integratedTerminal",
            "internalConsoleOptions": "neverOpen"
        },
        {
            "type": "node",
            "request": "attach",
            "name": "Node: Nodemon",
            "processId": "${command:PickProcess}",
            "restart": true,
            "protocol": "inspector",
        },
    ]
}

Answer 15

एक अन्य विकल्प विजुअल स्टूडियो कोड के भीतर डेवलपर टूल कंसोल का उपयोग करना है। बस मदद मेनू से "टॉगल डेवलपर टूल" चुनें और फिर पॉप अप करने वाले डेवलपर टूल में "कंसोल" टैब चुनें। वहां से आपके पास वही देव उपकरण आरईपीएल हैं जो आपको क्रोम में मिलते हैं।

Answer 16

खिड़कियों के लिए : का सिर्फ परिवर्तन फ़ाइल संघ .jsके लिए फ़ाइलnode.exe

1) Take VSCode
2) Right click on the file in left pane
3) Click "Reveal in explorer" from context menu
4) Right click on the file -> Select "Open with" -> Select "Choose another program"
5) Check box "Always use this app to open .js file"
6) Click "More apps" -> "Look for another app in PC"
7) Navigate to node.js installation directory.(Default C:\Program Files\nodejs\node.exe"
8) Click "Open" and you can just see cmd flashing
9) Restart vscode and open the file -> Terminal Menu -> "Run active file".

Answer 17

दूसरा तरीका टर्मिनल ctrl + ` एक्जीक्यूट खोलना होगा node। अब आपके पास एक नोड REPL सक्रिय है। अब आप अपनी फ़ाइल या चयनित पाठ को टर्मिनल पर भेज सकते हैं। ऐसा करने के लिए कि VSCode कमांड पैलेट खोलें ( F1 या ctrl + shift + p ) और निष्पादित करें >run selected text in active terminalया >run active file in active terminal।

यदि आपको अपना कोड निष्पादित करने से पहले एक साफ REPL की आवश्यकता है, तो आपको नोड REPL को फिर से शुरू करना होगा। यह तब होता है जब टर्मिनल में नोड REPL के साथ ctrl+c ctrl+cइसे बाहर निकलने और nodeनया शुरू करने के लिए टाइपिंग होती है।

तुम शायद कुंजी पट्टी कमांड को बाँध सकते हो जो भी कुंजी आप चाहते हैं।

पुनश्च: nodeस्थापित किया जाना चाहिए और अपने रास्ते में

Answer 18

बस नोडेम स्थापित करें और चलाएं

nodemon your_file.js

बनाम कोड टर्मिनल पर।