Here React experience hits different!
See special commands list ans code actions list
(disabled by default) Enable with tsEssentialPlugins.patchOutline
Add JSX elements to outline. It also makes sticky scroll works with your tags!
Super recommended for react. Fragments are not rendered.
Also is not supported in the web.
90% work done in this extension highly improves completions experience!
(enabled by default)
Expands arrow callbacks with signature snippet with adding additional undo stack!
Example:
const callback = (arg) => {} callback -> callback(arg)(enabled by default) when react langs are in emmet.excludeLanguages
Emmet that is active only inside JSX tags!
You can force enable this by using Enable Strict Emmet in JSX command.
Why? Issues it fixes: query.
- cleanup input & textarea suggestions
- override
.snippet
Is not supported in the web for now.
(disabled by default)
Edits array suggestions that receive predicate in the following way:
const usersList = [] usersList.map // -> usersList.map((user) => )(enabled by default)
You can quickly disable this plugin functionality by setting this setting to false. Useful for debugging a problem for example.
Note: when you open TS/JS file in the web for the first time you currently need to switch editors to make everything work!
Web-only feature: import path resolution
(enabled by default)
Highlights and lifts non-function methods. Also applies for static class methods.
const bannedUsers = { admin: false, moderator: false, } bannedUsers[condition ? 'admin' : 'moderator'] = true // adds suggestions ^ ^ deranks admin suggestion(enabled by default)
By default removes Fix Missing Function Declaration codefix. Possibly to remove more via setting.
(enabled by default)
Removes Symbol, caller, prototype completions on function / classes.
(enabled by default)
Appends space to almost all keywords e.g. const , like WebStorm does.
(enabled by default)
Patches toString() insert function snippet on number types to remove tabStop.
(disabled by default) enable with tsEssentialPlugins.fixSuggestionsSorting
Try to restore original properties sorting in some places such as object destructure & dot property access.
(enabled by default)
Exclude already covered strings / enums from suggestions (TS repo issue).
(enabled by default with two settings)
Mark all TS code actions with 🔵, so you can be sure they're coming from TypeScript, and not some other extension.
// Adds types in default constraint: type A<T extends 'foo' | 'bar' = ''> = ...Use cases: search excluding comments, search & replace only within strings, find interested JSX attribute node
Note: Code action displayed only when object is fully explicitly selected
Example:
const obj = { key1: 'someValue', key2: getSuperUniqueKey() } // turns into const obj = { 'someValue': 'key1', [getSuperUniqueKey()]: 'key2' }const data = [ { // test key: 'bar', a: 0 }, { key: 'baz', // yes b: 1 } ]After selecting code action, you'll get asked for key to used (here you can use only key) and after applying:
const a = { 'bar': { a: 0 }, 'baz': { // yes b: 1 } }(note that for now refactoring removes properties with comments!)
Please look at extension settings, as this extension has much more features than described here!
