all
when i config my Webstorm9 settings like this ,it turns out that the sample code in the right aligns the equals sign properly
but when i formatting my javascript code in the editor it doesn't work,it still shows
and what i want is align the equals sign
anyone who can take a look?
-------EDIT------
maybe i misunderstand the checked option,but i copy the sample code to my editor then reformat it, oh,bad result..
In Webstorm 10,
Go to Settings> Editor> Code Style > JavaScript
Go to the "Other" tab and check "Align multiple 'var' statements and assignment" and click Ok.
Go to Code > Reformat code (Ctrl + Alt + L)
Voila!
In PHPStorm 2017 (and, I assume, by extension WebStorm) that behavior can be achieved by:
going to Settings > Editor > Code Style > JavaScript
Wrapping and Braces tab
scroll down to Variable declarations and set Align to When Grouped
Additionally, setting Variable declarations to Wrap always will result in this when reformatting:
Update: unchanged in version 2018 and in WebStorm/PHPStorm version 2019, the steps I described above still work the same.
Update for WebStorm 2017.3
Apparently, since version 2017.3, the Other tab has been removed from Code Style > JavaScript.
Now you have a couple of alignment options under the Wrapping and Braces tab (scroll down to the bottom):
It took me a while to figure this out, hope this helps
Update for Webstorm 2016.1
#Hudvoy still has the right answer for this. I've updated with a visual of where you need to look in Webstorm 2016.1
Take note that the exact phrasing of the option is
Align multiline variable declaration
(emphasis mine) and that the example code shows:
var myLink = {
....
},
local = true,
initial = -1;
This option only aligns the equal signs of multiline variable declarations, not a bunch of single line variable declarations in a row like in your code.
To have it automatically align them you would need to change your code to
a = 1,
bbbbb = 2,
thisisc = 3;
Note that you also have to add a var before it all, as WebStorm will assume a=1 to be a reference to a global variable, not a variable definition.
Also note that code formatting is not automatic. You have to select Code->Reformat Code... from the menu, or hit Ctrl + Alt + L to reformat your code.
I also found that Webstorm could perform code formatting on the Javascript within either a .html or .js file, but would not work within a .php file - in PHP files it only performs syntax highlighting.
Related
I am using #testing-library/vue and run the tests within a build step of Sublime Text. The error output uses prettyDom and isn't very legible in the output window:
Example Output in Build Results window:
TestingLibraryElementError: Unable to find a label with the text of: /val1/
[36m<div[39m
[33mclass[39m=[32m"Cell"[39m
[33mdata-v-1cdb88a0[39m=[32m""[39m
[33mstyle[39m=[32m"width: 40%;"[39m
[36m>[39m
[36m<div[39m
[33mclass[39m=[32m"Label"[39m
[33mdata-v-1cdb88a0[39m=[32m""[39m
[36m>[39m
[0mTest Cat #1[0m
[36m</div>[39m
[36m<div[39m
[33mattrs[39m=[32m"[object Object]"[39m
[33mdata-v-088d7313[39m=[32m""[39m
[33mdata-v-1cdb88a0[39m=[32m""[39m
[33mform[39m=[32m"[object Object]"[39m
[33mon[39m=[32m"[object Object]"[39m
[33mprops[39m=[32m"[object Object]"[39m
Is there a way to turn off the syntax highlighting with an environment variable like you can to extend the output length?
Syntax highlighting is handled by the editor displaying the text.
In Sublime Text you can effectively remove – turn off if you like – the syntax highlighting of the current file / buffer by changing the syntax to Plain Text.
You can do that by choosing Plain Text after clicking on the active syntax name on the right of the Status Bar or from the View --> Syntax menu, or by opening the Command Palette and selecting the Set Syntax: Plain Text command.
prettyDOM takes the same options as pretty-format. One of those options is "highlight". In pretty-format it seems to be false by default, but in prettyDOM I found it's true by default. You can disable it like this:
prettyDOM(myDom, undefined, {highlight: false})
The apparent answer is to get Sublime Text to display the colors in the build window by using the ANSIescape plugin:
https://forum.sublimetext.com/t/ansi-color-codes-in-build-output/11296/16
https://packagecontrol.io/packages/ANSIescape
You can set the COLORS environment variable to false to turn off colourisation. See https://testing-library.com/docs/dom-testing-library/api-debugging/
Although your question relates to the build results window in Sublime, this is a common problem in other places where the colour codes make it hard to see the actual debug output (in my case a Jenkins console output when tests fail).
Starting off using brackets as a text editor to write javascript code, kindly note I'm a beginner, and I'm getting weird errors when I write my code like unexpected console statement when I use console.log() or name is not defined if I declare a variable called name. How can I disable that feature or edit its code to fix these messages.
Edit:
What i wrote:
var name = "john";
var age = 26;
console.log(age)
var job,ismarried;
ismarried = true;
I'm getting xs sign near my lines although the age is showing in chrome normally so the issue isn't with that very simple code it's with the text editor and I don't understand how to fix it.
My instructor's answer:
These errors are probably related to JSLint and/or ESLint. These are tools used in Brackets to scan your code for bugs.You can also disable JSLint. To do that: Go to Brackets > File > Extension Manager > Default > Disable ESLint and JSLint.
for error like "unexpected console statement [no-console]" in brackets
Click on "Debug" in on your toolbar.
In the dropdown, click on "Open Preferences File".
and add below line in the brackets.json file
"language": {
"javascript": {
"linting.prefer": ["JSHint"],
"linting.usePreferredOnly": true
}
}
link for the same :
https://the-sourceterous.ghost.io/brackets-editor-disable-jslint-and-use-jshint-instead-2/
I have a validated json file that will display without any quotes in Vim. The only time it displays the json file correctly is under Visual mode.
I have tried disabling eslint, jshint, youcompleteme
OS X
MacVim 7.4
Vim 7.4 in Terminal
The built-in $VIMRUNTIME/syntax/json.vim uses Vim's conceal feature to hide the quotes, presumably to remove unnecessary clutter.
You must have enabled concealing by setting the 'conceallevel' option to 2 or 3; the default is 0 (off). Likewise, you see the quotes in visual mode because of your 'concealcursor' setting.
Inside a JSON file, check where the conceal options got set:
:verbose set conceallevel? concealcursor?
Then, you can adapt your settings to suit your preferences.
Adding to the currently accepted answer, you can disable that behavior specifically for JSON by setting the following option in you .vimrc:
" Disable quote concealing in JSON files
let g:vim_json_conceal=0
That way, you don't have to set conceallevel to 0 (disabled), which would also make useful plugins like indentLine (which was mentioned in a comment above) not work anymore.
Like already mentioned, one can check which plugin caused the increased conceal level:
:verbose set conceallevel?
If the conceal level is caused by the vim-json Plugin:
let g:vim_json_syntax_conceal = 0
If conceal is caused by the indentLine Plugin:
let g:indentLine_setConceal = 0
In vimrc, You can add both options for json files:
autocmd Filetype json
\ let g:indentLine_setConceal = 0 |
\ let g:vim_json_syntax_conceal = 0
I find this annoying because the lines 'jump' as quotes are hidden and unhidden.
Setting conceallevel=1 replaces the " with space (rather than hiding them) which stops the jumping while still making json more readable.
I am sure there is something simple that I am missing but I am stumped here.
The issue is that I am looping through an array of strings and using the string value to search for a part of that string using indexOf. The first time around the loop the index of is finding what I am looking for but the second time it is not.
Here is a fiddle - http://jsfiddle.net/jeremywrags/uSwjG/1/
the line that seems to be not working is this
var aliasIndex = fromclause.indexOf(" " + tableAlias + " " );
I am trying to build a SQL parser for a cloud app and the use case here is that when a table is aliased I need to get the original table name so that I can look up the table columns. The first time around the loop index of returns the index and then the table name. The second time around the index of is -1 and the table name is not retrieved.
If I need to provide more context please let me know.
thanks
It's not matching because on the second pass, tableAlias is the string " b" (note the space). So then you search for " b " (note two leading spaces), which isn't there.
Rather than using alert, use the debugger built into your browser. You can set breakpoints in the code, step through line by line, inspect variables, etc., etc. Doing that with this would have shown you, when looking at the variable tableAlias, that it had a leading space, hopefully helping you find the solution.
Here's what that looks like in Chrome's debugger, for instance:
(If you look at the jsFiddle source above the actual debugger's version, you'll see a debugger; statement in the code — normally you don't need that statement, you can just open your page, use the "Sources" tab to find your JavaScript file, navigate to the line, and click the margin to the left of it to set a breakpoint. But sometimes [for instance, when using jsFiddle], the debugger; statement is handy. What it does is, if the debugger is open, halts execution of the code at that point like a breakpoint does.)
I don't need anything super fancy, but some scope aware refactoring would be nice.
Refactoring something in function scope is one of the most common scenarios for me:
var funyfun = function(arg1, arg2) {
arg1 = ...arg2;
arg2....();
}
Is there a vim plugin that would allow me to refactor arg1, for ex, in the scope of that function or do I have to invent my own "select block, find, replace" shortcut.
For extra kudos, something that would "refactor on the fly" as I type, so I can see where changes are being made. Netbeans does an excellent job of this.
This is not limited to a certain block, but this how I would do it with plain Vim:
Move cursor on top of arg1 and type *N
Type ciw and insert replacement.
Now you can use n and N to navigate the occurrences and by pressing . Vim will redo the replacement on the current match
Here's a shortcut for it:
" Simple word refactoring shortcut. Hit <Leader>r<new word> on a word to
" refactor it. Navigate to more matches with `n` and `N` and redo refactoring
" by hitting the dot key.
map <Leader>r *Nciw
Sound a bit like you only want renaming instead of refactoring. Full refactoring is tricky for Javascript, though some IDEs provide approximations. Since the question is about Vim specifically, and hacks aren't excluded, I'll just jump on the scope-aware aspect:
I've got a modified DoctorJS to generate scope-aware tags, with a Vim plugin for scope-aware navigation based on those tags (see blog post/screencast).
The hacky part comes in how navigation is implemented for Vim: I generate a search pattern that includes the scope of the variable and excludes all nested scopes for the same name. So, you could use that search pattern (function scoped_tags#FindTagInScope) to implement renaming (only if all uses are in the same file, and it doesn't exclude comments and the like..). Or you could use the scoped navigation to jump through variable occurrences manually and use '.' to rename them..
A few JavaScript-aware commands for Vim are provided by tern_for_vim, such as :TernRename for scope-aware renaming of variables, :TernDef for jumping to the definition of the thing under the cursor, and so on. You will need to have nodejs and npm installed, make sure to read the installation instructions in the repo.
As a partial solution you can use Eclim with JSDT, which allows you to use power of Eclipse refactoring/debugging/auto-completion/plugins with Vim.
In my experience, it may be a bit slow on older machines, but it's worth giving it a try.
In addition to doing actual scope-aware refactoring and the like, consider :%s/varName/newNav/gc. Per :help :s_c, the c flag passed to :s enters a quick confirmation mode for find/replace operations that prompts you (y/n) on whether each match should be replaced or not.
you can do:
:.,/^}/ s/\<arg1\>/new_name/g
the .,/^}/ is a range that many Ex commands accept: from cursor line to next line starting with a closing brace.
Benoit and Epeli has some good points, however, I find it a bit tedious to write .,/^}/ before my substitute statement, and since it only modifies code from the cursor position to the next line starting with a }, it depends on having the cursor position at the beginning of the function or block (and it will not work for an entire function with an if statement).
So instead I use visual mode in combination with textobjects. For instance, typing vi{ will select all the code inside the closest matching pair of {}, va{ will include the {} characters, and if you do this with visual line (vi{V), you'll get the entire function declaration as well. Then you can just do a :s/\<arg1\>/new_name/g to rename arg1 to new_name, including function parameters.