WebStorm是由JetBrains開發(fā)的一款強(qiáng)大的HTML5編程工具。本軟件擁有強(qiáng)大的JavaScript開發(fā)功能，還有功能強(qiáng)大的前端專用IDE，具備即時(shí)編輯(chrome)、自動(dòng)完成、debugger、Zen Coding、HTML5 支持、JSLint、Less支持、CoffeeScript支持、Node.JS、單元測(cè)試、集成git和svn版本控制等特性，推薦前端工程師使用。

【功能特點(diǎn)】

　　1、支持 Tailwind CSS：WebStorm 現(xiàn)在可以幫助您更高效地使用 Tailwind CSS！ 它將自動(dòng)補(bǔ)全 Tailwind 類，在鼠標(biāo)懸停時(shí)為您顯示所生成 CSS 的預(yù)覽，并支持您使用 tailwind.config.js 文件進(jìn)行自定義。

　　2、根據(jù)用例創(chuàng)建 React 組件：您的代碼中有未解析的 React 組件嗎？ 將脫字符號(hào)放到其中，按 Alt+Enter，然后從列表中選擇 Create class / function component - WebStorm 將為您創(chuàng)建相關(guān)的代碼結(jié)構(gòu)。

　　3、Markdown 編輯和預(yù)覽改進(jìn)：Mermaid.js 支持、重新格式化 .md 文件的功能以及與編輯器一起自動(dòng)滾動(dòng)預(yù)覽窗格的功能 - 這些和其他變更將顯著改善您在 WebStorm 中使用 Markdown 文件的體驗(yàn)。

　　4、對(duì)復(fù)雜 webpack 設(shè)置的基本支持：我們已經(jīng)開始添加對(duì)多個(gè) webpack 配置的支持。 轉(zhuǎn)到 Preferences / Settings | Languages & Frameworks | JavaScript | Webpack 選擇手動(dòng)或自動(dòng)檢測(cè)配置文件。

　　5、Vue.js 的增強(qiáng)：我們已經(jīng)修復(fù)了與 Vue 3 相關(guān)的諸多問(wèn)題。 例如，WebStorm 現(xiàn)在支持腳本設(shè)置語(yǔ)法。 我們還使 IDE 在 Vue 項(xiàng)目中正確應(yīng)用了 ESLint 代碼樣式規(guī)則，并改進(jìn)了與 TypeScript 語(yǔ)言服務(wù)的集成。

　　6、全面支持 pnpm：現(xiàn)在，WebStorm 全面支持 pnpm 程序包管理器以及 npm 和 yarn。 在過(guò)去的一年里，我們一直在逐步實(shí)現(xiàn)對(duì) pnpm 支持的改進(jìn)。 在 v2020.3 中，我們已經(jīng)完成了收尾工作。

【怎么刪除項(xiàng)目】

　　首先，我們打開WebStorm，默認(rèn)會(huì)打開我們上次關(guān)閉軟件時(shí)打開的項(xiàng)目和文件。

　　我們點(diǎn)擊軟件左上角的“File”選項(xiàng)，然后選擇“Open Recent”選項(xiàng)。

　　大家可以看到open recent里面就是我們最近打開的除了本項(xiàng)目以外的其他項(xiàng)目了。

　　然后我們點(diǎn)擊其中任意一個(gè)項(xiàng)目，會(huì)有一個(gè)提示框出現(xiàn)，大致意思是新的項(xiàng)目不能和當(dāng)前項(xiàng)目并存在一個(gè)窗口可以在新窗口打開新項(xiàng)目，或者在當(dāng)前窗口打開。

　　這是直接切換，我們還可以關(guān)閉當(dāng)前項(xiàng)目，在項(xiàng)目列表中選擇進(jìn)入的項(xiàng)目。關(guān)閉項(xiàng)目的按鈕同樣在File的菜單中，“Close Project”就是。關(guān)閉項(xiàng)目后，軟件會(huì)彈出一個(gè)頁(yè)面是項(xiàng)目列表，我們點(diǎn)擊其中任意一個(gè)就可以進(jìn)入相應(yīng)的項(xiàng)目了。

【怎么改背景顏色】

　　默認(rèn)的WebStorm的背景色是純白色，這種顏色更容易讓你引起眼部疲勞。

　　點(diǎn)擊“文件”→“設(shè)置”

　　找到并點(diǎn)擊“Colors & Fonts”打開“Editor”（編輯）

　　打開“編輯”后，找到“HTML”

　　這時(shí)，查看右側(cè)，找到選框，選擇你所喜歡的背景色。

【怎么修改網(wǎng)頁(yè)布局】

　　打開軟件，在界面上方的工具欄上找到第一個(gè)選項(xiàng)卡菜單，file，單擊鼠標(biāo)左鍵彈出如下下拉菜單，選中setting選項(xiàng)。

　　點(diǎn)擊setting選項(xiàng)之后，打開設(shè)置對(duì)話框，我們可以找到appearance選項(xiàng)，也就是外觀設(shè)置選項(xiàng)，這里設(shè)置軟件外觀顯示風(fēng)格。

　　找到name選項(xiàng)，設(shè)置我們喜歡的字體，size選項(xiàng)設(shè)置字體的大小，我們可以預(yù)覽設(shè)置效果，直到達(dá)到滿意的設(shè)置效果為止。

　　我們?cè)O(shè)置代碼編輯區(qū)的顯示效果時(shí)，找到editor編輯選項(xiàng)，這里設(shè)置代碼的字體，關(guān)于編輯區(qū)的所有設(shè)置都可以在這個(gè)選項(xiàng)卡中進(jìn)行。

　　首先我們可以更改編輯區(qū)背景色，將默認(rèn)背景色調(diào)節(jié)為其他背景色顯示，找到color scheme選擇自己喜歡的風(fēng)格，然后點(diǎn)擊apply應(yīng)用之后點(diǎn)擊OK確認(rèn)。

【更新日志】

　　1、JavaScript 支持改進(jìn)；

　　2、HTML 編輯改進(jìn)(同步 HTML 標(biāo)簽編輯，Emmet 編輯)；

　　3、spy-js：高級(jí)搜索和源碼映射支持；

　　4、高級(jí)跟蹤搜索；

　　5、支持在 firefox 調(diào)試；

　　6、新項(xiàng)目向?qū)В?/p>

　　7、Distraction 自由模式；

　　8、更多改進(jìn)內(nèi)容請(qǐng)看發(fā)行說(shuō)明。