BUG: Does not support `prettier.config.ts`, recently added in Prettier `v3.5.0`

[taep96]

Summary

Does not support prettier.config.ts, recently added in Prettier v3.5.0

Steps To Reproduce:

1. Run prettier-vscode
2. Check the output

Expected result

Working properly, like the CLI

Actual result

Errors

VS Code Version:

Version: 1.97.0

Prettier Extension Version:

11.0.0

Prettier Log Output

["ERROR" - 8:16:51 PM] Unknown file extension ".ts" for /path/to/prettier.config.ts
TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" for /path/to/prettier.config.ts
    at Object.getFileProtocolModuleFormat [as file:] (node:internal/modules/esm/get_format:177:9)
    at defaultGetFormat (node:internal/modules/esm/get_format:220:36)
    at defaultLoad (node:internal/modules/esm/load:142:22)
    at async ModuleLoader.load (node:internal/modules/esm/loader:555:7)
    at async ModuleLoader.moduleProvider (node:internal/modules/esm/loader:434:45)
    at async link (node:internal/modules/esm/module_job:87:21)
["ERROR" - 8:16:51 PM] Invalid prettier configuration file detected. See log for details.
["ERROR" - 8:19:53 PM] Invalid prettier configuration file detected.

[taep96]

@itsyoboieltr @fisker

[tryforceful]

Is there any way we can set NODE_OPTIONS="--experimental-strip-types" somewhere in VSCode before Prettier runs? 🤔 to help get around this

[kingyue737]

To make TypeScript config files work, Node.js>=22.6.0 is required and Node.js v22 requires --experimental-strip-types.

According to the release note, Node v22 is required. I wonder if it is currently possible for the prettier extension to implement support for ts config, since VSCode ships with Node v20

[fisker]

As mentioned in the Prettier 3.5 release note, maybe we can use ~tsc~tsx to run Prettier.

[eighty4]

Fix for Node users by upgrading to Node 23

Node 23 will let you use prettier with typescript and not require setting the NODE_OPTIONS for experimental type checking. nvm use 23 will fix.

Fix for Bun users using bunx

If you're using bunx prettier to run Prettier with a .ts config, make sure you are on Node 23 as bunx will run with the Node runtime on your path!

Use bunx --bun prettier to run with Bun! 💉 🚀

[taep96]

This issue is about the VSCode extension, not the CLI.

[coycoydev]

is there a workaround for this?

[taep96]

using prettier.config.js with // @ts-check and jsdoc types

[Shinigami92]

using prettier.config.js with // @ts-check and jsdoc types

That's not a workaround 🤦 Please read the title of the issue...

[taep96]

you’d get all the benefits of typescript in a js file + the extension recognizing the file, so yes it’s a workaround.

if you want to use .ts specifically though read https://github.com/prettier/prettier-vscode/issues/3623#issuecomment-2658392074 and https://github.com/prettier/prettier-vscode/issues/3623#issuecomment-2658681988

[BinToss]

@taep96 It'll be a few months at the very least for VSCode's Extensions Host to upgrade to Node 23. It's still on Node 20. See https://github.com/ewanharris/vscode-versions#vs-code-versions Attempts to use Node.js 23's features in a VSCode extension will fail...unless they can be and are polyfilled.

• tsx: One of the comments you linked suggests using the TypeScript Compiler (tsc) to run prettier.config.cts/ts/mts files. @fisker probably meant tsx. Although it can be used to run scripts via CLI, this project should probably use its API to register it as a module loader.

import 'tsx'
// any _dynamic_ imports of TypeScript modules afterward will work as if they were JavaScript modules.
// It uses ESBuild under the hood for transpilation at runtime.

// See https://www.typescriptlang.org/tsconfig/#allowImportingTsExtensions
const defaultImport = (await import('./myModule.ts')).default; // infers the type of the default import

• depends on ESBuild for transpilation
• Unpacked size (incl. deps): 691 KiB

Edit: Alternatives to tsx

• ts-import provides a solution similar to tsx's API, but I've never tried it. It seems well established (since 2023) and frequently updated.
  • Depends on TSLib
  • Unpacked size (incl. deps): 541 KiB
• ~~cosmiconfig-typescript-loader: An add-on for cosmiconfig. commitlint uses this to load TypeScript configs. Edit 2: Unfortunately, Prettier doesn't use cosmiconfig for config discovery. This isn't an option :(~~
  • jiti: The underlying loader/transpiler. Like TSX, this can be imported globally to allow loading TypeScript modules without type-checking. It also caches transpiled output and has an option to enable sourcemaps.
    • No dependencies (with a catch)
    • Unpacked size: 2181 KiB (2.13 MiB)
      • Okay, why?: Babel is bundled. That comprises 1.9 MiB.

[fisker]

@fisker probably meant tsx.

Ah, yes that's what I mean. This extension can use tsx to support it, I think. Didn't notice this typo 😢 Thanks.

[fisker]

If tsx doesn't work, we can also find a way to pass a ts config loader to the Prettier Core, just let me know.

[fisker]

@BinToss If you are trying to fix this issue, you just need find a way to make import(TS) work, if it doesn't work, find a proper loadTypescriptFile(TS) function. I can make Prettier accept custom loader.

[xt0rted]

The eslint extension has an eslint.runtime option that I set to node so my local version gets used instead of the bundled version. Would a setting like that help here or is there more to loading the configs than just node supporting it?

[Kludgy4]

Please fix this

[CHC383]

VSCode will get Node v22 once https://github.com/microsoft/vscode/pull/245423 is released, but we still need a way to set NODE_OPTIONS="--experimental-strip-types"

[azat-io]

Is there a workaround to use TS configs now?

[Sandy-Garrido]

You can always use the JSDoc for the prettier config at least.

/**
 * @typedef {import('prettier').Config} Config
 */

/** @type {Config} */
const prettierConfig = {
    printWidth: 100
}
export default prettierConfig

[bamf2077]

VSCode will get Node v22 once microsoft/vscode#245423 is released, but we still need a way to set NODE_OPTIONS="--experimental-strip-types"

Node v23.6.0 enables the flag --experimental-strip-types by default, and the same change will be landed on Node v22 soon.

Generally speaking, there is no obvious difference between using prettier.config.js and prettier.config.ts for Prettier.

I think we might wait a few months for VSCode to update to the latest Electron version (which bundles Node v22 that supports this feature) to close this issue?

[loucyx]

You can always use the JSDoc for the prettier config at least.

The modern JSDoc syntax for this uses @import, so it can be simplified further. On top of that we can export default directly and ideally we should always use const and satisfies instead of casting the type:

/**
 * @import { Config } from "prettier";
 */

export default /** @type {const} @satisfies {Config} */ ({
	printWidth: 80,
});

Which reflects the best way of doing it in TypeScript directly:

import type { Config } from "prettier";

export default {
	printWidth: 80,
} as const satisfies Config;

Let's hope support is added soon. Fortunately editors like Zed already support this, so is just a matter of time for VSCode to do so as well.

[bryanprimus]

is there an attempt to finally support this?

[babakfp]

Why is this not getting fixed? What is the problem?

[babakfp]

the extension is useless with this issue not getting fixed. it's not a big deal to fix this, i don't get why it's not fixed. every tool i look into, they have some very important issue open for months and years. On the other hand alternatives are pushing forward to replace these tools. if people behind the tool don't want to work on it, just archive the project. archive this repo and the main prettier project. this will open the way for alternatives... so people look for alternatives instead of using this... prettier project on the other hand is stuck with the idea to not make prettier better by adding more options... but for some reason they add option that are less important. prettier add-ons already have planty of options, this already shows people want more, but no, option = bad... if the people working on the project don't want to work on an issue, just label it, so other can come and fix... there is nothing spacial or hard about reading a ts config file!

[ST-DDT]

it's not a big deal to fix this, i don't get why it's not fixed [...] there is nothing spacial or hard about reading a ts config file!

@babakfp If you know how to do it, open a PR to fix it.

[babakfp]

If you know how to do it, open a PR to fix it.

i tried, didn't work. the part about loading ts config file wasn't the issue, it worked fine using "tsx". i'm not sure what i was missing and why it didn't work.

[nyx-lyb3ra]

the extension is useless with this issue not getting fixed.

@babakfp it is still extremely useful to me, and i continue to use it daily. i don't see why not supporting .ts is so important that not having it makes the extension “unusable” in your case

even so, comments like yours are a nuisance for those of us who have subscribed to the ticket to receive relevant news about this feature. if your intention is not to work on this ticket, but only to complain, don't write anything and you'll cause less annoyance

if, on the other hand, you do want to contribute, open a pr and that's it, or use this ticket to notify that you are working on this and request some assistance. this is open source, here things are done voluntarily and in free time

[babakfp]

i don't see why not supporting .ts is so important that not having it makes the extension “unusable” in your case

the whole point of having the extension is to auto format, and that doesn't work.

to receive relevant news about this feature

there is no news. it's just a state of getting fixed or not.

---

maintainers can put their time on things that users care about. this is the most popular issue on this repo! so far nothing is done about it. if more people talk about it, instead of jumping on each other, then they may care more about the issue. sometimes maintainers aren't even the users of their own creation, so they may be out of touch of what people want and how they feel about it... so it's good to complain about things...

from february 10, 2025 to july 11, 2025 is 151 days.

---

about notifications, you can customize it.

[iwan-uschka]

I am running

• VS [email protected]
• esbenp.prettier-vscode@11.0.0
• prettier@3.5.3

in a project using .prettierrc.js and everything's working as expected. And yes, it does autoformatting because esbenp.prettier-vscode is configured to do so ;)

So

the whole point of having the extension is to auto format, and that doesn't work.

is not true. Maybe we can figure out what's going wrong on your machine.

[nyx-lyb3ra]

@babakfp

maintainers can put their time on things that users care about

they put their time in whatever they want to

and that doesn't work.

my current prettier.config.js:

/** @import { Config } from "prettier" */

/** @type {Config} */
export default {
  editorconfig: true,
};

and my .editorconfig:

root = true

[*]
charset = utf-8
end_of_line = lf
indent_size = 2
indent_style = space
insert_final_newline = true
trim_trailing_whitespace = true

and auto formatting is working as expected

this issue is not about prettier-vscode not working, but about prettier-vscode not supporting typescript files for configs. you can always use js files for your configs and that's it, that works just fine