In Sublime 2, I know how to reindent the whole document and how to assign a key to this function, but I want to reindent as is do in WebStorm where spaces are added before and after a (=) or after and before a (:). Watch the image for the examples. How could I do that in Sublime or what package do this?
Use:
HTML-CSS-JS Prettify
You can adjust the following settings #:
Menu > Preferences > Package Settings > HTML/CSS/JS Prettify > Set Prettify Preferences
"js": {
"allowed_file_extensions": ["js", "json", "jshintrc", "jsbeautifyrc"],
"brace_style": "collapse-preserve-inline",
// collapse: (old default) Put braces on the same line as control statements
// collapse-preserve-inline: (new default) Same as collapse but better support for ES6 destructuring and other features. https: //github.com/victorporof/Sublime-HTMLPrettify/issues/231
// expand: Put braces on own line (Allman / ANSI style)
// end-expand: Put end braces on own line
// none: Keep them where they are
"break_chained_methods": false, // Break chained method calls across subsequent lines
"e4x": false, // Pass E4X xml literals through untouched
"end_with_newline": false, // End output with newline
"indent_char": " ", // Indentation character
"indent_level": 0, // Initial indentation level
"indent_size": 2, // Indentation size
"indent_with_tabs": true, // Indent with tabs, overrides `indent_size` and `indent_char`
"jslint_happy": false, // If true, then jslint-stricter mode is enforced
"keep_array_indentation": false, // Preserve array indentation
"keep_function_indentation": false, // Preserve function indentation
"max_preserve_newlines": 0, // Maximum number of line breaks to be preserved in one chunk (0 disables)
"preserve_newlines": true, // Whether existing line breaks should be preserved
"space_after_anon_function": false, // Should the space before an anonymous function's parens be added, "function()" vs "function ()"
"space_before_conditional": true, // Should the space before conditional statement be added, "if(true)" vs "if (true)"
"space_in_empty_paren": false, // Add padding spaces within empty paren, "f()" vs "f( )"
"space_in_paren": false, // Add padding spaces within paren, ie. f( a, b )
"unescape_strings": false, // Should printable characters in strings encoded in \xNN notation be unescaped, "example" vs "\x65\x78\x61\x6d\x70\x6c\x65"
"wrap_line_length": 0 // Lines should wrap at next opportunity after this number of characters (0 disables)
}
Note:
It does not handle commas within quotes.
I also tested CoolFormat, which does not handle them either.
You should check out Will Bond's Alignment plugin, it should do most of what you want, and is pretty configurable as well. There seems to be an issue with the documentation and circular links between packagecontrol.io and wbond.net, but here is the documentation stored in the Wayback Machine.
Related
When I use Reformat File in IntelliJ Idea, IDE adds additional space in function argument to align it in one line with function.
I can't find option in Code Style to disable in on change configuration.
Code:
export const getApplicationFormInstance = ({
consents,
dealer_code,
source,
rent_subscription,
comment = null,
...baseOptions
}: IApplicationFormOptions): FormInstanceType<IApplicationModel> => {
return false;
}
Screenshot of Error from ESLint:
I try to find way to fix it in IDE, not in ESLint like:
"#typescript-eslint/indent": "off"
Select the code you want to format differently.
Type Alt+Enter and invoke Adjust code style settings
Under the Wrapping and Braces tab uncheck the Align when multiline checkbox
That should get you the formatter behaviour you want.
My VSCode onSave
... turns my Vuejs codes vertically somehow to so many lines.
I know that it is easier to read, but I also find it very long to read, and it makes my file too long and I had to scroll down for no reason.
Is this sth that caused by Prettier?
Can someone pls show me how to prevent it from happening?
settings.json
"[vue]": {
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true,
},
Prettier formats lines to fit within the character limit of printWidth (default is 80 characters).
Set printWidth to a high value to avoid this line wrapping:
// .prettierrc
{
"printWidth": 300
}
Yes Prettier format the code like this because it's easier to read it. If you want to disable this, just change to false the editor.formatOnSave
When a snippet (for whatever language) is triggered, and the cursor is moved to a tab-stop, the area is "selected" (that is, you are still in "snippet mode" where you can go to another tab-stop). But I would like to get out of this "snippet mode" (e.g not having the area selected after tab-stop), because it suppresses intellisense (the selected area after snippet was triggered accepts anything, so it does no longer suggest intellisense function, variables, etc. Is there a settings in vscode to disable this "selection" after snippet is triggered?
If you have only one tabstop you can use $0 to avoid the "selecttion".
But if you have more than one i don't think it's possible.
I don't believe that's possible.
Snippets often have placeholders such as ${1:name} to indicate what's expected in that tab stop.
Take this one for example:
"JS arrow function": {
"prefix": "af",
"body": [
"const ${1:name} = (${2:props}) => {",
"\t$3",
"}"
],
"description": "Create arrow function"
}
Using tab will cycle over $1, $2 and $3, and for $1 and $2 there is a placeholder.
You can omit the placeholders if you want:
"JS arrow function2": {
"prefix": "af2",
"body": [
"const $1 = ($2) => {",
"\t$3",
"}"
],
"description": "Create arrow function"
}
But instellisense won't work until you press escape.
You can add your own snippets globally or per language if you prefer to customise them and avoid placeholders.
See this link for more information.
I want to make a relatively simple formatter in VS Code. Essentially, I have a bunch of *.md.j2 files (Jinja2 templates that ultimately become Markdown). I have the Better Jinja extension to render these, with the language jinja-md in VS Code.
I started off just wanting to use prettier's Markdown formatting and call it a day. I tried adding this to settings.json:
"[jinja-md]": {
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true,
},
This does not work because esbenp.prettier-vscode does not register itself for the jinja-md type; it seems to have no "break glass" option to configure that.
This got me to thinking that it would be nice to make a formatter that ignored Jinja tag lines (e.g. {% if foo == 'bar' %}\n and then passed on the fragments to whatever the underlying file type formatter was. So basically I want to do something like:
vscode.languages.registerDocumentFormattingEditProvider('jinja-md', {
provideDocumentFormattingEdits(document: vscode.TextDocument): vscode.TextEdit[] {
// THIS IS THE QUESTION:
// vscode.languages.getFormatter is not a real method. I want to know
// how to pull off this concept.
mdFormatter = vscode.languages.getFormatter('md');
// Get segments between %}\n and \n{% and route them to the
// `mdFormatter` -- I think I know how to do this and am not bothering
// to write the code here.
}
});
Is this a thing I can do -- can I programmatically get from VSCode "the formatter user-configured for language X"?
I have noticed that in dojo source code there are two ways people are creating their nls files. It's about the use of parentheses.
https://github.com/dojo/dojo/blob/master/nls/colors.js:
define({
root: ({
aliceblue: "alice blue",
antiquewhite: "antique white",
(..)
})
})
https://github.com/dojo/dojo/blob/master/tests/nls/salutations.js:
define({
root: {
ar: "Arabic",
cs: "Czech",
(..)
}
})
Both are parsed correctly and it seems that dojo doesn't care if and how many additional parentheses there is (as long as the number of closing parentheses matches the number of opening parentheses).
The same way additional parentheses can be added to the define block.
Is there anything gained by enclosing the root value in parentheses?