I was wondering if someone had the sequence of steps to accomplish this task, inline, without copy and pasting.
Imagine you have a block of code where things are not cleanly justified
{
foo: "foo value",
bar: "bar value",
reallylongvariable: "reallylongvariable value",
shortname: "shortname value"
}
is there a very quick way to transform it in this, justifying the spaces and ragged spacing to a unified formatting
{
foo: "foo value",
bar: "bar value",
reallylongvariable: "reallylongvariable value",
shortname: "shortname value"
}
I know about option selection. Generally, I follow these steps
option select a column,
paste it on a new set of lines,
reselect pasted content
use command + [ to remove indention,
option reselect column of unindented content
past back in place in the original column.
But this process feels very manual, and was wonder if there was way to clean up the indentation inline, without copy and paste. Perhaps a helper utility that can do this automatically within a highlighted selection.
Hopefully my question makes sense.
There are multiple plugins for this task, for example:
https://github.com/wbond/sublime_alignment
https://github.com/randy3k/AlignTab
Here you can search for all of them: https://sublime.wbond.net/search/align
I personally recommend the AlignTab. It may seem complex, but if you know how to use regular expressions it is the most powerful you will find. It may do some crazy magic if you get used to it.
Related
i have a bunch of strings in code such as:
<td style="background-color:#fdfdff"> </td>
and
<td> </td>
in one file.
The goal is to replace from first example with 0, while from second example with - (dash)
I'm using VScode regex, but I can't find the way to replace captured groups with specific values, as $1, $2 groups refer to original string groups.
This one is just example, how I'm trying to achieve this, but VScode don't ignore grouped regex.
An alternative process is to use a snippet which can do conditional replacements. With this snippet:
"replaceTDs": {
"prefix": "tdr", // whatever prefix you want
"body": [
"${TM_SELECTED_TEXT/(?<=\">)( )|( )/${1:+0}${2:+-}/g}",
]
}
The conditional replacements can be quite simple since you first find and select only the two alternative texts you are interested in. So
find: <td\s*(style="[^"]*"\s*)> </td>|<td> </td> old version
This simpler find will probably work for you:
<td\s*(style="[^"]*")?\s*> </td>
Don't replace, rather Control+Shift+L : selects all your two alternatives. Esc to focus on editor from the find widget.
Then apply your snippet, in this case type tdr+Tab
and all the changes are made. You just have to make the snippet one time and then do a single find.
This technique scales a little better than running as many find/replaces as you have replacements to do. Even with more conditional replacements it would probably be a simple change to the one snippet to add more replacements.
Also you can simplify this even more if you use a keybinding to trigger your snippet (you don't have to change focus from the find widget - or create the separate snippet). So with no snippet, but this keybinding:
{
"key": "alt+w",
"command": "editor.action.insertSnippet",
"args": {
"snippet": "${TM_SELECTED_TEXT/(?<=\">)( )|( )/${1:+0}${2:+-}/g}"
},
"when": "editorHasSelection"
}
now the same demo:
You can use
Search for (?<=<td\s+style="[^"]*">) (?=</td>) and replace with 0, and
Search for <td> </td> and replace with <td>-</td>, no need for a regex here.
Note that capturing groups are meant to keep captured substrings.
The first pattern matches
(?<=<td\s+style="[^"]*">) - a place in string that is immediately preceded with <td, one or more whitespaces, style=", any zero or more chars other than " and then a >
- a literal string
(?=</td>) - immediately to the right, there must be </td>.
I use prettier in my VSC, so how to force prettier HTML formatting to format tags in one line, not multiple lines?
I want to format something like this all in one line
<v-navigation-drawer :clipped="$vuetify.breakpoint.lgAndUp" v-model="drawer" fixed app>
Does exist any config for prettier HTML formatter?
Prettier has the option printWidth. If you set that option to a high number, it will break fewer lines.
In your .prettierrc.json file, you can override this option for your HTML files:
{
// Other options...
"overrides": [
{
// change .html with .vue if you are using Vue files instead of HTML
"files": "src/**/*.html",
"options": {
"printWidth": 140
}
}
]
}
Is not recommendable to use a line-lenght higher than 140. Prettier is opitionated, so it should be used without too many customizations.
First check if you have a filename .prettierrc in the root. If no, create it and then put these values in it.
{
"trailingComma": "es5",
"tabWidth": 2,
"useTabs": false,
"singleQuote": true,
"printWidth": 3000,
"bracketSpacing": true
}
Set printWidth to something large value and toggle wrapping text with your editor whenever you want; for example, in VS Code: Alt+Z.
I know this topic is old but maybe others still have this issue. In the Prettier setting you can adjust the width of the Print Width. 120 width does the job for me.
It depends on your IDE settings but as documentation states, you should have a config file where you should look for the html.format.wrapLineLength property and apply the line length value which satisfy you. This will prevent Prettier to break your lines until assigned line length to the property is reached. This will only apply for HTML.
For overall purposes you should use prettier.printWidth property which
Fit code within this line limit
Mind that tabulation / indention spaces also count in the line length.
Unfortunately when code line exceed the above numbers it will be spited to multi-lines, each property per line. So far I did not find solution to just wrap to extra line, without spiting to multi.
UPDATE
Mentioned and desired by me behavior it is not affordable with Prettier, but the line length trick still can do the job ... partially.
I have autoindent and smartindent in vim turned on, but nocindent turned off. I'm trying to indent some JSON text without pretty-printing the whole thing, which would be too intrusive:
{
"a" : "value1",
"b": "value2",
"c": "value3",
...
Gets formatted by gg=G as:
{
"a" : "value1",
"b": "value2",
"c": "value3",
...
What's the logic going on there, and what options can I set to fix it, if it's possible? I tried toggling options like autoindent, smartindent, and cindent (with their "no" counterparts), but it doesn't have an effect on the = command. My latest attempt had these options:
autoindent
smartindent
nocindent
cinoptions=
indentexpr=
indentkeys=0{,0},:,0#,!^F,o,O,e
I can explain the logic, but I'm not sure of an easy fix. Vim's internal indenter is following C-style syntax, so since the "a" : "value1", line doesn't end with a ; it assumes that the following lines are a continuation of that statement and they should be indented to show that.
:help C-indenting goes into great depth discussing the various indent options and how they interact. I skimmed it and nothing jumped out at me, but it's worth a read.
If you have an external formatter that better recognizes the structure of your code, you can always set equalprg to run that instead of using the internal formatter.
Edit: On second thought, set cinoptions+=+0 will disable indenting for line continuation. This will also affect regular code, but it might be a reasonable tradeoff depending which annoys you more. You can also set it per filetype if you're editing standalone .json files.
The built-in indent settings won't totally cover a complex, non-C language like JSON. Better use a tailored indent setting, like the indent/json.vim indent plugin that is part of vim-json.
I like to keep my lines below 80 columns, so I often want to refactor a line that looks like this:
object.function(a_long_argument, another_long_argument, and_a_third)
to this:
object.function(a_long_argument,
another_long_argument,
and_a_third)
But when I press Enter after the first "," in Sublime it just linebreaks and indents the cursor a few spaces. I want it to align to the paranthesis or [] or {} that I am in, like Emacs does so beautifully.
Is there an option for this? Is there a plugin for this? Do I have to write my own?
I have tried searching for it, but I have not found anything.
EDIT:
Even better would be a shortcut or plugin or something for selecting a few rows, or the entire buffer, and let it try to auto-linebreak at good spots. Refactor comments too. If it has to be language specific, I want it primarily for Python and C++.
Sublime's indent_to_bracket will wrap the cursor for you. Just add the following line to either your User/Preferences.sublime-settings or User/Python.sublime-settings file:
"indent_to_bracket": true
Unfortunately this currently only seems to work with parentheses, curly braces and square brackets still wrap to the previous line indent.
I have been looking for a way to capture structured text (sections, paragraphs, emphasis, lists, etc.) in JSON, but I haven't found anything yet. Any suggestions? (Markdown crossed my mind, but there might be something better out there.)
How about something like this:
[ { "heading": "Foobar Example" },
{ "paragraph":
[
"This is normal text, followed by... ",
{ "bold": "some bold text" },
"etc."
]
}
]
That is:
use a string for plain text without formatting or other mark-up;
use an array whenever you want to indicate an ordered sequence of certain text elements;
use an object where the key indicates the mark-up and the value the text element to which the formatting is applied.
HTML is a well-established way to describe structured text, in a plain-text format(!). Markdown (as you mentioned) would work as well.
My view is that your best bet is probably going to be using some sort of plain-text markup such as those choices, and place your text in a single JSON string variable. Depending on your application, it may make sense to have an array of sections, containing an array of paragraphs, containing an array of normal/bold/list sections etc. However, in the general case I think good old-fashioned blocks are markup will ironically be cleaner and more scalable, due to the ease of passing them around, and the well-developed libraries for full-blown parsing if/when required.
There also seems to be a specification that might accomplish this Markdown Syntax for Object Notation (MSON)
Not sure if for you it's worth the trouble of implementing the spec, but it seems to be an option.