Skip to main content

Hỗ trợ Script

Hỗ trợ TypeScript Docusaurus được viết bằng TypeScript và cung cấp hỗ trợ TypeScript hạng nhất.

Phiên bản yêu cầu tối thiểu là TypeScript 5.1.

Khởi Docusaurus hỗ trợ viết và sử dụng các thành phần chủ đề TypeScript. Nếu mẫu init cung cấp biến thể TypeScript, bạn có thể khởi tạo trực tiếp một trang web có hỗ trợ TypeScript đầy đủ bằng cách sử dụng cờ.--typescript

npx create-docusaurus@latest my-website classic --typescript

Dưới đây là một số hướng dẫn về cách di chuyển một dự án hiện có sang TypeScript.

Thiết lập Thêm các gói sau vào dự án của bạn:

npm Sợi PNPM

npm install --save-dev typescript @docusaurus/module-type-aliases @docusaurus/tsconfig @docusaurus/types

Sau đó, thêm vào gốc dự án của bạn với nội dung sau:tsconfig.json

tsconfig.json

{
  "extends": "@docusaurus/tsconfig",
  "compilerOptions": {
    "baseUrl": "."
  }
}

Docusaurus không sử dụng điều này để biên dịch dự án của bạn. Nó được thêm vào chỉ để có trải nghiệm Editor tốt hơn, mặc dù bạn có thể chọn chạy để tự mình kiểm tra mã của mình hoặc trên CI.tsconfig.jsontsc

Bây giờ bạn có thể bắt đầu viết các thành phần chủ đề TypeScript.

Nhập tệp cấu hình Có thể sử dụng tệp cấu hình TypeScript trong Docusaurus.

docusaurus.config.ts

import type {Config} from '@docusaurus/types';
import type * as Preset from '@docusaurus/preset-classic';

const config: Config = {
  title: 'My Site',
  favicon: 'img/favicon.ico',

  /* Your site config here */

  presets: [
    [
      'classic',
      {
        /* Your preset config here */
      } satisfies Preset.Options,
    ],
  ],

  themeConfig: {
    /* Your theme config here */
  } satisfies Preset.ThemeConfig,
};

export default config;

Cũng có thể sử dụng các chú thích kiểu JSDoc trong một tệp:.js mẹo Chú thích kiểu rất hữu ích và giúp IDE của bạn hiểu loại đối tượng cấu hình!

Các IDE tốt nhất (VS Code, WebStorm, IntelliJ...) sẽ cung cấp trải nghiệm tự động hoàn thành tuyệt vời.

Xoay các thành phần chủ đề TypeScript Đối với các chủ đề hỗ trợ các thành phần chủ đề TypeScript, bạn có thể thêm cờ vào cuối lệnh để lấy mã nguồn TypeScript. Ví dụ, lệnh sau sẽ tạo và thành .--typescriptswizzleindex.tsxstyles.module.csssrc/theme/Footer

npm Sợi PNPM

npm run swizzle @docusaurus/theme-classic Footer -- --typescript

Tất cả các chủ đề chính thức của Docusaurus đều hỗ trợ các thành phần chủ đề TypeScript, bao gồm theme-classic, theme-live-codeblock và theme-search-algolia. Nếu bạn là tác giả gói chủ đề Docusaurus muốn thêm hỗ trợ TypeScript, hãy xem tài liệu API Vòng đời.

5:10:58 AM