Tắt định dạng import type trong Biome

Khi làm việc với Biome ↗, bạn có thể gặp tình huống linter tự động chuyển đổi các import thường thành import type. Mặc dù tính năng này giúp tối ưu hóa, nhưng đôi khi bạn muốn giữ nguyên cú pháp import hiện có. Bài viết này sẽ hướng dẫn 3 cách để tắt tính năng này.

Vấn đề#

Biome có quy tắc useImportType tự động chuyển đổi các import chỉ chứa type thành import type:

// Trước khi Biome format
import { Icons } from '../../libs/icons';

// Sau khi Biome format
import type { Icons } from '../../libs/icons';

Điều này có thể gây phiền toái khi:

• Bạn muốn giữ cú pháp import thường nhất quán
• Import này cũng chứa giá trị runtime (không chỉ type)
• Bạn đang chuyển đổi từ ESLint và muốn giữ nguyên code style

Giải pháp#

Cách 1: Tắt quy tắc toàn cục#

Cách đơn giản nhất là tắt quy tắc useImportType trong file biome.json:

{
  "linter": {
    "enabled": true,
    "rules": {
      "style": {
        "useImportType": "off"
      }
    }
  }
}

[!TIP] Sau khi sửa biome.json, nhớ restart IDE hoặc extension Biome để thay đổi có hiệu lực.

Cách 2: Tắt cho một file cụ thể#

Nếu chỉ muốn tắt cho một file hoặc một dòng cụ thể, sử dụng comment suppress:

// biome-ignore lint/style/useImportType: giữ nguyên cú pháp import
import { Icons } from '../../libs/icons';

Hoặc đặt comment ở đầu file để áp dụng cho toàn bộ file:

// biome-ignore-file lint/style/useImportType
import { Icons } from '../../libs/icons';
import { OtherType } from './other';

Cách 3: Tắt tổ chức import hoàn toàn#

Nếu Biome đang di chuyển, sắp xếp, hoặc tái cấu trúc các type imports khi format, bạn có thể tắt hoàn toàn tính năng organizeImports:

{
  "assist": {
    "enabled": true,
    "actions": {
      "source": {
        "organizeImports": {
          "enabled": false
        }
      }
    }
  }
}

[!WARNING] Cách này sẽ tắt tất cả tính năng tổ chức import, không chỉ type imports. Hãy cân nhắc kỹ trước khi sử dụng.

Khi nào nên dùng cách nào?#

Ví dụ thực tế#

Giả sử bạn có component Astro sử dụng type import:

---
import type { Icons } from '../../libs/icons';

interface Props {
	name: keyof typeof Icons;
}
---

Sau khi tắt useImportType, bạn có thể viết:

---
import { Icons } from '../../libs/icons';

interface Props {
	name: keyof typeof Icons;
}
---

Biome sẽ không tự động chuyển đổi lại thành import type.

Tài liệu tham khảo#

• Biome useImportType rule documentation ↗
• Biome organizeImports documentation ↗
• GitHub discussion about import type issues ↗
• Biome VS Code extension discussion ↗