WEBSTORM：TypeScript 改進，更多運行和調(diào)試場景，雙控制臺，更多 Git 改進

WEBSTORM最新版，震撼來襲

WebStorm 2018.1新增了與漂亮，部分Git提交的集成，對Vue.js和React Native的更好支持以及完全重新設(shè)計的文檔。

JavaScript & TypeScript

新的文檔UI

滿足新的，更緊湊和輕便的文檔彈出窗口！

它使用更清晰和一致的格式來呈現(xiàn)JavaScript和TypeScript中關(guān)于方法參數(shù)，類型和返回類型的可用信息。 它還使用JSDoc評論中的Markdown。

TypeScript 改進

除了支持最新的TypeScript 2.7功能之外，此更新還改進了實施成員操作，并為未解決的屬性添加了帶有類型保護快速修復(fù)的新環(huán)繞聲。

WebStorm現(xiàn)在還可識別除tsconfig.json以外的其他名稱的TypeScript配置文件。

一起重命名類和文件

現(xiàn)在，如果您為一個類運行重構(gòu) - 重命名，WebStorm還會建議重命名文件及其用法，如果它與該類具有相同的名稱。

如果您按下類別，界面或類型的名稱上的Alt-Enter，您將看到一個新的意圖，建議將文件重命名為該名稱。

代碼樣式

用Prettier重新格式化

有了新的用 Prettier重新格式化的操作 (Alt-Shift-Cmd/Ctrl-P), 您可以使用Prettier把選中的代碼，文件或整個目錄格式化。

要注意的是，應(yīng)將Prettier作為您的項目依賴項或全局安裝在您的計算機上。

架構(gòu)

創(chuàng)建新的 Vue 項目

你現(xiàn)在可以在WebStorm用Vue CLI創(chuàng)建新的 Vue項目

運行npm install -g vue-cli即可安裝，然后在 IDE的歡迎屏幕上點擊“創(chuàng)建新項目 – Vue.js”，回答你想在新項目中使用的模板和工具的問題。

提取Vue組件

從已有的Vue組件中創(chuàng)建一個新的Vue組件,，不需復(fù)制或粘貼 – 選擇模板的這部分使用 Refactor – Extract或 按住 Alt-Enter選擇Extract Vue 組件。

WebStorm將創(chuàng)建一個新的單文件組件，為其添加一個導(dǎo)入，并將所有數(shù)據(jù)和方法與道具一起傳遞給它。

工具

調(diào)試 React Native app

通過更新的React Native配置，WebStorm現(xiàn)在支持更多的運行和調(diào)試場景：您現(xiàn)在可以單獨配置bundler的啟動方式，并將調(diào)試器附加到已經(jīng)在設(shè)備上構(gòu)建并啟動的應(yīng)用程序。

此外，您現(xiàn)在可以在IDE中調(diào)試使用Exporight的應(yīng)用程序。

配置包管理器

在WebStorm中配置包管理器變得更加容易 - 在Node.js和npmpreferences中，您可以在npm和Yarn之間進行選擇，然后使用它來安裝依賴關(guān)系并運行腳本。

如果你用yarn.lock文件打開一個新項目，如果安裝了WebStorm，它將使用Yarn。

新的Node.js調(diào)試器控制臺

Node.js調(diào)試器現(xiàn)在有兩個控制臺選項卡 - 控制臺選項卡，它顯示節(jié)點進程本身的輸出以及可執(zhí)行JavaScript的新調(diào)試器控制臺，請參閱console.log消息，然后跳轉(zhuǎn)到console.log所在的位置調(diào)用。

版本控制

部分在Git中提交

通過對部分Git提交的支持，您現(xiàn)在可以僅提交文件中的選定更改。 使用Commit Changesdialog的差異視圖中的復(fù)選框選擇要提交的代碼塊。

您還可以使用編輯器裝訂線上的操作將更改的代碼行添加到新的更改列表中，然后提交更改列表。

更多 Git 改進

在提交細節(jié)中，您現(xiàn)在可以單擊提交哈希來跳轉(zhuǎn)到日志中的提交。

當(dāng)你進行rebase時，現(xiàn)在有新的Abort Rebase，Continue Rebase和Skip Committions在Git Branches彈出窗口中可用。

樣式表

完成并進入類的定義

Cmd / Ctrl-單擊HTML中的類名現(xiàn)在將建議不僅導(dǎo)航到此HTML文件中鏈接的已編譯CSS文件中的聲明，而且還導(dǎo)航到Sass，SCSS或Less源。

在HTML中，如果鏈接的CSS文件中沒有匹配的符號，則代碼完成將建議所有樣式表中的類和id。

其他改進:

• 如果您正在遷移到webpack      4，WebStorm現(xiàn)在可以檢查并提供webpack配置文件中選項名稱的完成。

• 與測試類似，您現(xiàn)在可以在編輯器中使用圖標(biāo)直接運行npm腳本。

• 將HTML代碼復(fù)制到JSX文件時，WebStorm將自動使用React特定的屬性替換類和事件處理程序。

• package.json中的新檢查會在您安裝的軟件包版本與指定范圍不匹配時發(fā)出警告。

• 更好地完成SVG屬性和CSS文件中的值。

• 您現(xiàn)在可以使用JetBrains帳戶在多臺機器上同步IDE設(shè)置。

• 支持ECMAScript提議：模板字符串中的轉(zhuǎn)義序列，RegExp      lookbehind斷言和命名捕獲的組以及類字段。

• 改進了代碼完成，并使用import（）定義動態(tài)導(dǎo)入。