How to do find and navigate in webstorm? - webstorm

What is the shortcut key for find and navigate in Webstorm IDE? I found it getting used in this video (http://youtu.be/IfUyUeYHffk?t=51s).

It's a custom plugin: AceJump
http://plugins.intellij.net/plugin?pr=webide&pluginId=7086
Install from Settings | Plugins

There is another implementation:
http://plugins.jetbrains.com/plugin/?idea_ce&pluginId=7163

Related

Set up config for prettier.js JetBrains

I use WebStorm latest version and I don't like to use double quotes:D
The question is how do I set up my own config for the prettier.js embedded in the JetBrains product? (Ctrl+Alt+L)
WebStorm doesn't embed any prettier configs. You have to create your own prettier configuration file in your project folder (or add "prettier" key to your package.json) and add the desired rules there, like
{
"singleQuote": true
}

How to make WebStorm format code according to eslint?

I've specified eslint configuration for my WebStorm project. But it does not seem to apply to code reformat feature. For example, it continues to format import { something } from 'somewhere' as import {something} from 'somewhere'.
Is there a way to make WebStorm to format code according to eslint configuration?
(Described steps and screenshots are from IntelliJ IDEA 2017.2)
You can add a keyboard shortcut to action 'Fix ESLint Problem'. Ensure plugin 'JavaScript Support' is installed and enabled.
First got to Preferences | Language & Frameworks | JavaScript | Code Quality Tools | ESLint and enable it. You will need to define your 'Node interpreter', 'ESlint package' and optional 'Configuration file'.
Next go to Preferences | Keymap and search there for 'eslint'. Now you can add for example the shortcut 'control + shift + L'.
If you are using a newer version of WebStorm like me, you can import the ESLint rules into WebStorm by right-clicking on the .eslintrc.js (or other ESLint configuration files) and then click the "Apply ESLint Code Style Rules" option as shown here.
Do note as the time of writing, you will also need to exclude the indentation of <script> tags in the "Settings" or "Preference" Menu. An awesome guy wrote a short write-up on how to do that.
I have just installed WebStorm 2017 and I do not know if this works for WS 2016. Instead of pressing Option + Command + L, to reformat your code, you could press Option + Enter when your cursor is close to an ESLint error. This will open up the context menu, then select the "ESLint: Fix current file"
Solved for me in 2021 :
WebStorm is using Prettier package and there is an option:
Preferences | Languages & Frameworks | JavaScript | Prettier -> On 'Reformat Code' action
Now WebStorm uses eslint rules to reformat the code on Reformat Code hotkey.
Update: the answer is obsolete. The best solution is described in https://stackoverflow.com/a/46099408/1057218
Unfortunately you cannot import eslint code style configuration (WEB-19350) but you can configure the code style manually.
See the settings: "File | Settings | Editor | Code Style | JavaScript"
For import braces:
"Spaces" -> "ES6 import / export braces"
A temporary fix for now that I've been using is to export my ESLint config to JSCS. It works pretty nicely with WebStorm and PHPStorm!
I used this package called Polyjuice, and here is the output from my eslint config.
The best way is to automate it by using a Macro.
1. Go to Edit | Macro | Start Macro Recording
2. Go to File | Save All
3. Press Strg + Shift + A
4. Search for eslint and run it.
5. Go to Edit | Macro | Stop Macro Recording
6. Go to Edit | Macro | Edit Macros and remove everything expect the two Action:...
7. Go to File | Settings | Keymap | Macros and add Strg + S on the Macro
This works great and makes it a lot more easier to work :)
For those still in trouble, I did all the steps of the answers above and it was not working at all.
For me the problem was the Node version I was using in my terminal (12.x) vs the .nvmrc and "engine" in the package.json of the project
After the two changes pointed above my eslint returned to work.
p.s: I'm assuming you have all the dependencies installed as well as a .eslintrc.* in the root of your project

How to import code formatting settings from tslint.json in webstorm?

Is it possible to import formatting settings (Settings => Editor => Code Style => Typescript) from my tslint.json file in webstorm? I use rules directory "node_modules/codelyzer" in my tslint.json file
Since 2017 WebStorm version, it's possible to Apply code style.
Just open tslint.json and WebStorm will ask if it can import it.
Read it about it in WebStorm 2017.1 EAP, 171.2455: improved integration with TSLint
It's not possible at the moment. You can vote for and follow the updates on this feature request: https://youtrack.jetbrains.com/issue/WEB-19481
As of 2018, you can manually apply TsLint settings:
Find your tslint.json file in the Editor or File tree (can also be a tslint.yaml)
Right click the file (again, this can be the Editor pane or the file in the tree)
Select Apply TSLint Code Style Rules. (should be the last option)
The Event Log should be updated with:
TSLint: The project code style and editor settings were updated based on 'tslint.json'.
More from JetBrains (with pictures):
WebStorm Help | Importing code style from a TSLint configuration file

Custom autoformat in Xcode [duplicate]

As a C# developer, I have become highly dependent on the automatic formatting in Visual Studio 2008. Specifically, I will use the CTRL + K , D keyboard shortcut to force things back into shape after my sloppy implementation.
I am now trying to learn Objective-C and am missing certain features in Xcode, but probably none are quite as painful as the formatting shortcut. My Google searches have yielded nothing built in, though it seems there are some hacks. Am I missing something or does this feature not exist natively in Xcode?
That's Ctrl + i.
Or for low-tech, cut and then paste. It'll reformat on paste.
Unfortunately, Xcode doesn't have anything nearly as extensive as VS or Jalopy for Eclipse available. There are SOME disparate features, such as Structure > Re-Indent as well as the auto-formatting used when you paste code into your source file. I am totally with you, though; there definitely should be something in there to help with formatting issues.
I'd like to recommend two options worth considering. Both quite new and evolving.
ClangFormat-Xcode (free) - on each cmd+s file is reformatted to specific style and saved, easy to deploy within team
An Xcode plug-in to format your code using Clang's format tools, by
#travisjeffery.
With clang-format you can use Clang to format your code to styles such
as LLVM, Google, Chromium, Mozilla, WebKit, or your own configuration.
Objective-Clean (paid, didn't try it yet) - app raising build errors if predefined style rules are violated - possibly quite hard to use within the team, so I didn't try it out.
With very minimal setup, you can get Xcode to use our App to enforce
your rules. If you are ever caught violating one of your rules, Xcode
will throw a build error and take you right to the offending line.
In xcode, you can use this shortcut to Re-indent your source code
Go to file, which has indent issues, and follow this :
Cmd + A to select all source codes
Ctrl + I to re-indent
Hope this helps.
My personal fav PrettyC wantabe is uncrustify: http://uncrustify.sourceforge.net/. It's got a few billion options however so I also suggest you download UniversalIndentGUI_macx, (also on sourceforge) a GUI someone wrote to help set the options the way you like them.
You can then add this custom user script to uncrustify the selected text:
#! /bin/sh
#
# uncrustify!
echo -n "%%%{PBXSelection}%%%"
/usr/local/bin/uncrustify -q -c /usr/local/share/uncrustify/geo_uncrustify.cfg -l oc+ <&0
echo -n "%%%{PBXSelection}%%%"
You can use Command + A to select all content and next Ctrl + I to format the selected content.
I also feel xcode should have this function.
So I made an extension to do it: Swimat
Simple install by brew cask install swimat
You can give it a try, see https://github.com/Jintin/Swimat for more information.
Cmd A + Ctrl I
Or Cmd A And then Right Click. Goto Structure -> Re-Indent
Consider buying yourself a license for AppCode, an intelligent Objective-C IDE that helps iOS/OS X developers. AppCode is fully compatible with Xcode, but goes beyond Xcode in adding powerful features.
AppCode an Objective-C variant of the Intellij IDEA IDE from JetBrains. They are also authors of popular ReSharper extension to Visual Studio, which main purpose from here seems like a desperate attempt to bring a touch of IDEA experience to a Microsoft product.
AppCode is using its own code analyser which gives close-to-perfect refactoring and code navigation support. There is an ability to re-indent and completely reformat code also (although I still keep missing a couple of formatting settings in hard cases, but mostly it works well).
You might try the trial version, of course.
Swift - https://github.com/nicklockwood/SwiftFormat
It provides Xcode Extension as well as CLI option.
CTRL + i
that's it.
(no COMMAND + i)
You can also have a look at https://github.com/octo-online/Xcode-formatter which is a formatter based on Uncrustify and integrated into Xcode. Works like a charm.
You could try that XCode plugin https://github.com/benoitsan/BBUncrustifyPlugin-Xcode
Just clone github repository, open plugin project in XCode and run it. It will be installed automatically. Restart Xode before using formatter plugin.
Don't forget to install uncrustify util before. Homebrew, for exmaple
brew install uncrustify
P.S. You can turn on "after save formatting" feature at Edit > Format Code > BBUncrustifyPlugin Preferences > Format On Save
Hope this will be useful for u ;-)
I suggest using ClangFormat. In order to install, please follow these steps:
Install Alcatraz package manager for XCode
Supports Xcode 5+ & OS X 10.9+
After installation restart XCode.
Open XCode -> Window Menu -> Package Manager
Search (find) ClangFormat and install it. After installation again restart XCode.
Now at XCode menu you can use Edit -> Clang Format submenu for formatting.
You can choose different types of formatting. Also by enabling Format On Save you can gain auto-format capability.
If your Xcode version 3.x , you should use "User Script" With Uncrustify , here this a Example:
#!/bin/sh
echo -n "%%%{PBXSelection}%%%"
$YOURPATH_TO_UNCRUSTIFY/uncrustify -q -c $YOURPATH_TO_UNCRUSTIFY_CONFIG/CodeFormatConfig.cfg -l OC+
echo -n "%%%{PBXSelection}%%%"
add above to your Xcode "User Script".
if Xcode version 4.x , I think you should read this blog : Code Formatting in Xcode 4,
In this way , used the "Apple Services" , but it's not good enough , cause too slow experience, does anyone has the same thing ?
why apple drop "user script" .... xD
First, Examine XCode Preferences "Indentation" section. You can customize things quite a bit there...
For more fine grained control, refer to the XCode User Defaults document from apple. (May require a developer login to view). For example, I was able to disable the "indent on paste" by entering the following in terminal:
defaults write com.apple.XCODE PBXIndentOnPaste No
to read back your setting:
defaults read com.apple.XCODE PBXIndentOnPaste
This only works for languages with are not whitespace delineated, but my solution is to remove all whitespace except for spaces, then add a newline after characters that usually delineate EOL (e.g. replace ';' with ';\n') then do the ubiquitous ^+i solution.
I use Python.
Example code, just replace the filenames:
python -c "import re; open(outfile,'w').write(re.sub('[\t\n\r]','',open(infile).read()).replace(';',';\n').replace('{','{\n').replace('}','}\n'))"
It 's not perfect (Example: for loops), but I like it.
We can use Xcode Formatter which uses uncrustify to easily format your source code as your team exactly wants to be!.
Installation
The recommended way is to clone GitHub project or download it from https://github.com/octo-online/Xcode-formatter and add the CodeFormatter directory in your Xcode project to get :
Xcode shortcut-based code formatting: a shortcut to format modified sources in the current workspace
automatic code formatting: add a build phase to your project to format current sources when application builds
all sources formatting: format all your code with one command line
your formatting rules shared by project: edit and use a same configuration file with your project dev team
1) How to setup the code formatter for your project
Install uncrustify
The simplest way is to use brew:
$ brew install uncrustify
To install brew:
$ ruby –e “$(curl –fsSkl raw.github.com/mxcl/homebrew/go)”
Check that uncrustify is located in /usr/local/bin
$ which uncrustify
If your uncrustify version is lower than 0.60, you might have to install it manually since modern Objective-C syntax has been added recently.
Add CodeFormatter directory beside your .xcodeproj file
Check that your Xcode application is named "Xcode" (default name)
You can see this name in the Applications/ directory (or your custom Xcode installation directory). Be carefull if you have multiple instances of Xcode on your mac: ensure that project's one is actually named "Xcode"!
(Why this ? This name is used to find currently opened Xcode files. See CodeFormatter/Uncrustify_opened_Xcode_sources.workflow appleScript).
Install the automator service Uncrustify_opened_Xcode_sources.workflow
Copy this file to your ~/Library/Services/ folder (create this folder if needed).Be careful : by double-clicking the .workflow file, you will install it but the file will be removed! Be sure to leave a copy of it for other users.
How to format opened files when building the project
Add a build phase "run script" containing the following line:
sh CodeFormatter/scripts/formatOpendSources.sh
How to format files in command line
To format currently opened files, use formatOpenedSources.sh:
$sh CodeFormatter/scripts/formatOpendSources.sh
To format all files, use formatAllSources.sh:
$sh CodeFormatter/scripts/formatAllSources.sh PATH
PATH must be replaced by your sources path.
E:g; if project name is TestApp then the command will be
$sh CodeFormatter/scripts/formatAllSources.sh TestApp
it will look for all files in the project and will format all the files as configured in uncrustify_objective_c.cfg file.
How to change formatter’s rules
Edit CodeFormatter/uncrustify_objective_c.cfg open with TextEdit
Well I was searching for an easy way. And find out on medium.
First to copy the json text and validate it on jsonlint or something similar. Then to copy from jsonlint, already the json is formatted. And paste the code on Xcode with preserving the format, shortcut shift + option + command + v

Color shemes in webstorm 7 - how to install?

How to install color scheme in webstorm 7 on windows?
There are no any folder named webide10 in my user's folder.
Theme that I want to install is here https://github.com/negativefix/zenburn
Select «File» → «Import Setting» from the main menu and follow the instructions.
After the IDE restarted go to the Preferences, expand «Editor» → «Colors and fonts» tab and choose the installed theme.
For WEbStorm7 the Zenburn.xml has to be placed into ~.WebStorm7\config\colors\ folder (where ~ is your home folder, like 'C:\Users\my.name\.WebStorm7\config\colors\Zenburn.xml'