prettier-plugin-tailwindcss causing global error handling to dump prettier flow.mjs contents to the console

[JamesHenry]

What version of prettier-plugin-tailwindcss are you using?

Latest - v0.6.8

What version of Tailwind CSS are you using?

Latest - v3.3.3

What version of Node.js are you using?

v20.17.0

What package manager are you using?

npm

What operating system are you using?

macOS

Reproduction URL

https://github.com/JamesHenry/prettier-tailwindcss-flow-repro

Describe your issue

Full explanation:

https://www.loom.com/share/8aa70b8bd4d54299a018d1f35f64fc6a

Steps per README

npm install
node script.cjs  # for the commonjs implementation
node script.mjs # for the ESM implementation

ESM vs CJS doesn't matter, both exhibit the same behavior.

The presence of prettier-plugin-tailwindcss is key, through its dependency on the flow parser, it is somehow causing all subsequent errors to be processed by prettier/plugins/flow.mjs, which then dumps contents from that minified file to the console.

[thecrypticace]

This has to be one of the wildest things I've seen. I have no idea what would cause this 😱

I'll take a look today

[thecrypticace]

Even smaller repro:

import "prettier-plugin-tailwindcss";
throw new Error("test");

[thecrypticace]

Uring prettier/plugins/flow directly reproduces the issue:

import "prettier/plugins/flow";
throw new Error("test");

That plugin doesn't do anything weird but it does import (and subsequently bundle) flow-parser which also reproduces the issue:

import "flow-parser";
throw new Error("test");

The flow parser is written in OCaml so it's harder to track the source of the issue there.

[thecrypticace]

I think this is because of the OCaml byte code -> JS compiler that flow uses (ocaml_of_js). I'll open an issue on the Flow repo about this.

I'm not sure if we can find a way to lazy load these plugins if they're not used. Prettier does but I think uses private API to do so. I'll look into it.