1. 首頁
  2. 問答
  3. 如何在PhpStorm的JavaScript文件中重新格式化HTML代碼

如何在PhpStorm的JavaScript文件中重新格式化HTML代碼

2017-06-18 60 views
2

我正在使用PhpStorm 2016.2並使用VueJS開發Web應用程序。如何在PhpStorm的JavaScript文件中重新格式化HTML代碼

在PhpStorm我想在我的JavaScript文件中重新格式化HTML代碼。但是當我點擊Code | Reformat時，只有JavaScript被重新格式化。

如何重新格式化JavaScript和HTML？

HTML code in a JavaScript file is not reformatted by PhpStorm

來源

2017-06-18 Rifton007

+0

嘗試按Ctrl + A全選。然後Ctrl + Alt + L格式化爲 – brk

+0

已經嘗試過，它不起作用。感謝 – Rifton007

+1

在插入HTML部分時出現'Alt + Enter'，並從出現的菜單中選擇Edit Fragment（或類似命名的條目）。然後您可以在單獨的拆分中調用重新格式化。完成後 - 關閉它（即分割）。 – LazyOne

回答

0

看一看代碼風格選項：

These are my settings and my mixed HTML/JavaScript gets formatted nicely

此外，請確保您使用的報價必要的逃生標籤需要的時候和Tha在運行重新格式化之前，正確放置花括號/分號。

您的JavaScript對象的「模板」使用'（單引號）打開看起來像多行字符串的內容。第49行似乎還有另一個單引號，可能會讓檢查員感到困惑。

在您的HTML位於JavaScript字符串中的情況下，它將（正確）不被格式化。我建議做以下幾點：

  1. 複製HTML到一個獨立的.HTML文件
  2. 重新格式化HTML在那裏
  3. 複製到重新格式化HTML
  4. 回到你的對象的字符串值（模板）
  5. 寫：模板：「」 < - 將插入點放置在報價
  6. 粘貼之間。 PHPStorm應自動轉義您的報價

來源

2017-06-20 18:46:07 Roberto

+0

感謝@Roberto爲您設置的HTML代碼風格，他非常適合我。 但在我的使用案例中，PhpStorm 2016無法在Javascript文件中格式化HTML代碼。從PhpStorm 2017開始可能。 PhpStorm 2016的其他解決方案是使用類似「.vue」類似HTML文件的文件。 [帶有vueJS的單個文件組件]（https://vuejs.org/v2/guide/single-file-components.html） – Rifton007

+0

@ Rifton007我之前沒有使用過「vue」文件。謝謝你介紹給我。很高興你找到另一種解決方案 – Roberto

1

我發現了另一個解決方案，我的問題與PhpStorm 2016. 使用片段編輯器。

  1. 將光標置於HTML代碼片段上。
  2. 按ALT + ENTER鍵並點擊「編輯HTML片段」
  3. 在片段編輯器中重新格式化您的html代碼。
  4. 您的Javascript文件已直接更新。

來源

2017-06-21 06:58:26 Rifton007

相關問題

 相關問題