I have got a "large" project with ~2000 files. I want to change my indentation on the whole project to tabs (with tab size 2). I already changed the workspace settings with theese:
{
"editor.insertSpaces": false,
"editor.tabSize": 2,
"editor.detectIndentation": true,
"editor.formatOnSave": true,
"editor.formatOnPaste": true
}
I also bound a shortcut key to the "convert indentation to tabs" command. Is there any way to avoid to call the command and save file after file?
Related
I have installed prettier extension for VS Code, set it as default formatter, also set format on save to true in VS Code's settings file, and files are set to be saved automatically after some time delay.
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true,
"files.autoSave": "afterDelay"
But prettier is not formatting my code when file is saved automatically after 2 seconds delay. Code is only formatted if i:
manually format the code using option + Shift + F keyboard shortcut.
press command + S
Here's my .prettierrc file
{
"trailingComma": "es5",
"tabWidth": 4,
"semi": true,
"singleQuote": true
}
How can i make prettier format my code automatically on file save?
After some searching, i found out that the following setting
"editor.formatOnSave": true
only works if:
Code formatter is available.
The files are NOT set to be saved after a delay.
And the editor must not be shutting down.
I had set the prettier as the default formatter using the following setting:
"editor.defaultFormatter": "esbenp.prettier-vscode"
But I had set files to be saved automatically after a delay as specified in the following setting:
"files.autoSave": "afterDelay"
This setting was the cause of the problem in my case.
"files.autoSave" setting can have one of the following values:
"off": A dirty editor is never automatically saved.
"afterDelay": A dirty editor is automatically saved after the configured files.autoSaveDelay.
"onFocusChange": A dirty editor is automatically saved when the editor loses focus.
"onWindowChange": A dirty editor is automatically saved when the window loses focus.
Setting "files.autoSave" to any possible value other than "afterDelay" will fix the issue. I solved this issue by setting "files.autoSave" to "onFocusChange".
I am trying to add language based settings for several languages. In order to do so, I modified the file settings.json (see Configure language based settings in VS Code for more information) as follows:
{
"editor.tabSize": 4,
"editor.detectIndentation": false,
"editor.formatOnSave": true,
"vsicons.dontShowNewVersionMessage": false,
"[dart]": {
"editor.tabSize": 2
},
"[typescript]": {
"editor.tabSize": 4
},
"[c]": {
"editor.tabSize": 4
}
}
As you can see, I have the tab size option set to 2 for Dart and to 4 for other languages. The default value for indentation is 4 and "editor.detectIndentation" is disabled. But for some reason the editor doesn't get these settings:
For this reason, IndentRainbow extension does not work properly. On the bar below you can see that VS code still has "4" for tab size.
If I change the global setting for the tab size (editor.tabSize), VS Code just set the new value, e.g., 2 and I have then in all files and for all languages this value for indentation. I also tried to restart VS Code after settings were changed, it didn't help. What can I do to make what I want work properly?
settings.json is saved in C:\Users\MyName\AppData\Roaming\Code\User\
I found out for myself what the problem was. Under the extensions tab, I have the EditorConfig extension. This extension always overrides the user and workspace settings. I simply disabled this extension.
Another possible solution would be to create an .editorconfig file in the folder in which the project is located and to specify there the tab size.
While coding I hit some ctrl keys and totally lost my screen display. The font size has to be 60px! Removed Vs code from Control Panel and deleted settings.json. Downloaded and installed latest Vs code. When Vs code was brought up I started entering values. Added values from saved settings.json file before deletion. Problem returned.
Deleted vscode program via Control Panel, deleted settings.json.
Downloaded and installed latest release of Windows 10 VSCode
Started reentering settings.json values.
Problem returned. Feel like it is a UI problem??
{
"workbench.startupEditor": "newUntitledFile",
"workbench.iconTheme": "vscode-icons",
// Controls the font size in pixels.
"editor.fontSize": 8,
// Controls if the editor should automatically adjust the indentation when
// users type, paste or move lines. Indentation rules of the language must be
// available.
"editor.autoIndent": true,
// The number of spaces a tab is equal to. This setting is overridden based
// on the file contents when `editor.detectIndentation` is on.
"editor.detectIndentation": true,
"editor.insertSpaces": true,
"editor.tabSize": 4,
"editor.wordWrap": "on",
"editor.formatOnPaste": true,
"editor.formatOnSave": true,
"workbench.colorTheme": "Oceanic Next (dimmed bg)",
"editor.minimap.enabled": false,
"files.autoSave": "off",
"window.zoomLevel": 21,
"terminal.integrated.shell.windows": "C:\\WINDOWS\\System32\\WindowsPowerShell\\v1.0\\powershell.exe",
"explorer.confirmDelete": false,
"vsicons.dontShowNewVersionMessage": true,
// Enable/disable built-in PHP validation.
"php.validate.enable": true,
// Points to the PHP executable.
"php.validate.executablePath": "C:/Program Files/PHP/php.exe",
"phpfmt.php_bin": "\"C:\\Program Files\\PHP\\php.exe\"",
}
Tried to include several screen dumps but could not figure out how to do it.
I can best describe the problem as trying to display a 60" TV screen on a 15" Laptop Monitor.
I had the same problem. For me it was this line in settings.json:
"window.zoomLevel": -1,
Setting it to the following solved the issue:
"window.zoomLevel": 0,
I've just made the switch from Atom to VSCode.
When I used Atom and I'm typing JSX in .js files, I could type anything and press tab and it would turn what I tabbed into a custom component. For example, asdf and then tab would give <asdf></asdf>.
Now I have VSCode along with Emmet but this only works some of the time. I've experimented with Emmet and everything works except for basic custom components
All the HTML tags work as expected. i.e div.blue & tab return <div className="blue"></div>
Nesting works asdf>jkl & tab return
<asdf>
<jkl></jkl>
</asdf>
For some reason adding a colon triggers it. as:df & tab return <as:df></as:df> but asdf & tab does not return <asdf></asdf>. I just get my cursor tabbed forward.
I'm not sure whether Intellisense or Snippets are interfering in some way.
The relevant extensions I have installed are JavaScript and TypeScript Intellisense v0.0.7, Javascript Snippet Pack v0.1.5 and simple React Snippets 1.2.2.
And here are my settings:
{
"editor.formatOnSave": true,
"editor.tabSize": 2,
"editor.wordWrap": "on",
"prettier.singleQuote": true,
"prettier.jsxBracketSameLine": true,
"prettier.semi": false,
"prettier.useTabs": true,
"html.format.indentInnerHtml": true,
"workbench.colorTheme": "Base16 Tomorrow Dark",
"liveServer.settings.donotShowInfoMsg": true,
"window.zoomLevel": 0.5,
"editor.fontSize": 11,
"emmet.includeLanguages": {
"javascript": "javascriptreact"
}
}
I've found the answer. In settings add "emmet.triggerExpansionOnTab": true and it will work the way I want it to. By default it was set to false
I want to have VSCode indent C files by 2 spaces by default. Is it possible to do this? Thanks.
Adding to #Batman's answer after you amended your question via a comment (since this is too long to put into a comment): look into "configure language-specific settings..." in your command palette. It'll create
"[c]": {}
at the bottom of your settings.json so you can add anything there like:
"[c]": {
"editor.tabSize": 2,
"editor.insertSpaces": true,
"editor.detectIndentation": false
}
and that will only affect C files.
File > Preferences > Settings
Below Setting worked for me
"editor.tabSize": 2,
"editor.insertSpaces": true,
"editor.detectIndentation": false