VSC won't format code although eslint file exists and settings are set to fix on save - visual-studio-code

I'm using VSC for backend and frontend development with Express, Nest, Angular, React and Vue (JS and TS).
I removed my prettier extension because for Vue projects I'm using the Airbnb code style and it didn't work with the prettier extension.
Currently my VSC settings are
https://gist.github.com/matthiashermsen/425609b71c7f6d1907fced3eaf2a6021
VSC does not format the code on save. When I'm using double quotes in a .ts file I would expect it to format it based on the linter file so it would replace the double quotes with single quotes. Or it would break the line if there are too many characters per line.
So for example this line
import { ApiOkResponse, ApiCreatedResponse, ApiConflictResponse, ApiNotFoundResponse, ApiBadRequestResponse, ApiBody, ApiParam, ApiQuery, ApiTags, ApiOperation } from '#nestjs/swagger';
should be formatted on save because it's too long.
Would someone mind telling me how to configure VSC that it's able to deal with every code style and every linter file and formats on save?
The editor is able to format HTML code in Vue files on save but it's not able to format .ts files in my NestJs backend.

Try "eslint.autoFixOnSave": true
And possibly "editor.defaultFormatter": "dbaeumer.vscode-eslint"
You can also make this language specific, if you don't want ESLint to be your default formatter for all languages.
Finally, if the above don't work, try commenting out all of your other settings except for these, and then re-enable one by one to see if something is getting in the way.
Note of course that you have to have ESLint extension installed

Related

Is it possible to build a LibreOffice document from code similar to the way a web page is built from HTML and CSS?

Is it possible to build a LibreOffice document from code similar to the way a web page is built from HTML and CSS? Can one write an ODF file in which the content and styling are separate, and then/view open in LibreOffice? If so, can one write the code in a text editor as done for HTML/CSS?
There area two reasons I now ask. 1) When I need to make a style change in LibreOffice I have to manually make the same adjustments in a hundred places, such as changing the style of block quotes. 2) I'd like to build documents from a database of text.
I found a question on this in relation to databases but it was about eight years old.
Thank you for any direction you may be able to provide.
Unzip an .odt file that contains styles. You will see two files, content.xml and styles.xml. Edit these files using a text editor and then zip the folder back up to get a modified .odt file.
Be aware that there are two types of styles in the XML files. Named styles are what most people think of as styles, whereas automatic styles are custom formatting, like when you select some text and change the font directly.
The link from tohuwawohu describes utilities to work programmatically with the file. Also as mentioned in the link, it's not too hard to write code yourself. For example in python, import the built-in libraries zipfile and xml.etree.

How to prevent stylelint from generating error on first word of JS file?

I just switched to stylelint. When I open a JS file, it registers an error on the first word in code:
import React from 'react';
It highlights "import" and flags it with Unknown word (CssSyntaxError)
OTW, it's great for my CSS.
Similar question here:
Can I stop stylelint extension from validating JavaScript file?
However, the selected answer is in the stylelint documents as a non-preferred method for skipping JS files:
https://github.com/stylelint/stylelint/blob/master/docs/user-guide/configuration.md#ignorefiles
The preferred answer is found in the docs here:
https://github.com/stylelint/stylelint/blob/master/docs/user-guide/configuration.md#ignorefiles
Create .stylelintignore file and set it up like .gitignore. I added **/*.js and stylelint ignores my JS files.
I am using React and I am not sure if stylint should look at JS files. However, this has fixed my problem for now. If stylelint is supposed to look at JS files, I'd be interested in how I should configure it to work correctly.

vscode: Create rich content similar to what is in the Release Notes?

Visual Studio code has very nicely formatted release notes:
I'd like to create files that look this nice.
How is this done for VSCode? And, is it possible for me to generate a similar document (embedded images, formatting, hyperlinks) in VSCode? Or, do they use a 3rd party tool?
Yes, the release notes are just markdown converted to html that is rendered in a webview. You can use the built-in markdown preview to view markdown content in this way
If you are writing an extension that needs to show nicely formatted content like this, use the vscode.previewHtml command. This example extension provides an example of how to do this using TextDocumentContentProvider

What is the correct way to import/require "vscode" inside the developer tools inside VS Code? [duplicate]

Is there any way to use variable vscode to get editor content just like Atom without writing Extension.
After getting editor content, I can do more things like:
Use Javascript to modify text literally
Custom format
vscode image
atom image
No. This is not supported.
You can use the extension API to extend VS Code. This API lets you get and modify editor contents

How to use variable vscode in Developer tools?

Is there any way to use variable vscode to get editor content just like Atom without writing Extension.
After getting editor content, I can do more things like:
Use Javascript to modify text literally
Custom format
vscode image
atom image
No. This is not supported.
You can use the extension API to extend VS Code. This API lets you get and modify editor contents