The sorter will incorrectly move the "use client" / "use strict" directive (Next 13), even if a prettier-ignore flag is set.

[jornki]

Your Environment

• Prettier version: 2.7.1
• node version 16.17.0:
• package manager: yarn
• IDE: VScode
• Plugin version: 3.4.0

Describe the bug

Consider the following code:

"use client";

import { useState } from "react";

export default function Test() {
	return <p>Test</p>;
}

On format, the «prettier-plugin-sort-imports», will move the "use client"; directive below the imports, prettier will then wrap it in parenthesis since it's not at the top of file. This breaks client components in Next 13. The same happens when using the use strict; directive.

Adding «// prettier-ignore» above the "use client"; directive does nothing. This part is probably related to #112.

To Reproduce

Use the code snippet above and run prettier --write .

Expected behavior

The "use client"; directive should be left at the top of the file.

[danieljvdm]

Discussion here: #182

[alexllao]

Any solution?