विजुअल स्टूडियो कोड

Question

में जेएसएक्स या एचटीएमएल स्वत: पूर्णता विजुअल स्टूडियो कोड में घटकों या एचटीएमएल पूर्णता का उपयोग करने का कोई तरीका है? क्योंकि प्रत्येक अक्षर के लिए मैन्युअल रूप से लिखकर अच्छा विचार नहीं है हम चींटी के रूप में उदाहरण के पूरा होने के लिए बूटस्ट्रैप आदि जैसे श्रेणियां होती हैं जब: ul>li*2>a

var React = require('react'); 

var Header = React.createClass({ 
    render: function() { 
     return (

      <nav className="navbar navbar-defaullt"> 
       <div className="container-fluid"> 
        <a href="/" className="navbar-brand"> 
         <img width="50" height="50" src="images/logo.png" alt="logo" /> 
        </a> 
        <ul className="nav navbar-nav"> 
         <li><a href="/">Home</a></li> 
         <li><a href="/#about">About</a></li> 
        </ul> 
       </div> 
      </nav> 

       ); 
       } 
       }); 
module.exports = Header; 

Answer 1

दृश्य स्टूडियो कोड एक्सटेंशन .jsx का पता लगाने और चींटी डिफ़ॉल्ट रूप से समर्थन जोड़ने (मैं उपयोग कर रहा हूँ वीएस कोड 1.8.1)

लेकिन यदि आप अपनी सभी प्रतिक्रिया फ़ाइलों के लिए .js विस्तार का उपयोग करना पसंद करते हैं - तो आप वीएस कोड विंडो के निचले दाएं कोने में .js फ़ाइलों के साथ जावास्क्रिप्ट प्रतिक्रिया मोड को जोड़ सकते हैं।

How to do this step by step (gif)

Answer 2

कोई अभी भी इस समस्या से जूझ रहा है, तो:

मैं बस

"emmet.syntaxProfiles": { 
    "javascript": "jsx" 
}, 

की स्थापना एचटीएमएल पूरा होने को सक्षम नहीं है कि खोज की है। लेकिन, का उपयोग कर:

"emmet.includeLanguages": { 
    "javascript": "html" 
} 

करता है।

emmet docs के अनुसार:

"emmet.includeLanguages": {}

कि डिफ़ॉल्ट रूप से समर्थन नहीं कर रहे भाषाओं में संक्षिप्त रूपों चींटी सक्षम करें। भाषा और एमेट समर्थित भाषा के बीच यहां एक मैपिंग जोड़ें।
उदाहरण के लिए: {"vue-html": "html", "javascript": "javascriptreact"}

Answer 3

बस उपयुक्त भाषा मोड स्क्रीन पर नीचे दाएं कोने में चयन: यह जावास्क्रिप्ट प्रतिक्रिया करने के लिए निर्धारित किया है।

Answer 4

इनमें से कोई भी समाधान काम नहीं करता ... लेकिन ऑटो बंद टैग एक्सटेंशन करता है! https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-close-tag

Answer 5

दिसंबर 2017 जवाब के लिए

सबसे सीधी-सपाट अपने प्रतिक्रिया परियोजनाओं में JSX/HTML स्वत: पूर्ण पाने के लिए जिस तरह से प्रतिक्रिया अपने उपयोगकर्ता सेटिंग्स या कार्यक्षेत्र सेटिंग्स (<project-path>/.vscode/settings.json) में जोड़ने के लिए है:

 "emmet.includeLanguages": { 
     "javascript": "javascriptreact" 
     }, 
     "emmet.triggerExpansionOnTab": true 

परिवर्तन को प्रभावी होने के लिए आपको वीएस कोड को पुनरारंभ करना पड़ सकता है।

पीएस यदि आप React.js प्रोजेक्ट के लिए यह मैपिंग नहीं कर रहे हैं, तो KehkashanFazal का जवाब शायद आपके लिए काम करना चाहिए।