webstorm怎么用

這篇文章將為大家詳細(xì)講解有關(guān)webstorm怎么用，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。

網(wǎng)站設(shè)計制作過程拒絕使用模板建站；使用PHP+MYSQL原生開發(fā)可交付網(wǎng)站源代碼;符合網(wǎng)站優(yōu)化排名的后臺管理系統(tǒng)；網(wǎng)站設(shè)計制作、網(wǎng)站設(shè)計收費合理；免費進行網(wǎng)站備案等企業(yè)網(wǎng)站建設(shè)一條龍服務(wù).我們是一家持續(xù)穩(wěn)定運營了10年的創(chuàng)新互聯(lián)網(wǎng)站建設(shè)公司。

WebStorm 是JetBrains公司旗下一款JavaScript 開發(fā)工具。已經(jīng)被廣大中國JS開發(fā)者譽為“Web前端開發(fā)神器”、“最強大的HTML5編輯器”、“最智能的JavaScript IDE”等。與IntelliJ IDEA同源，繼承了IntelliJ IDEA強大的JS部分的功能。

設(shè)置技巧：

如何更改主題（字體&配色）:

File -> settings -> Editor -> colors&fonts -> scheme name.主題下載地址

如何讓webstorm啟動的時候不打開工程文件：
File -> Settings->General去掉Reopen last project on startup.

如何完美顯示中文：
File -> Settings->Appearance中勾選Override default fonts by (not recommended)，設(shè)置Name:NSimSun，Size:12

如何顯示行號：
File -> Settings->Editor，”Show line numbers”打上勾，就顯示行號了

如何代碼自動換行：
File -> settings -> Editor “Use Soft Wraps in editor” 打上鉤，代碼就自動換行了

如何點擊光標(biāo)，顯示在本行末尾：
File -> Settings->Editor “Allow placement of caret after end of line”去掉勾就行了。

如何修改快鍵鍵：
File -> Settings->Keymap，然后雙擊要修改快捷的功能會有提示框出來，按提示操作

換成自己熟悉編輯器的快鍵鍵：
File ->Settings->Keymap，支持像Visual Studio、Eclipse、NetBeans這樣的主流IDE。

javascript類庫提示。
File -> settings -> Javascript -> Libraries -> 然后在列表里選擇自己經(jīng)常用到的javascript類庫，最后Download and Install就ok了.

在開發(fā)js時發(fā)現(xiàn)，需要ctrl + return 才能選候選項：
File -> Setting -> Editor -> Code Completion -> Preselect the first suggestion: “Smart” 改為 “Always”

js提示比較遲緩
File -> Code Completion -> Autopopup in 下 1000改為0

git配置：
File -> settings -> Editor -> github，進去改github的賬戶，如果沒有g(shù)it則不需要.

插件安裝：
File ->plugins，然后就選擇給力的插件們再安裝.(“css-X-fire”插件,用于當(dāng)使用firebug修改css屬性時，編輯器內(nèi)的css代碼也會發(fā)生變化。）

以后更新

webstorm使用心得

收藏夾功能:
當(dāng)工程目錄很龐大時，有些子目錄很經(jīng)常打開，但層級又很深，這時候可以把目錄添加到收藏夾里面，添加成功后，左側(cè)有個“Favorites”菜單

面包屑導(dǎo)航：
除了左側(cè)的工程頁面，可以選擇目錄之外，在頂部菜單下有一個類似網(wǎng)站面包屑導(dǎo)航一樣的目錄也可以實現(xiàn)相同功。點擊每個目錄就會有下拉菜單顯示其下的子目錄，很實用.

構(gòu)造器界面:
注釋符合格式的話就會出現(xiàn)。如果是js文件則是js類的函數(shù)和對象；css文件的話則是這個css文件的概括；html文件的話則是節(jié)點的結(jié)構(gòu)圖。話說這幾個就是為了方便查看代碼的結(jié)構(gòu)性.

todo界面：
給代碼加todo注釋就會出現(xiàn)這個界面

雙欄代碼界面：
右擊代碼選項卡上的文件，然后右鍵 -> spilt vertically(左右兩屏)或者spilt horizontally(上下兩屏)

本地歷史功能:
找回代碼的好辦法

WebStorm集成git使用

webstorm中只集成了git的常用操作，并不能完全替代命令行工具。在界面的右下角可以查看處于哪個git分支。也可以在上面點擊切換或者新建分支。

查看當(dāng)前代碼與版本庫代碼的差異:
右擊代碼界面任意區(qū)域，選擇git -> compare with然后選擇要比較的版本庫。

webstorm快捷鍵說明

Editing編輯相關(guān)快捷鍵

Ctrl + Space：
Basic code completion (the name of any class, method or variable) 基本代碼完成（任何類、函數(shù)或者變量名稱），改為Alt+S

Ctrl + Shift + Enter：
Complete statement 補全當(dāng)前語句

Ctrl + P：
Parameter info (within method call arguments) 參數(shù)信息 包括方法調(diào)用參數(shù)

Ctrl + mouse over code
Brief Info 簡單信息

Ctrl + F1
Show description of error or warning at caret 顯示光標(biāo)所在位置的錯誤信息或者警告信息

Alt + Insert
Generate code…（Getters, Setters, Constructors）新建一個文件或者生成代碼，…構(gòu)造函數(shù)，可以創(chuàng)建類里面任何字段的getter與setter方法

Ctrl + O
Override methods 重載方法

Ctrl + I
Implement methods 實現(xiàn)方法

Ctrl + Alt + T
Surround with…（if, else, try, catch, for, etc）用 * 來圍繞選中的代碼行，（ * 包括 if 、 while 、 try catch 等）

Ctrl + /
Comment/uncomment with line comment 行注釋/取消行注釋

Ctrl + Shift + /
Comment/uncomment with block comment 塊注釋/取消塊注釋

Ctrl + W
Select successively increasing code blocks 選擇代碼塊，一般是增量選擇

Ctrl + Shift + W
Decrease current selection to previous state 上個快捷鍵的回退，減量選擇代碼

Alt + Q
Context info 上下文信息

Alt + Enter
Show intention actions and quick-fixes 意圖行動，快速見效

Ctrl + Alt + L
Reformat code 根據(jù)模板格式對代碼格式化

Tab/ Shift + Tab
Indent/unindent selected lines 對所選行進行縮排處理/撤銷縮排處理

Ctrl + X or Shift + Delete
Cut current line or selected block to clipboard 剪切當(dāng)前行或所選代碼塊到剪切板

Ctrl + C or Ctrl + Insert
Copy current line or selected block to chipboard 拷貝當(dāng)前行或者所選代碼塊到剪切板

Ctrl + V or Shift + Insert
Paste from clipboard 粘貼剪切板上的內(nèi)容

Ctrl + Shift + V
Paste from recent buffers 粘貼緩沖器中最新的內(nèi)容

Ctrl + D
Duplicate current line or selected block 復(fù)制當(dāng)前行或者所選代碼塊

Ctrl + Y
Delete line at caret 刪除光標(biāo)所在位置行

Ctrl + Shift + J
Smart line join（HTML and JavaScript only）加入智能行 （HTML 和JavaScript）

Ctrl + Enter
Smart line split（HTML and JavaScript only）分離智能行 （HTML 和JavaScript）

Shift + Enter
Start new line 另起一行

Ctrl + Shift + U
Toggle case for word at caret or selected block 光標(biāo)所在位置大小寫轉(zhuǎn)換

Ctrl + Shift + ]/[
Select till code block end/start 選擇直到代碼塊結(jié)束/開始

Ctrl + Delete
Delete to word end 刪除文字結(jié)束

Ctrl + Backspace
Delete to word start 刪除文字開始

Ctrl + NumPad+/-
Expand/collapse code block 擴展/縮減代碼塊

Ctrl + Shift+ NumPad+
Expand all 擴張所有

Ctrl + Shift+ NumPad-
Collapse 縮減所有

Ctrl + F4
Close active editor tab 關(guān)閉活躍編輯標(biāo)簽

Search/replace搜索/替代相關(guān)快捷鍵

Ctrl + F
Find 當(dāng)前文件內(nèi)快速查找代碼

Ctrl + Shift + F
Find in path 指定文件內(nèi)尋找路徑

F3
Find next 查找下一個

Shift + F3
Find previous 查找上一個

Ctrl + R
Replace 當(dāng)前文件內(nèi)代碼替代

Ctrl + Shift + R
Replace in path 指定文件內(nèi)代碼批量替代

Usage Search搜索相關(guān)快捷鍵

Alt + F7/Ctrl + F7
Find usages/Find usages in file 找到使用/在文件找到使用

Ctrl + Shift + F7
Highlight usages in file文件中精彩使用

Ctrl + Alt + F7
Show usages 顯示使用

Running運行

Alt + Shift + F10
Select configuration and run 選擇構(gòu)架，運行

Alt + Shift + F9
Select configuration and debug 選擇構(gòu)架，修補漏洞

Shift + F10
Run 運行

Shift + F9
Debug 修補漏洞

Ctrl + Shift + F10
Run context configuration from editor 從編輯運行內(nèi)容構(gòu)架

Ctrl + Shift + X
Run command line 運行命令行

Debugging Debugging相關(guān)快捷鍵

F8
Step over 不進入函數(shù)

F7
Step into 單步執(zhí)行

Shift + F7
Smart step into 智能單步執(zhí)行

Shift + F8
Step out 跳出

Alt + F9
Run to cursor 運行到光標(biāo)處

Alt+ F8
Evaluate expression 評估表達

F9
Resume program 重新開始程序

Ctrl + F8
Toggle breakpoint 切換斷點

Ctrl + Shift + F8
View breakpoints 查看斷點

Navigation 定位相關(guān)快捷鍵

Ctrl + N
Go to class跳轉(zhuǎn)到指定類

Ctrl + Shift + N
Go to file 通過文件名快速查找工程內(nèi)的文件

Ctrl + Alt +Shift + N
Go to symbol 通過一個字符查找函數(shù)位置

Alt + Right/ left
Go to next/ previous editor tab 進入下一個/ 上一個編輯器選項

F12
Go back to previous tool window 進入上一個工具窗口

Esc
Go to editor（from tool window） 從工具窗口進入編輯器

Shift + Esc
Hide active or last active window 隱藏活動窗口

Ctrl + Shift + F4
Close active run/message/find/…tab 關(guān)閉活動….標(biāo)簽

Ctrl + G
Go to line 跳轉(zhuǎn)到第幾行

Ctrl + E
Recent files popup 彈出最近打開的文件

Ctrl + Alt + Left/Right
Navigate back/forward 導(dǎo)航前進/后退

Ctrl + Shift + Backspace
Navigate to last edit location 向最近編輯定位導(dǎo)航

Alt + F1
Select current file or symbol in any view 查找當(dāng)前選中的代碼或文件在其他界面模塊的位置

Ctrl + B or Ctrl + Click
Go to declaration跳轉(zhuǎn)到定義處

Ctrl + Alt + B
Go to implementation(s) 跳轉(zhuǎn)方法實現(xiàn)處

Ctrl + Shift + B
Go to type declaration 跳轉(zhuǎn)方法定義處

Ctrl + Shift + I
Open quick definition lookup 打開定義快速查找

Ctrl + U
Go to super-method/super-class 跳轉(zhuǎn)方法/超階級

Alt + Up/Down
Go to previous/next method 在方法間快速移動定位

Ctrl + ]/[
Move to code block end/start 跳轉(zhuǎn)到編碼塊結(jié)束/開始

Ctrl + F12
File structure popup 文件結(jié)構(gòu)彈出

Ctrl + H
Type hierarchy 類型層次

Ctrl + Alt + H
Call hierarchy 調(diào)用層次結(jié)構(gòu)

F2/ Shift + F2
Next/previous highlighted error 跳轉(zhuǎn)到后一個/前一個錯誤，高亮錯誤或警告快速定位，使用這個快捷鍵可以快捷在出錯的語句之間進行跳轉(zhuǎn)。

F4/Ctrl + Enter
Edit source/ View source 編輯源代碼/查看源代碼

Alt + Home
Show navigation bar 顯示導(dǎo)航欄

F11
Toggle bookmark 切換標(biāo)記

Ctrl + F11
Toggle bookmark with mnemonic 采用記憶切換標(biāo)記

Ctrl + #[0-9]
Go to numbered bookmark 跳轉(zhuǎn)到帶編號的標(biāo)記

Shift + F11
Show bookmark 顯示標(biāo)記

Refactoring 重構(gòu)相關(guān)快捷鍵

F5
Copy 拷貝

F6
Move 移動

Alt + Delete
Safe Delete 安全刪除

Shift + F6
Rename 重新命名

Ctrl + Alt + N
Inline Variable 嵌入變量

Ctrl + Alt + M
Extract Method( Javascript only) 提取函數(shù)

Ctrl + Alt + V
Introduce Variable 引入變量

Ctrl + Alt + F
Introduce Field 引入域

Ctrl + Alt + C
Introduce Constant 引入常量

VCS/Local History 版本控制系統(tǒng)/ 本地歷史相關(guān)快捷鍵

Alt +　BackQuote( )
‘VCS’quick popup 快速彈出 VCS

Ctrl + K
Commit project to VCS 提交項目至VCS

Ctrl + T
Update project from VCS 從VCS 更新項目

Alt + Shift + C
View recent changes 查看最新改變

General 常用的相關(guān)快捷鍵

Ctrl + Shift +A
Find action 查找并調(diào)用編輯器的功能

Alt + #[0-9]
Open corresponding tool window 快速切換打開界面模塊

Ctrl + Alt + F11
Toggle full screen mode 切換全屏模式

Ctrl + Shift + F12
Toggle maximizing editor 切換最大化編輯器

Alt + Shift + F
Add to Favorites 將當(dāng)前文件添至收藏夾

Alt + Shift + I
Inspect current file with current profile 使用當(dāng)前屬性檢查當(dāng)前文件

Ctrl + BackQuote( )
Quick switch current scheme 快速轉(zhuǎn)換現(xiàn)有組合

Ctrl + Alt + S
Open setting dialog 打開設(shè)置對話框

Ctrl + Tab
Switch between tabs and tool window 標(biāo)簽和工具窗的轉(zhuǎn)換（與windows快捷鍵沖突）

關(guān)于“webstorm怎么用”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，使各位可以學(xué)到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。

文章名稱：webstorm怎么用
標(biāo)題鏈接：http://bm7419.com/article44/jceohe.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供關(guān)鍵詞優(yōu)化、品牌網(wǎng)站建設(shè)、云服務(wù)器、網(wǎng)站排名、自適應(yīng)網(wǎng)站、品牌網(wǎng)站設(shè)計

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)