Codux Help Center
Browse our articles to find the answers you need
Using Prettier to Format Code
Prettier is a code formatting tool that makes your code more readable, consistent, and easier to maintain. It takes messy, unformatted code and formats it in an aesthetically pleasing manner while also keeping the structure intact. You can even use it as a linter!
If you have a Prettier config file in your project, Codux will format code files based on the preferences configured inside it when you make changes to the file or format it. For example, code shown in the code drawer in Codux and files opened through the Files panel will show things like indentation size, line length limit, quote strings, trailing commas, end-of-line characters, and so on, based on Prettier configuration.
Use Prettier in Your Project
To use Prettier in your project, add a
.prettierrc file to the root of your project (or to the package root of a monorepo). You can also add a .prettierignore file if you want to ignore (and not format) certain files and folders. Refer here to read about configuring the file in the Prettier docs.You'll see your changes take effect after you make changes to a file, or format the document via the right-click menu option or prettier button at the bottom right of the code drawer.
Note:
If Codux doesn't find a Prettier file in your project, default TypeScript formatter formattings will be used instead. If this is the case, custom code formatting preferences saved using the
formatting config key in codux.config.json will still continue to override the defaults. In other words, the formatting key overrides the Monaco defaults, while the configuration in a .prettierrc file overrides configuration set by the formatting key.Was this article helpful?
