亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

VS 代碼用新行格式化 JSX

VS 代碼用新行格式化 JSX

海綿寶寶撒 2022-12-22 15:26:19
我最近開始使用 React 進行編碼,我立即注意到 VS Code 正在按如下方式格式化我的 React 文件,這導致 linter 發出各種警告。索引.jsclass App extends Component {  render() {    return ( <      div className = "App" >      <      header className = "App-header" >      <      img src = {        logo      }      className = "App-logo"      alt = "logo" / >      <      p >      Edit < code > src / App.js < /code> and save to reload. < /      p > <      a className = "App-link"      href = "https://reactjs.org"      target = "_blank"      rel = "noopener noreferrer" >      Learn React <      /a> < /      header > <      /div>    );  }}我無法在應用程序中找到 Prettier 設置或導致此問題的任何其他設置,有什么建議嗎?擴展(注意 WSL Ubuntu Windows)括號對著色器Chrome 調試器Javascript (ES6) 代碼片段反應硝基片段Reactjs 代碼片段遠程-WSL主題自動前綴美化城市之光圖標包VS 代碼的編輯器配置ESLintGithub 拉取請求和問題GitLens - Git 增壓進口成本直播服務器npmnpm 智能感知路徑智能感知Prettier - 代碼格式化程序反應擴展包反應硝基要點搜索節點模塊聲納林特冬天vue-美化
查看完整描述

5 回答

?
元芳怎么了

TA貢獻1798條經驗 獲得超7個贊

您需要選擇默認格式化程序。

  1. Ctrl+Shift+P(Win) 或Cmd+Shift+P(Mac)

  2. 鍵入格式化文檔...

  3. 然后單擊Configure Default Formatter...并從列表中選擇它。

http://img1.sycdn.imooc.com//63a406dd0001bddf07910169.jpg

查看完整回答
反對 回復 2022-12-22
?
慕尼黑的夜晚無繁華

TA貢獻1864條經驗 獲得超6個贊

你應該下載 Prettier。然后轉到“設置”并選中(復選框)“更漂亮:JSX 支架同一行”它應該運行良好



查看完整回答
反對 回復 2022-12-22
?
MM們

TA貢獻1886條經驗 獲得超2個贊

只需在 VS CODE 上安裝 Preitter Extensions,它將重新格式化所有文件

http://img1.sycdn.imooc.com//63a406f30001eab513640765.jpg


查看完整回答
反對 回復 2022-12-22
?
慕桂英4014372

TA貢獻1871條經驗 獲得超13個贊

這可能是由于 vs code 中可用的格式工具存在沖突。為了解決這個

  1. Ctrl+Shift+P(windows) 或Cmd+Shift+P(Mac)

  2. 類型Format Document With...

  3. 選擇Configure default Formatter...

  4. 為以后的格式選擇一個選項。(如果你選擇的是 vs code 的內置格式工具,最好禁用/刪除其他代碼格式擴展)

  5. 選擇全部Ctrl+A(Windows) 或Cmd+A(Mac),然后按Ctrl+K Ctrl+F(windows) 或Cmd+K Cmd+F來格式化文檔。


查看完整回答
反對 回復 2022-12-22
?
肥皂起泡泡

TA貢獻1829條經驗 獲得超6個贊

如果您在 Visual Studio Code 中使用更漂亮的擴展,請嘗試將其添加到 settings.json 文件中:


"editor.insertSpaces": false,

"editor.tabSize": 4,

"editor.detectIndentation": false,


"prettier.tabWidth": 4,

"prettier.useTabs": true  // This made it finally work for me

好吧,如果您喜歡開發人員方式,Visual Studio Code 允許您為 tabSize 指定不同的文件類型。這是我的 settings.json 示例,默認有四個空格,JavaScript/JSON 有兩個空格:


{

 // I want my default to be 4, but JavaScript/JSON to be 2

 "editor.tabSize": 4,

 "[javascript]": {

  "editor.tabSize": 2

 },

"[json]": {

 "editor.tabSize": 2

 },


 // This one forces the tab to be **space**

"editor.insertSpaces": true

}


查看完整回答
反對 回復 2022-12-22
  • 5 回答
  • 0 關注
  • 259 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號