prettier-plugin-sort 0.0.2 → 0.0.3

package/README.md

@@ -182,6 +182,35 @@ import { useEffect, useState } from 'react';
 
 Set `importOrderMergeDuplicates` to `false` if you want to keep the original separate statements. Side-effect imports (`import 'mod';`) are never merged because their order has runtime semantics.
 
+#### Side-effect imports
+
+The order of side-effect imports (`import 'mod'`) often carries runtime meaning, such as CSS cascade order or polyfills that must load before a framework. The plugin never moves other imports across a side-effect import — imports on each side are sorted independently, and the side-effect import itself stays in place.
+
+Before:
+
+<!-- prettier-ignore -->
+```typescript
+import Button from './Button';
+import App from './App';
+import 'normalize.css';
+import theme from './theme';
+import Icon from './Icon';
+```
+
+After:
+
+```typescript
+import App from './App';
+import Button from './Button';
+
+import 'normalize.css';
+
+import Icon from './Icon';
+import theme from './theme';
+```
+
+Imports on each side are sorted independently. The side-effect import itself stays in place.
+
 Sorting rules:
 
 - Imports are classified into groups. Within each group they are sorted alphabetically
@@ -189,7 +218,7 @@ Sorting rules:
 - A blank line is inserted between groups by default. Disable with `importOrderSeparation`
 - `type` imports are split into their own statement by default. Use `importOrderTypeImports` to inline them instead
 - Multiple imports from the same source are merged into one by default. Disable with `importOrderMergeDuplicates`
-- Side-effect imports (`import 'mod'`) are never merged or moved across groups
+- Side-effect imports (`import 'mod'`) carry semantic order and are never moved. Imports on either side are sorted independently
 
 ### Exports
 

package/README.zh.md

@@ -185,6 +185,35 @@ import { useEffect, useState } from 'react';
 
 如果你希望保留原本分离的两条语句，把 `importOrderMergeDuplicates` 设为 `false` 即可。副作用导入（`import 'mod';`）因为顺序有语义，永远不会被合并。
 
+#### 副作用导入
+
+副作用导入（`import 'mod'`）的顺序通常有运行时语义，例如 CSS 的层叠顺序、polyfill 必须在框架之前加载等。插件不会跨越副作用导入移动其他 import 语句：
+
+排序前：
+
+<!-- prettier-ignore -->
+```typescript
+import Button from './Button';
+import App from './App';
+import 'normalize.css';
+import theme from './theme';
+import Icon from './Icon';
+```
+
+排序后：
+
+```typescript
+import App from './App';
+import Button from './Button';
+
+import 'normalize.css';
+
+import Icon from './Icon';
+import theme from './theme';
+```
+
+副作用导入两侧的 import 各自独立排序，副作用导入本身保持原位不动。
+
 排序规则：
 
 - import 按分组分类，分组内按字母序排列
@@ -192,7 +221,7 @@ import { useEffect, useState } from 'react';
 - 分组之间默认插入空行，可通过 `importOrderSeparation` 关闭
 - `type` import 默认拆成独立语句，可通过 `importOrderTypeImports` 调整为内联
 - 同一来源的多条 import 默认合并为一条，可通过 `importOrderMergeDuplicates` 关闭
-- 副作用导入（`import 'mod'`）顺序有语义，永远不参与合并或跨位移动
+- 副作用导入（`import 'mod'`）其顺序有语义，不会被移动，两侧的 import 各自独立排序
 
 ### export
 

package/dist/index.js

@@ -121,28 +121,7 @@ var options = {
   }
 };
 
-// src/sort-exports.ts
-function sortExports(text, rawOptions) {
-  const options2 = resolveSortOptions(rawOptions);
-  if (!options2.exportOrder) {
-    return text;
-  }
-  return text.replace(/export(\s+type)?\s*\{([^}]*)\}/g, (match, typeKeyword, inner) => {
-    const members = splitTopLevel(inner, ",");
-    if (members.length <= 1) {
-      return match;
-    }
-    const sorted = [...members].sort((a, b) => stripTypePrefix(a).localeCompare(stripTypePrefix(b), "en", {
-      sensitivity: "base"
-    }));
-    const same = sorted.every((m, i) => m === members[i]);
-    if (same) {
-      return match;
-    }
-    const prefix = typeKeyword ? `export${typeKeyword}` : "export";
-    return `${prefix} { ${sorted.join(", ")} }`;
-  });
-}
+// src/utils.ts
 function splitTopLevel(input, separator) {
   const out = [];
   let buf = "";
@@ -165,6 +144,29 @@ function splitTopLevel(input, separator) {
   }
   return out.map((s) => s.trim()).filter((s) => s.length > 0);
 }
+
+// src/sort-exports.ts
+function sortExports(text, rawOptions) {
+  const options2 = resolveSortOptions(rawOptions);
+  if (!options2.exportOrder) {
+    return text;
+  }
+  return text.replace(/export(\s+type)?\s*\{([^}]*)\}/g, (match, typeKeyword, inner) => {
+    const members = splitTopLevel(inner, ",");
+    if (members.length <= 1) {
+      return match;
+    }
+    const sorted = [...members].sort((a, b) => stripTypePrefix(a).localeCompare(stripTypePrefix(b), "en", {
+      sensitivity: "base"
+    }));
+    const same = sorted.every((m, i) => m === members[i]);
+    if (same) {
+      return match;
+    }
+    const prefix = typeKeyword ? `export${typeKeyword}` : "export";
+    return `${prefix} { ${sorted.join(", ")} }`;
+  });
+}
 function stripTypePrefix(member) {
   return member.replace(/^type\s+/, "");
 }
@@ -195,30 +197,8 @@ function detectGroup(source) {
   }
   return "external";
 }
-function splitTopLevel2(input, separator) {
-  const out = [];
-  let buf = "";
-  let depth = 0;
-  for (const ch of input) {
-    if (ch === "{" || ch === "(" || ch === "[") {
-      depth++;
-    } else if (ch === "}" || ch === ")" || ch === "]") {
-      depth--;
-    }
-    if (ch === separator && depth === 0) {
-      out.push(buf);
-      buf = "";
-      continue;
-    }
-    buf += ch;
-  }
-  if (buf.length > 0) {
-    out.push(buf);
-  }
-  return out.map((s) => s.trim()).filter((s) => s.length > 0);
-}
 function splitMembers(inner) {
-  return splitTopLevel2(inner, ",").map((part) => {
+  return splitTopLevel(inner, ",").map((part) => {
     const isType = /^type\s+/.test(part);
     const name = isType ? part.replace(/^type\s+/, "").trim() : part;
     return { name, isType };
@@ -227,7 +207,7 @@ function splitMembers(inner) {
 function parseImport(stmt) {
   const trimmed = stmt.raw.trim();
   const leadingComments = stmt.leadingComments;
-  const sideEffect = /^import\s*(['"])([^'"]+)\1\s*;?$/.exec(trimmed);
+  const sideEffect = /^import\s*(['"])([^'"]+)\1(?:\s+with\s*(\{[^}]*\}))?\s*;?$/.exec(trimmed);
   if (sideEffect) {
     return {
       raw: trimmed,
@@ -237,20 +217,22 @@ function parseImport(stmt) {
       defaultSpec: null,
       namespaceSpec: null,
       members: null,
+      attributes: sideEffect[3] ?? null,
       leadingComments
     };
   }
-  const m = /^import\s+(type\s+)?([\s\S]+?)\s*from\s*(['"])([^'"]+)\3\s*;?$/.exec(trimmed);
+  const m = /^import\s+(type\s+)?([\s\S]+?)\s*from\s*(['"])([^'"]+)\3(?:\s+with\s*(\{[^}]*\}))?\s*;?$/.exec(trimmed);
   if (!m) {
     return null;
   }
   const typeClause = Boolean(m[1]);
   const clause = (m[2] ?? "").trim();
   const source = m[4] ?? "";
+  const attributes = m[5] ?? null;
   let defaultSpec = null;
   let namespaceSpec = null;
   let members = null;
-  for (const part of splitTopLevel2(clause, ",")) {
+  for (const part of splitTopLevel(clause, ",")) {
     if (part.startsWith("{")) {
       const inner = part.slice(1, part.lastIndexOf("}")).trim();
       members = inner ? splitMembers(inner) : [];
@@ -268,6 +250,7 @@ function parseImport(stmt) {
     defaultSpec,
     namespaceSpec,
     members,
+    attributes,
     leadingComments
   };
 }
@@ -285,7 +268,7 @@ function extractImportBlock(text) {
     const chunkMatch = /^(?:[ \t]*(?:\/\/[^\n]*|\/\*[\s\S]*?\*\/)?[ \t]*\n)*/.exec(text.slice(cursor));
     const chunk = chunkMatch ? chunkMatch[0] : "";
     const afterSkip = cursor + chunk.length;
-    const importMatch = /^[ \t]*(import\b[\s\S]*?(?:from\s*(['"])[^'"]+\2|(['"])[^'"]+\3)\s*;?)/.exec(text.slice(afterSkip));
+    const importMatch = /^[ \t]*(import\b[\s\S]*?(?:from\s*(['"])[^'"]+\2|(['"])[^'"]+\3)(?:\s+with\s*\{[^}]*\})?\s*;?)/.exec(text.slice(afterSkip));
     if (!importMatch) {
       break;
     }
@@ -323,13 +306,14 @@ function renderMembers(members) {
   return members.map((member) => member.isType ? `type ${member.name}` : member.name).join(", ");
 }
 function renderImport(importDecl) {
+  const suffix = importDecl.attributes ? ` with ${importDecl.attributes}` : "";
   const body = (() => {
     if (importDecl.sideEffect) {
-      return `import '${importDecl.source}';`;
+      return `import '${importDecl.source}'${suffix};`;
     }
     if (importDecl.typeClause) {
       const inner = importDecl.members ? `{ ${renderMembers(importDecl.members)} }` : "";
-      return `import type ${inner} from '${importDecl.source}';`;
+      return `import type ${inner} from '${importDecl.source}'${suffix};`;
     }
     const leftParts = [];
     if (importDecl.defaultSpec) {
@@ -341,7 +325,7 @@ function renderImport(importDecl) {
     if (importDecl.members) {
       leftParts.push(`{ ${renderMembers(importDecl.members)} }`);
     }
-    return `import ${leftParts.join(", ")} from '${importDecl.source}';`;
+    return `import ${leftParts.join(", ")} from '${importDecl.source}'${suffix};`;
   })();
   return importDecl.leadingComments + body;
 }
@@ -382,6 +366,7 @@ function mergeImportsFromSameSource(imports) {
       defaultSpec: existing.defaultSpec ?? importDecl.defaultSpec,
       namespaceSpec: existing.namespaceSpec ?? importDecl.namespaceSpec,
       members: existing.members === null && importDecl.members === null ? null : [...existing.members ?? [], ...importDecl.members ?? []],
+      attributes: existing.attributes ?? importDecl.attributes,
       leadingComments: existing.leadingComments
     };
   }
@@ -407,6 +392,7 @@ function applyTypeImports(importDecl, style) {
         defaultSpec: null,
         namespaceSpec: null,
         members: sortMembersAlpha(typeMembers2.map((member) => ({ ...member, isType: false }))),
+        attributes: importDecl.attributes,
         leadingComments: importDecl.leadingComments
       });
     }
@@ -438,27 +424,13 @@ function applyTypeImports(importDecl, style) {
   const ordered = style === "inline-first" ? [...sortedTypes, ...sortedValues] : [...sortedValues, ...sortedTypes];
   return [{ ...base, members: ordered }];
 }
-function sortImports(text, rawOptions) {
-  const options2 = resolveSortOptions(rawOptions);
-  if (!options2.importOrder) {
-    return text;
-  }
-  const block = extractImportBlock(text);
-  if (!block || block.statements.length === 0) {
-    return text;
-  }
-  const parsed = block.statements.map((rawStmt) => parseImport(rawStmt)).filter((decl) => decl !== null);
-  if (parsed.length === 0) {
-    return text;
+function sortSegment(imports, options2, groupIndex, fallback) {
+  if (imports.length === 0) {
+    return [];
   }
   const style = options2.importOrderTypeImports;
-  const deduped = options2.importOrderMergeDuplicates ? mergeImportsFromSameSource(parsed) : parsed;
+  const deduped = options2.importOrderMergeDuplicates ? mergeImportsFromSameSource(imports) : imports;
   const rewritten = deduped.flatMap((importDecl) => applyTypeImports(importDecl, style));
-  const groupIndex = new Map(options2.importOrderGroups.map((group, index) => [
-    group,
-    index
-  ]));
-  const fallback = options2.importOrderGroups.length;
   const decorated = rewritten.map((importDecl, index) => ({
     stmt: importDecl,
     group: detectGroup(importDecl.source),
@@ -489,7 +461,57 @@ function sortImports(text, rawOptions) {
     lines.push(renderImport(item.stmt));
     prevGroup = item.group;
   }
-  const replacement = lines.join(`
+  return lines;
+}
+function sortImports(text, rawOptions) {
+  const options2 = resolveSortOptions(rawOptions);
+  if (!options2.importOrder) {
+    return text;
+  }
+  const block = extractImportBlock(text);
+  if (!block || block.statements.length === 0) {
+    return text;
+  }
+  const parsed = block.statements.map((rawStmt) => parseImport(rawStmt)).filter((decl) => decl !== null);
+  if (parsed.length === 0) {
+    return text;
+  }
+  const groupIndex = new Map(options2.importOrderGroups.map((group, index) => [
+    group,
+    index
+  ]));
+  const fallback = options2.importOrderGroups.length;
+  const chunks = [];
+  let currentSegment = [];
+  for (const importDecl of parsed) {
+    if (importDecl.sideEffect) {
+      chunks.push({ kind: "segment", imports: currentSegment });
+      chunks.push({ kind: "side-effect", stmt: importDecl });
+      currentSegment = [];
+    } else {
+      currentSegment.push(importDecl);
+    }
+  }
+  chunks.push({ kind: "segment", imports: currentSegment });
+  const allLines = [];
+  for (const chunk of chunks) {
+    if (chunk.kind === "segment") {
+      if (chunk.imports.length === 0) {
+        continue;
+      }
+      const segmentLines = sortSegment(chunk.imports, options2, groupIndex, fallback);
+      if (allLines.length > 0 && options2.importOrderSeparation) {
+        allLines.push("");
+      }
+      allLines.push(...segmentLines);
+    } else {
+      if (allLines.length > 0 && options2.importOrderSeparation) {
+        allLines.push("");
+      }
+      allLines.push(renderImport(chunk.stmt));
+    }
+  }
+  const replacement = allLines.join(`
 `);
   const trailing = text.slice(block.end);
   const suffix = trailing.trim() ? `

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "prettier-plugin-sort",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "description": "An all-in-one Prettier plugin to sort imports, package.json keys, and more.",
   "keywords": [
     "imports",