WebStorm¶
Traduzione: Copia tutti i comandi
Traduzione: Generare PDF
< >
Scorciatoie e flussi di lavoro completi di WebStorm per lo sviluppo JavaScript, TypeScript, React, Vue e Node.js.
## Scorciatoie generali
|Windows/Linux|macOS|Description|
|---------------|-------|-------------|
|`Ctrl+Shift+A`|`Cmd+Shift+A`|Find Action|
|`Ctrl+Shift+N`|`Cmd+Shift+O`|Go to File|
|`Ctrl+N`|`Cmd+O`|Go to Class|
|`Ctrl+Shift+Alt+N`|`Cmd+Option+O`|Go to Symbol|
|`Ctrl+E`|`Cmd+E`|Recent Files|
|`Ctrl+Shift+E`|`Cmd+Shift+E`|Recent Locations|
|`Ctrl+G`|`Cmd+L`|Go to Line|
|`Ctrl+F12`|`Cmd+F12`|File Structure|
|`Alt+F1`|`Option+F1`|Select In|
## Navigazione
|Windows/Linux|macOS|Description|
|---------------|-------|-------------|
|`Ctrl+B`|`Cmd+B`|Go to Declaration|
|`Ctrl+Alt+B`|`Cmd+Option+B`|Go to Implementation|
|`Ctrl+Shift+B`|`Cmd+Shift+B`|Go to Type Declaration|
|`Ctrl+U`|`Cmd+U`|Go to Super Method|
|`Alt+F7`|`Option+F7`|Find Usages|
|`Ctrl+F7`|`Cmd+F7`|Find Usages in File|
|`Ctrl+Shift+F7`|`Cmd+Shift+F7`|Highlight Usages|
|`Ctrl+Alt+F7`|`Cmd+Option+F7`|Show Usages|
|`Ctrl+Click`|`Cmd+Click`|Go to Declaration|
## Modifica
|Windows/Linux|macOS|Description|
|---------------|-------|-------------|
|`Ctrl+Space`|`Ctrl+Space`|Basic Code Completion|
|`Ctrl+Shift+Space`|`Ctrl+Shift+Space`|Smart Code Completion|
|`Ctrl+Alt+Space`|`Ctrl+Option+Space`|Class Name Completion|
|`Ctrl+Shift+Enter`|`Cmd+Shift+Enter`|Complete Current Statement|
|`Ctrl+P`|`Cmd+P`|Parameter Info|
|`Ctrl+Q`|`Ctrl+J`|Quick Documentation|
|`Shift+F1`|`Shift+F1`|External Documentation|
|`Ctrl+F1`|`Cmd+F1`|Show Error Description|
|`Alt+Insert`|`Cmd+N`|Generate Code|
|`Ctrl+O`|`Ctrl+O`|Override Methods|
## Formattazione del codice
|Windows/Linux|macOS|Description|
|---------------|-------|-------------|
|`Ctrl+Alt+L`|`Cmd+Option+L`|Reformat Code|
|`Ctrl+Alt+O`|`Ctrl+Option+O`|Optimize Imports|
|`Ctrl+Alt+I`|`Ctrl+Option+I`|Auto-Indent Lines|
|`Tab`|`Tab`|Indent Selection|
|`Shift+Tab`|`Shift+Tab`|Unindent Selection|
|`Ctrl+Alt+T`|`Cmd+Option+T`|Surround With|
|`Ctrl+/`|`Cmd+/`|Comment/Uncomment Line|
|`Ctrl+Shift+/`|`Cmd+Shift+/`|Comment/Uncomment Block|
## Refactoring
|Windows/Linux|macOS|Description|
|---------------|-------|-------------|
|`F5`|`F5`|Copy|
|`F6`|`F6`|Move|
|`Shift+F6`|`Shift+F6`|Rename|
|`Ctrl+F6`|`Cmd+F6`|Change Signature|
|`Ctrl+Alt+N`|`Cmd+Option+N`|Inline|
|`Ctrl+Alt+M`|`Cmd+Option+M`|Extract Method|
|`Ctrl+Alt+V`|`Cmd+Option+V`|Extract Variable|
|`Ctrl+Alt+F`|`Cmd+Option+F`|Extract Field|
|`Ctrl+Alt+C`|`Cmd+Option+C`|Extract Constant|
|`Ctrl+Alt+P`|`Cmd+Option+P`|Extract Parameter|
## Correre e debug
|Windows/Linux|macOS|Description|
|---------------|-------|-------------|
|`Shift+F10`|`Ctrl+R`|Run|
|`Shift+F9`|`Ctrl+D`|Debug|
|`Ctrl+Shift+F10`|`Ctrl+Shift+R`|Run Context Configuration|
|`Ctrl+Shift+F9`|`Ctrl+Shift+D`|Debug Context Configuration|
|`F8`|`F8`|Step Over|
|`F7`|`F7`|Step Into|
|`Shift+F7`|`Shift+F7`|Smart Step Into|
|`Shift+F8`|`Shift+F8`|Step Out|
|`Alt+F9`|`Option+F9`|Run to Cursor|
|`Alt+F8`|`Option+F8`|Evaluate Expression|
## JavaScript/TypeScript Specifico
|Windows/Linux|macOS|Description|
|---------------|-------|-------------|
|`Ctrl+Shift+F10`|`Ctrl+Shift+R`|Run JavaScript File|
|`Alt+Shift+F10`|`Option+Shift+R`|Run Node.js|
|`Ctrl+Shift+I`|`Cmd+Shift+I`|Auto Import|
|`Ctrl+Alt+Shift+T`|`Cmd+Option+Shift+T`|Refactor This|
|`F2`|`F2`|Next Highlighted Error|
|`Shift+F2`|`Shift+F2`|Previous Highlighted Error|
## Sviluppo del reattore
|Windows/Linux|macOS|Description|
|---------------|-------|-------------|
|`Ctrl+J`|`Cmd+J`|Insert Live Template|
|`Ctrl+Alt+J`|`Cmd+Option+J`|Surround with Live Template|
|`Ctrl+Shift+A`|`Cmd+Shift+A`|Find Action (React snippets)|
|`rcc` + `Tab`|`rcc` + `Tab`|React Class Component|
|`rfc` + `Tab`|`rfc` + `Tab`|React Function Component|
|`useState` + `Tab`|`useState` + `Tab`|useState Hook|
|`useEffect` + `Tab`|`useEffect` + `Tab`|useEffect Hook|
## Sviluppo di Vue.js
|Windows/Linux|macOS|Description|
|---------------|-------|-------------|
|`vue` + `Tab`|`vue` + `Tab`|Vue Component Template|
|`vdata` + `Tab`|`vdata` + `Tab`|Vue Data Function|
|`vmethod` + `Tab`|`vmethod` + `Tab`|Vue Method|
|`vcomputed` + `Tab`|`vcomputed` + `Tab`|Vue Computed Property|
|`vwatcher` + `Tab`|`vwatcher` + `Tab`|Vue Watcher|
## Node.js Sviluppo
|Windows/Linux|macOS|Description|
|---------------|-------|-------------|
|`Ctrl+Shift+F10`|`Ctrl+Shift+R`|Run Node.js File|
|`Alt+F12`|`Option+F12`|Terminal|
|`Ctrl+Shift+X`|`Cmd+Shift+X`|Run npm Script|
|`Ctrl+Alt+F12`|`Cmd+Option+F12`|Node.js Console|
## Testing
|Windows/Linux|macOS|Description|
|---------------|-------|-------------|
|`Ctrl+Shift+F10`|`Ctrl+Shift+R`|Run Test|
|`Ctrl+Shift+F9`|`Ctrl+Shift+D`|Debug Test|
|`Alt+Shift+F10`|`Option+Shift+R`|Run All Tests|
|`Ctrl+Alt+F6`|`Cmd+Option+F6`|Run Failed Tests|
## Controllo versione (Git)
|Windows/Linux|macOS|Description|
|---------------|-------|-------------|
|`Ctrl+K`|`Cmd+K`|Commit|
|`Ctrl+Shift+K`|`Cmd+Shift+K`|Push|
|`Ctrl+T`|`Cmd+T`|Update Project|
|`Alt+9`|`Cmd+9`|Version Control Tool Window|
|`Ctrl+Alt+Z`|`Cmd+Option+Z`|Rollback|
## Ricerca e Sostituisci
|Windows/Linux|macOS|Description|
|---------------|-------|-------------|
|`Ctrl+F`|`Cmd+F`|Find|
|`F3`|`Cmd+G`|Find Next|
|`Shift+F3`|`Cmd+Shift+G`|Find Previous|
|`Ctrl+R`|`Cmd+R`|Replace|
|`Ctrl+Shift+F`|`Cmd+Shift+F`|Find in Path|
|`Ctrl+Shift+R`|`Cmd+Shift+R`|Replace in Path|
## Strumento di Windows
|Windows/Linux|macOS|Description|
|---------------|-------|-------------|
|`Alt+1`|`Cmd+1`|Project Tool Window|
|`Alt+2`|`Cmd+2`|Favorites|
|`Alt+3`|`Cmd+3`|Find Tool Window|
|`Alt+4`|`Cmd+4`|Run Tool Window|
|`Alt+5`|`Cmd+5`|Debug Tool Window|
|`Alt+6`|`Cmd+6`|TODO Tool Window|
|`Alt+7`|`Cmd+7`|Structure Tool Window|
|`Alt+8`|`Cmd+8`|Services Tool Window|
|`Alt+9`|`Cmd+9`|Version Control|
|`Alt+0`|`Cmd+0`|Messages Tool Window|
## Migliori Pratiche
### Configurazione del progetto
1. **Configure Node.js**: File → Impostazioni → Lingue e Quadri → Node.js
2. **Abilita TypeScript**: File → Impostazioni → Lingue e Quadri → Tipologia
3. **Set Code Style**: File → Impostazioni → Editor → Code Style → JavaScript/TypeScript
### Sviluppo del reattore
1. **Install React Plugin**: File → Impostazioni → Plugins → React
2. **Configura JSX**: File → Impostazioni → Lingue & Frameworks → JavaScript → React JSX
3. **Enable ES6**: File → Impostazioni → Lingue e Quadri → JavaScript → ECMAScript 6+
### Consigli per il debug
1. ** Ricercatore Debugging** Utilizzo integrato Chrome DevTools integrazione
2. Node.js Debugging. Configure Node.js eseguire configurazioni
3. **Source Maps ** Abilitare il supporto della mappa di origine per il debug del codice traspiled
### Ottimizzazione delle prestazioni
1. **Exclude Folders**: Mark node_modules come escluso
2. **Power Save Mode**: Abilita per una migliore durata della batteria
3. **Memory Settings**: Aumentare la dimensione del mucchio per grandi progetti