Is it possible to auto format on VS Code in directory whose root doesn't have prettier config?

- root <-  current directory on VS Code
 - app
  - src <- Do i have to be here to run auto formatting??
   - .prettierrc
   - package.json
   - file1

I cannot run prettier in root directory. Do I have to be in the directory which has prettierrc?

Is it possible to auto format on VS Code in directory whose root doesn't have prettier config?

- root <-  current directory on VS Code
 - app
  - src <- Do i have to be here to run auto formatting??
   - .prettierrc
   - package.json
   - file1

I cannot run prettier in root directory. Do I have to be in the directory which has prettierrc?

• javascript
• visual-studio-code
• prettier

1 Answer 1

You need to include a proper .prettierrc file in the root directory, as the docs about Prettier Configuration File says:

The configuration file will be resolved starting from the location of the file being formatted, and searching up the file tree until a config file is (or isn’t) found.

Prettier intentionally doesn’t support any kind of global configuration. This is to make sure that when a project is copied to another puter, Prettier’s behavior stays the same. Otherwise, Prettier wouldn’t be able to guarantee that everybody in a team gets the same consistent results.

root
├── app
│   ├── file4
│   ├── public
│   │   └── file5
│   └── src
│       ├── file1
│       ├── package.json
│       └── .prettierrc
├── file2
├── file3
└── .prettierrc

If you have a directory structure like above, the files under root/app/src/ (file1, package.json and root/app/src/.prettierrc) will be formatted according to root/app/src/.prettierrc config file, and other files under root/ or its subdirectories (file2, file3, root/.prettierrc, file4, and file5) will be formatted according to root/.prettierrc config file.

Or you can configure default options of Prettier for VS Code:

Configuring Default Options

Some users may not wish to create a new Prettier config for every project or use the VS Code settings. Because Prettier searches recursively up the file path, you can place a global prettier config at ~/.prettierrc to be used as a fallback.

You can also use the setting prettier.configPath to provide a global configuration. However, be careful, if this is set this value will always be used and local configuration files will be ignored.