WebStorm(JS開(kāi)發(fā)工具)是JetBrains開(kāi)發(fā)的專(zhuān)業(yè)IDE(集成開(kāi)發(fā)環(huán)境),用于Web及前端開(kāi)發(fā)。它配備豐富功能與工具,幫助開(kāi)發(fā)人員提升工作效率、優(yōu)化代碼質(zhì)量。支持HTML、CSS、JavaScript、TypeScript等多種流行前端技術(shù),以及React、Angular、Vue.js等框架,具備智能代碼補(bǔ)全、語(yǔ)法檢查、調(diào)試工具、版本控制集成等功能,能幫助開(kāi)發(fā)人員快速編寫(xiě)、調(diào)試和部署網(wǎng)頁(yè)與Web應(yīng)用程序。還擁有強(qiáng)大的代碼導(dǎo)航和重構(gòu)工具,方便開(kāi)發(fā)人員管理大型項(xiàng)目。它是一款強(qiáng)大且易用的工具,適用于各類(lèi)規(guī)模的Web開(kāi)發(fā)項(xiàng)目。需要的朋友快來(lái)下載試試吧!
webstorm怎么改字體大小
1、Ctrl+滾動(dòng)滑輪調(diào)整字體大小
File--->Settings(Ctrl+Alt+s)--->Editor--->General--->Change font size(Zoom)……前面的方框打?qū)?。如下圖
點(diǎn)擊ok即可。
在編輯代碼頁(yè)面Ctrl+滾動(dòng)滑輪即可調(diào)整字體大小。

2、通過(guò)改變size來(lái)調(diào)整字體大小
File--->Settings(Ctrl+Alt+s)--->Editor--->Font--->Size。如下圖:
點(diǎn)擊Apply適用字體大小是否合適,不合適在做調(diào)整,合適直接ok即可。如果此時(shí)代碼并沒(méi)有變大或者變小,新建一個(gè)html頁(yè)面,試著調(diào)整大小,就好了(我的就是這種情況)。

WebStorm核心功能
1、Java、Type 和 CSS:
優(yōu)化了 Java 與 Type 的錯(cuò)誤提示格式,增強(qiáng)快速修復(fù)能力,支持自動(dòng)導(dǎo)入實(shí)時(shí)模板。新增 CSS 嵌套語(yǔ)法支持,并可將顏色值轉(zhuǎn)換為 lch 與 oklch 格式,提升樣式編寫(xiě)靈活性。
2、框架和技術(shù):
引入 Vue 語(yǔ)言服務(wù)器支持,完善對(duì)提供/注入及模型定義的功能識(shí)別;加強(qiáng)對(duì) Next.js 中 App Router 的適配;新增 React hooks 的代碼模板;提升 SolidJS 與 Preact 的開(kāi)發(fā)體驗(yàn)。
3、新 UI:
改進(jìn)主工具欄的自定義設(shè)置,支持彩色項(xiàng)目標(biāo)題顯示;推出帶淺色標(biāo)題欄的淺色主題;重新設(shè)計(jì)漢堡菜單布局,界面更清晰直觀(guān)。
4、集成開(kāi)發(fā)工具:
新增 AI Assistant 預(yù)覽功能,支持 GitLab 項(xiàng)目集成,允許提交指定代碼行變更,優(yōu)化 Docker 插件功能,并改進(jìn)內(nèi)置 HTTP 客戶(hù)端的操作體驗(yàn)。
5、用戶(hù)體驗(yàn):
在“Search Everywhere”中支持純文本內(nèi)容搜索;可在“項(xiàng)目”視圖中按文件修改時(shí)間排序;在“設(shè)置”界面推薦相關(guān)插件,幫助用戶(hù)發(fā)現(xiàn)實(shí)用擴(kuò)展。
6、插件開(kāi)發(fā):
為插件開(kāi)發(fā)者提供 LSP(語(yǔ)言服務(wù)器協(xié)議)支持,便于構(gòu)建更高效的語(yǔ)言工具擴(kuò)展。
WebStorm推薦特色
1、專(zhuān)為 JavaScript 開(kāi)發(fā)設(shè)計(jì)
是否在尋找應(yīng)對(duì) JavaScript 開(kāi)發(fā)挑戰(zhàn)的可靠工具?十多年來(lái),我們持續(xù)打磨產(chǎn)品,致力于提升編碼過(guò)程的愉悅感。無(wú)論是使用 JS、TS、React、Vue、Angular、Node.js、HTML,還是各類(lèi)樣式語(yǔ)言,WebStorm 均能提供全面支持。
2、智能化代碼編輯
深入解析項(xiàng)目結(jié)構(gòu),在編寫(xiě)代碼的各個(gè)環(huán)節(jié)提供輔助。支持智能代碼補(bǔ)全,實(shí)時(shí)識(shí)別錯(cuò)誤與冗余代碼,并給出修復(fù)建議,同時(shí)協(xié)助您安全地進(jìn)行代碼重構(gòu)。
3、集成開(kāi)發(fā)環(huán)境工具
在 IDE 內(nèi)即可使用全套開(kāi)發(fā)工具,無(wú)需頻繁切換。支持調(diào)試與測(cè)試前端及 Node.js 應(yīng)用,內(nèi)置版本控制系統(tǒng)。linter、構(gòu)建工具、命令行終端和 HTTP 客戶(hù)端均已與環(huán)境無(wú)縫整合。
4、高效導(dǎo)航與查找
無(wú)論項(xiàng)目規(guī)模大小,都能快速定位所需內(nèi)容??伤阉魑募?、類(lèi)或符號(hào),并集中查看所有匹配結(jié)果。通過(guò)簡(jiǎn)單點(diǎn)擊,即可跳轉(zhuǎn)至函數(shù)、方法、變量、組件或類(lèi)的定義位置,并查找其調(diào)用位置。
5、強(qiáng)化團(tuán)隊(duì)協(xié)作
核心功能開(kāi)箱即用,有助于加快新成員的上手速度。支持實(shí)時(shí)協(xié)同編碼,團(tuán)隊(duì)成員可直接在編輯器內(nèi)溝通交流。項(xiàng)目配置(如代碼格式規(guī)范)可共享,配合 Git 與 GitHub 實(shí)現(xiàn)高效協(xié)作。
WebStorm常用快捷鍵
1、ctrl + shift + n: 打開(kāi)工程中的文件,目的是打開(kāi)當(dāng)前工程下任意目錄的文件;
2、ctrl + j: 輸出模板;
3、ctrl + b: 跳到變量申明處;
4、ctrl + alt + T: 圍繞包裹代碼(包括zencoding的Wrap with Abbreviation);
5、ctrl + []: 匹配 {}[];
6、ctrl + F12: 可以顯示當(dāng)前文件的結(jié)構(gòu);
7、ctrl + x: 剪切(刪除)行,不選中,直接剪切整個(gè)行,如果選中部分內(nèi)容則剪切選中的內(nèi)容;
8、alt + left/right:標(biāo)簽切換;
9、ctrl + r: 替換;
10、ctrl + shift + up: 行移動(dòng);
11、shift + alt + up: 塊移動(dòng)(if(){},while(){}語(yǔ)句塊的移動(dòng));
12、ctrl + d: 行復(fù)制;
13、ctrl + shift + ]/[: 選中塊代碼;
14、ctrl + / : 單行注釋?zhuān)?/p>
15、ctrl + shift + / : 塊注釋?zhuān)?/p>
16、ctrl + shift + i : 顯示當(dāng)前CSS選擇器或者JS函數(shù)的詳細(xì)信息;
17、ctrl + '-/+': 可以折疊項(xiàng)目中的任何代碼塊,它不是選中折疊,而是自動(dòng)識(shí)別折疊;
18、ctrl + '.': 折疊選中的代碼的代碼
19、shift + esc: 當(dāng)前激活的任意小窗口最小化,也可以是alt+數(shù)字鍵,數(shù)字在小窗口有顯示;
20、alt + '7': 顯示當(dāng)前的函數(shù)結(jié)構(gòu)
21、如果是*.html頁(yè)面,則在文件名下的導(dǎo)航欄某DOM結(jié)構(gòu)上右鍵,可以全選當(dāng)前DOM結(jié)構(gòu);