How to lint on save in a NextJS project using VSCode

Install Prettier and set the VSCode settings.

Oscar de la Hera Gomez
Written by Oscar de la Hera Gomez
First published on 10/09/2024 at 10:10
Last Updated on 10/09/2024 at 10:28
<p>A flower that represents NextJS with the text "Lint on Save in VSCode."</p>

Install Prettier and set the VSCode settings.

Subscribe

The solution outlined below is found on the main branch of our open source NextJS starter project.

Download Open Source Project

Step One: Install Prettier

<p>A screenshot of VSCode showing you how you can install the Prettier extension through the extensions tab on the left hand side.</p>

In VSCode, make sure that you have the Prettier extension installed.

Step Two: Set VSCode Settings

<p>A screenshot of VSCode showing the settings.json file. The code is found below.</p>

In the settings.json file within the .vscode folder, set the settings found below.

Looking to learn more about NextJS, ReactJS or web development?

Search our blog to find educational content on NextJS, ReactJS and web development.

Search our Blog

Any Questions?

We are actively looking for feedback on how to improve this resource. Please send us a note to inquiries@delasign.com with any thoughts or feedback you may have.
SubscribeContact UsVisit our BlogView our ServicesView our Work

Partner with us

We would love to get to know you and see how we can help your organization with its goals and needs.
Let's Talk

Stay Informed

Get occasional updates about our company, research, and product launches.
Subscribe