@1adybug/prettier-plugin-sort-imports 0.0.4 → 0.0.6

package/README.md

@@ -19,7 +19,7 @@ A powerful Prettier plugin for intelligently grouping and sorting import stateme
 ### Installation
 
 ```bash
-npm install prettier-plugin-import-sorts --save-dev
+npm install @1adybug/prettier-plugin-sort-imports --save-dev
 ```
 
 ### Basic Configuration
@@ -28,7 +28,7 @@ Add the plugin to your `prettier.config.mjs`:
 
 ```javascript
 export default {
-    plugins: ["prettier-plugin-import-sorts"],
+    plugins: ["@1adybug/prettier-plugin-sort-imports"],
 }
 ```
 
@@ -50,7 +50,7 @@ npx prettier --write "src/**/*.{js,ts,jsx,tsx}"
 
 ```javascript
 // prettier.config.mjs
-import { createPlugin } from "prettier-plugin-import-sorts"
+import { createPlugin } from "@1adybug/prettier-plugin-sort-imports"
 
 export default {
     plugins: [
@@ -157,40 +157,46 @@ interface PluginConfig {
 
 ### Method 1: Simple Configuration
 
-Configure basic options via Prettier config file:
+Use the default plugin with basic options:
 
 ```javascript
 export default {
-    plugins: ["prettier-plugin-import-sorts"],
+    plugins: ["@1adybug/prettier-plugin-sort-imports"],
     importSortSideEffect: false, // Whether to sort side effect imports
     importSortSeparator: "", // Group separator
     importSortRemoveUnused: false, // Whether to remove unused imports
 }
 ```
 
-### Method 2: Advanced Configuration (Factory Function)
+### Method 2: Advanced Configuration
 
-Use `createPlugin` function to pass custom functions:
+Use `createPlugin` function for full control and plugin compatibility:
 
 ```javascript
-import { createPlugin } from "prettier-plugin-import-sorts"
+import { createPlugin } from "@1adybug/prettier-plugin-sort-imports"
 
 export default {
     plugins: [
         createPlugin({
+            // Custom sorting functions
             getGroup: statement => {
-                /* Custom grouping logic */
+                if (statement.path.startsWith("react")) return "react"
+                if (!statement.path.startsWith(".")) return "external"
+                return "local"
             },
             sortGroup: (a, b) => {
-                /* Custom sorting */
+                const order = ["react", "external", "local"]
+                return order.indexOf(a.name) - order.indexOf(b.name)
             },
             sortImportStatement: (a, b) => {
-                /* Custom sorting */
+                return a.path.localeCompare(b.path)
             },
             sortImportContent: (a, b) => {
-                /* Custom sorting */
+                return a.name.localeCompare(b.name)
             },
-            separator: "",
+
+            // Configuration
+            separator: "\n",
             sortSideEffect: true,
             removeUnusedImports: false,
         }),
@@ -198,6 +204,150 @@ export default {
 }
 ```
 
+### Method 3: Custom Plugin Module
+
+Create a custom plugin module for better organization and reusability:
+
+**Step 1**: Create a custom plugin file `prettier-plugin-sort-imports.mjs`:
+
+```javascript
+// prettier-plugin-sort-imports.mjs
+import { createPlugin } from "@1adybug/prettier-plugin-sort-imports"
+
+export default createPlugin({
+    // Custom grouping logic
+    getGroup: statement => {
+        const path = statement.path
+
+        // React and related libraries
+        if (path.startsWith("react") || path.startsWith("@react")) {
+            return "react"
+        }
+
+        // UI libraries
+        if (path.includes("antd") || path.includes("@mui") || path.includes("chakra")) {
+            return "ui"
+        }
+
+        // Utility libraries
+        if (path.includes("lodash") || path.includes("ramda") || path.includes("date-fns")) {
+            return "utils"
+        }
+
+        // External packages (node_modules)
+        if (!path.startsWith(".") && !path.startsWith("@/")) {
+            return "external"
+        }
+
+        // Internal aliases (@/)
+        if (path.startsWith("@/")) {
+            return "internal"
+        }
+
+        // Relative imports
+        return "relative"
+    },
+
+    // Define group order
+    sortGroup: (a, b) => {
+        const order = ["react", "external", "ui", "utils", "internal", "relative"]
+        return order.indexOf(a.name) - order.indexOf(b.name)
+    },
+
+    // Custom import content sorting
+    sortImportContent: (a, b) => {
+        // Types first, then variables
+        if (a.type !== b.type) {
+            return a.type === "type" ? -1 : 1
+        }
+
+        // Alphabetical order within same type
+        const aName = a.alias ?? a.name
+        const bName = b.alias ?? b.name
+        return aName.localeCompare(bName)
+    },
+
+    // Add blank lines between groups
+    separator: "\n",
+
+    // Sort side effects
+    sortSideEffect: true,
+})
+```
+
+**Step 2**: Use the custom plugin in your `prettier.config.mjs`:
+
+```javascript
+// prettier.config.mjs
+export default {
+    plugins: ["./prettier-plugin-sort-imports.mjs"],
+    // Other prettier options...
+    semi: false,
+    tabWidth: 4,
+}
+```
+
+**Benefits of this approach**:
+- ✅ **Reusable**: Share the same configuration across multiple projects
+- ✅ **Version Control**: Track your import sorting rules in git
+- ✅ **Maintainable**: Keep complex logic separate from prettier config
+- ✅ **Team Collaboration**: Consistent import sorting rules across team members
+
+### Method 4: Plugin Compatibility
+
+Use `createPlugin` with `otherPlugins` to merge with other Prettier plugins and avoid conflicts:
+
+```javascript
+import { createPlugin } from "@1adybug/prettier-plugin-sort-imports"
+import * as tailwindPlugin from "prettier-plugin-tailwindcss"
+
+export default {
+    plugins: [
+        createPlugin({
+            // Your import sorting configuration
+            getGroup: statement => {
+                if (statement.path.startsWith("react")) return "react"
+                if (!statement.path.startsWith(".")) return "external"
+                return "local"
+            },
+            separator: "\n",
+
+            // Other Prettier plugins to combine with (Plugin objects only)
+            otherPlugins: [
+                tailwindPlugin, // Import the plugin directly
+                // Add more plugins as needed...
+            ],
+
+            // Configuration options for other plugins
+            prettierOptions: {
+                // TailwindCSS plugin options
+                tailwindConfig: "./tailwind.config.js",
+                tailwindFunctions: ["clsx", "cn", "cva"],
+                tailwindAttributes: ["class", "className", "ngClass", ":class"],
+
+                // Other plugin options can go here...
+            },
+        }),
+    ],
+}
+```
+
+**Important Notes:**
+
+- `otherPlugins` only accepts imported Plugin objects, not string plugin names
+- You must import the plugins yourself to ensure proper module resolution
+- This approach avoids complex module loading issues and gives you full control
+
+**Plugin Execution Order:**
+
+- Other plugins are executed in the order they appear in the `otherPlugins` array
+- Import sorting is always executed last to ensure compatibility
+
+**Configuration Passing:**
+
+- Options in `prettierOptions` are passed to all other plugins
+- This allows other plugins to receive their configuration even when merged
+
 ### importSortRemoveUnused
 
 Whether to remove unused imports, defaults to `false`.
@@ -390,7 +540,7 @@ Prettier natively cannot accept functions as configuration parameters (because c
 
 ```javascript
 // Factory function is called in config file, returning a plugin instance
-import { createPlugin } from "prettier-plugin-import-sorts"
+import { createPlugin } from "@1adybug/prettier-plugin-sort-imports"
 
 export default {
     plugins: [

package/README.zh-CN.md

@@ -19,7 +19,7 @@
 ### 安装
 
 ```bash
-npm install prettier-plugin-import-sorts --save-dev
+npm install @1adybug/prettier-plugin-sort-imports --save-dev
 ```
 
 ### 基础配置
@@ -28,7 +28,7 @@ npm install prettier-plugin-import-sorts --save-dev
 
 ```javascript
 export default {
-    plugins: ["prettier-plugin-import-sorts"],
+    plugins: ["@1adybug/prettier-plugin-sort-imports"],
 }
 ```
 
@@ -50,7 +50,7 @@ npx prettier --write "src/**/*.{js,ts,jsx,tsx}"
 
 ```javascript
 // prettier.config.mjs
-import { createPlugin } from "prettier-plugin-import-sorts"
+import { createPlugin } from "@1adybug/prettier-plugin-sort-imports"
 
 export default {
     plugins: [
@@ -161,7 +161,7 @@ interface PluginConfig {
 
 ```javascript
 export default {
-    plugins: ["prettier-plugin-import-sorts"],
+    plugins: ["@1adybug/prettier-plugin-sort-imports"],
     importSortSideEffect: false, // 是否对副作用导入排序
     importSortSeparator: "", // 分组分隔符
     importSortRemoveUnused: false, // 是否删除未使用的导入
@@ -173,7 +173,7 @@ export default {
 使用 `createPlugin` 函数可以传递自定义函数：
 
 ```javascript
-import { createPlugin } from "prettier-plugin-import-sorts"
+import { createPlugin } from "@1adybug/prettier-plugin-sort-imports"
 
 export default {
     plugins: [
@@ -198,6 +198,150 @@ export default {
 }
 ```
 
+### 方式 3：自定义插件模块
+
+创建自定义插件模块以获得更好的组织性和可复用性：
+
+**步骤 1**：创建自定义插件文件 `prettier-plugin-sort-imports.mjs`：
+
+```javascript
+// prettier-plugin-sort-imports.mjs
+import { createPlugin } from "@1adybug/prettier-plugin-sort-imports"
+
+export default createPlugin({
+    // 自定义分组逻辑
+    getGroup: statement => {
+        const path = statement.path
+
+        // React 及相关库
+        if (path.startsWith("react") || path.startsWith("@react")) {
+            return "react"
+        }
+
+        // UI 库
+        if (path.includes("antd") || path.includes("@mui") || path.includes("chakra")) {
+            return "ui"
+        }
+
+        // 工具库
+        if (path.includes("lodash") || path.includes("ramda") || path.includes("date-fns")) {
+            return "utils"
+        }
+
+        // 外部包 (node_modules)
+        if (!path.startsWith(".") && !path.startsWith("@/")) {
+            return "external"
+        }
+
+        // 内部别名 (@/)
+        if (path.startsWith("@/")) {
+            return "internal"
+        }
+
+        // 相对导入
+        return "relative"
+    },
+
+    // 定义分组顺序
+    sortGroup: (a, b) => {
+        const order = ["react", "external", "ui", "utils", "internal", "relative"]
+        return order.indexOf(a.name) - order.indexOf(b.name)
+    },
+
+    // 自定义导入内容排序
+    sortImportContent: (a, b) => {
+        // 类型在前，变量在后
+        if (a.type !== b.type) {
+            return a.type === "type" ? -1 : 1
+        }
+
+        // 同类型内按字母顺序
+        const aName = a.alias ?? a.name
+        const bName = b.alias ?? b.name
+        return aName.localeCompare(bName)
+    },
+
+    // 在分组间添加空行
+    separator: "\n",
+
+    // 排序副作用导入
+    sortSideEffect: true,
+})
+```
+
+**步骤 2**：在 `prettier.config.mjs` 中使用自定义插件：
+
+```javascript
+// prettier.config.mjs
+export default {
+    plugins: ["./prettier-plugin-sort-imports.mjs"],
+    // 其他 prettier 选项...
+    semi: false,
+    tabWidth: 4,
+}
+```
+
+**此方法的优点**：
+- ✅ **可复用**：在多个项目间共享相同配置
+- ✅ **版本控制**：在 git 中跟踪你的导入排序规则
+- ✅ **易维护**：将复杂逻辑从 prettier 配置中分离
+- ✅ **团队协作**：团队成员间保持一致的导入排序规则
+
+### 方式 4：插件兼容性
+
+使用 `createPlugin` 的 `otherPlugins` 参数与其他 Prettier 插件合并，避免冲突：
+
+```javascript
+import { createPlugin } from "@1adybug/prettier-plugin-sort-imports"
+import * as tailwindPlugin from "prettier-plugin-tailwindcss"
+
+export default {
+    plugins: [
+        createPlugin({
+            // 你的导入排序配置
+            getGroup: statement => {
+                if (statement.path.startsWith("react")) return "react"
+                if (!statement.path.startsWith(".")) return "external"
+                return "local"
+            },
+            separator: "\n",
+
+            // 要合并的其他 Prettier 插件（仅支持 Plugin 对象）
+            otherPlugins: [
+                tailwindPlugin, // 直接导入插件
+                // 根据需要添加更多插件...
+            ],
+
+            // 其他插件的配置选项
+            prettierOptions: {
+                // TailwindCSS 插件选项
+                tailwindConfig: "./tailwind.config.js",
+                tailwindFunctions: ["clsx", "cn", "cva"],
+                tailwindAttributes: ["class", "className", "ngClass", ":class"],
+
+                // 其他插件选项可以在这里配置...
+            },
+        }),
+    ],
+}
+```
+
+**重要说明**：
+
+- `otherPlugins` 只接受导入的 Plugin 对象，不支持字符串插件名称
+- 你必须自己导入插件以确保正确的模块解析
+- 这种方法避免了复杂的模块加载问题，给你完全的控制权
+
+**插件执行顺序**：
+
+- 其他插件按照在 `otherPlugins` 数组中出现的顺序执行
+- 导入排序始终最后执行以确保兼容性
+
+**配置传递**：
+
+- `prettierOptions` 中的选项会传递给所有其他插件
+- 这允许其他插件即使在合并时也能接收到它们的配置
+
 ### importSortRemoveUnused
 
 是否删除未使用的导入，默认为 `false`。
@@ -390,7 +534,7 @@ Prettier 原生无法接受函数作为配置参数（因为配置需要序列
 
 ```javascript
 // 工厂函数在配置文件中被调用，返回一个插件实例
-import { createPlugin } from "prettier-plugin-import-sorts"
+import { createPlugin } from "@1adybug/prettier-plugin-sort-imports"
 
 export default {
     plugins: [

package/dist/index.d.ts

@@ -1,7 +1,8 @@
 import { Plugin } from "prettier";
-import { PluginConfig } from "./types";
-/** 默认插件实例（用于简单使用） */
-declare const plugin: Plugin;
+import type { PluginConfig } from "./types";
+export * from "./types";
 /** 创建自定义配置的插件（工厂函数） */
 export declare function createPlugin(config?: PluginConfig): Plugin;
+/** 默认插件实例（用于简单使用） */
+declare const plugin: Plugin;
 export default plugin;

package/dist/index.js

@@ -235,7 +235,8 @@ function parseImportNode(node, comments, usedComments) {
         start,
         end
     };
-    const importContents = parseExportSpecifiers(node);
+    const isTypeOnlyExport = "type" === node.exportKind;
+    const importContents = parseExportSpecifiers(node, isTypeOnlyExport);
     return {
         path: source,
         isExport: true,
@@ -289,7 +290,7 @@ function parseImportSpecifiers(node, isTypeOnlyImport = false) {
     }
     return contents;
 }
-function parseExportSpecifiers(node) {
+function parseExportSpecifiers(node, isTypeOnlyExport = false) {
     const contents = [];
     if (!node.specifiers) return contents;
     for (const specifier of node.specifiers)if ("ExportSpecifier" === specifier.type) {
@@ -305,7 +306,7 @@ function parseExportSpecifiers(node) {
         }
         const localName = "Identifier" === specifier.local.type ? specifier.local.name : specifier.local.value;
         const exportedName = "Identifier" === specifier.exported.type ? specifier.exported.name : specifier.exported.value;
-        const isTypeExport = "type" === specifier.exportKind;
+        const isTypeExport = isTypeOnlyExport || "type" === specifier.exportKind;
         contents.push({
             name: localName,
             alias: localName !== exportedName ? exportedName : void 0,
@@ -525,33 +526,33 @@ function mergeImports(imports) {
     return Array.from(mergedMap.values());
 }
 const src_require = createRequire(import.meta.url);
-let src_userConfig = {};
-function preprocessImports(text, options) {
+function preprocessImports(text, options, config = {}) {
     try {
         const imports = parseImports(text);
         if (0 === imports.length) return text;
-        const config = {
-            getGroup: src_userConfig.getGroup ?? options.getGroup,
-            sortGroup: src_userConfig.sortGroup ?? options.sortGroup,
-            sortImportStatement: src_userConfig.sortImportStatement ?? options.sortImportStatement,
-            sortImportContent: src_userConfig.sortImportContent ?? options.sortImportContent,
-            separator: src_userConfig.separator ?? options.importSortSeparator ?? options.separator,
-            sortSideEffect: src_userConfig.sortSideEffect ?? options.importSortSideEffect ?? false,
-            removeUnusedImports: src_userConfig.removeUnusedImports ?? options.importSortRemoveUnused ?? false
+        const optionsConfig = options;
+        const finalConfig = {
+            getGroup: config.getGroup ?? optionsConfig.getGroup,
+            sortGroup: config.sortGroup ?? optionsConfig.sortGroup,
+            sortImportStatement: config.sortImportStatement ?? optionsConfig.sortImportStatement,
+            sortImportContent: config.sortImportContent ?? optionsConfig.sortImportContent,
+            separator: config.separator ?? optionsConfig.importSortSeparator ?? optionsConfig.separator,
+            sortSideEffect: config.sortSideEffect ?? optionsConfig.importSortSideEffect ?? false,
+            removeUnusedImports: config.removeUnusedImports ?? optionsConfig.importSortRemoveUnused ?? false
         };
         let processedImports = imports;
-        if (config.removeUnusedImports) {
+        if (finalConfig.removeUnusedImports) {
             const lastImport = imports[imports.length - 1];
             const codeAfterImports = text.slice(lastImport.end ?? 0);
             processedImports = removeUnusedImportsFromStatements(imports, codeAfterImports);
         }
-        const sortedImports = sortImports(processedImports, config);
+        const sortedImports = sortImports(processedImports, finalConfig);
         const mergedImports = mergeImports(sortedImports);
         let formattedImports;
-        if (config.getGroup) {
-            const groups = groupImports(mergedImports, config);
-            const sortedGroups = sortGroups(groups, config);
-            formattedImports = formatGroups(sortedGroups, config);
+        if (finalConfig.getGroup) {
+            const groups = groupImports(mergedImports, finalConfig);
+            const sortedGroups = sortGroups(groups, finalConfig);
+            formattedImports = formatGroups(sortedGroups, finalConfig);
         } else formattedImports = formatImportStatements(mergedImports);
         const firstImport = imports[0];
         const lastImport = imports[imports.length - 1];
@@ -567,50 +568,79 @@ function preprocessImports(text, options) {
         return text;
     }
 }
-const babelParser = src_require("prettier/parser-babel").parsers.babel;
-const typescriptParser = src_require("prettier/parser-typescript").parsers.typescript;
-const babelTsParser = src_require("prettier/parser-babel").parsers["babel-ts"];
-function createPluginInstance() {
+const { parsers: { babel } } = src_require("prettier/parser-babel");
+const { parsers: { typescript } } = src_require("prettier/parser-typescript");
+const { parsers: { "babel-ts": babelTs } } = src_require("prettier/parser-babel");
+function createCombinedPreprocess(parserName, config) {
+    return function(text, options) {
+        const otherPlugins = config.otherPlugins || [];
+        if (0 === otherPlugins.length) return preprocessImports(text, options, config);
+        const prettierOptions = config.prettierOptions || {};
+        const mergedOptions = {
+            ...options,
+            ...prettierOptions
+        };
+        const preprocessFunctions = [];
+        for (const plugin of otherPlugins){
+            const parser = plugin?.parsers?.[parserName];
+            if (parser?.preprocess && "function" == typeof parser.preprocess) preprocessFunctions.push(parser.preprocess);
+        }
+        preprocessFunctions.push((text, options)=>preprocessImports(text, options, config));
+        let processedText = text;
+        for (const preprocess of preprocessFunctions)try {
+            processedText = preprocess(processedText, mergedOptions);
+        } catch (error) {
+            console.warn("Plugin preprocess failed:", error instanceof Error ? error.message : String(error));
+        }
+        return processedText;
+    };
+}
+function createPluginInstance(config = {}) {
+    const baseOptions = {
+        importSortSeparator: {
+            type: "string",
+            category: "Import Sort",
+            description: "分组之间的分隔符"
+        },
+        importSortSideEffect: {
+            type: "boolean",
+            category: "Import Sort",
+            description: "是否对副作用导入进行排序",
+            default: false
+        },
+        importSortRemoveUnused: {
+            type: "boolean",
+            category: "Import Sort",
+            description: "是否删除未使用的导入",
+            default: false
+        }
+    };
+    const otherPlugins = config.otherPlugins || [];
+    const mergedOptions = {
+        ...baseOptions
+    };
+    for (const plugin of otherPlugins)if (plugin?.options) Object.assign(mergedOptions, plugin.options);
     return {
         parsers: {
             babel: {
-                ...babelParser,
-                preprocess: preprocessImports
+                ...babel,
+                preprocess: createCombinedPreprocess("babel", config)
             },
             typescript: {
-                ...typescriptParser,
-                preprocess: preprocessImports
+                ...typescript,
+                preprocess: createCombinedPreprocess("typescript", config)
             },
             "babel-ts": {
-                ...babelTsParser,
-                preprocess: preprocessImports
+                ...babelTs,
+                preprocess: createCombinedPreprocess("babel-ts", config)
             }
         },
-        options: {
-            importSortSeparator: {
-                type: "string",
-                category: "Import Sort",
-                description: "分组之间的分隔符"
-            },
-            importSortSideEffect: {
-                type: "boolean",
-                category: "Import Sort",
-                description: "是否对副作用导入进行排序",
-                default: false
-            },
-            importSortRemoveUnused: {
-                type: "boolean",
-                category: "Import Sort",
-                description: "是否删除未使用的导入",
-                default: false
-            }
-        }
+        options: mergedOptions
     };
 }
-const src_plugin = createPluginInstance();
 function createPlugin(config = {}) {
-    src_userConfig = config;
-    return createPluginInstance();
+    return createPluginInstance(config);
 }
+const src_plugin = createPluginInstance();
 const src = src_plugin;
 export { createPlugin, src as default };

package/dist/parser.d.ts

@@ -1,2 +1,3 @@
-import { ImportStatement } from "./types"; /** 解析导入语句 */
+import { ImportStatement } from "./types";
+/** 解析导入语句 */
 export declare function parseImports(code: string): ImportStatement[];

package/dist/sorter.d.ts

@@ -1,6 +1,6 @@
 import { Group, ImportContent, ImportStatement, PluginConfig } from "./types"; /** 导入类型 */
 /** 合并后的配置 */
-export interface MergedConfig extends Omit<Required<PluginConfig>, "separator" | "removeUnusedImports"> {
+export interface MergedConfig extends Omit<Required<PluginConfig>, "separator" | "removeUnusedImports" | "otherPlugins" | "prettierOptions"> {
     separator: PluginConfig["separator"];
     removeUnusedImports: boolean;
 }

package/dist/types.d.ts

@@ -1,3 +1,4 @@
+import { Plugin } from "prettier";
 /** 导入内容 */
 export interface ImportContent {
     /** 导入的内容的名称 */
@@ -67,4 +68,8 @@ export interface PluginConfig {
     sortSideEffect?: boolean;
     /** 是否删除未使用的导入，默认为 false */
     removeUnusedImports?: boolean;
+    /** 要合并的其他 Prettier 插件，按传入顺序执行 */
+    otherPlugins?: Plugin[];
+    /** 传递给其他插件的 Prettier 配置选项 */
+    prettierOptions?: Record<string, any>;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@1adybug/prettier-plugin-sort-imports",
     "type": "module",
-    "version": "0.0.4",
+    "version": "0.0.6",
     "description": "一个 Prettier 插件，用于对 JavaScript/TypeScript 文件的导入语句进行分组和排序",
     "keywords": [
         "prettier",