Define 輔助函式

PikaCSS 只在兩個真正能大幅改善撰寫體驗的地方保留 define 輔助函式：引擎設定與外掛定義。

defineEnginePlugin

回傳你提供的外掛定義，並為 hook 簽章提供完整的型別推導。

import { defineEnginePlugin } from '@pikacss/core'

const plugin = defineEnginePlugin({
  name: 'my-plugin',
  configureEngine: async (engine) => {
    // 完整型別化的 engine 參數
  },
})

defineEngineConfig

回傳你提供的引擎設定，並為所有設定欄位提供完整的型別推導。

import { defineEngineConfig } from '@pikacss/core'

export default defineEngineConfig({
  prefix: 'pk-',
  plugins: [],
  layers: { base: 0, utilities: 1 },
})

至於其他有型別的結構，例如可重複使用的樣式物件、preflight、關鍵影格、選擇器、shortcut，或變數定義，請使用搭配 satisfies 的純物件常值，或明確的型別註記。

import type { StyleDefinition, VariablesDefinition } from '@pikacss/core'

const card: StyleDefinition = {
  display: 'flex',
  '$:hover': { opacity: '0.8' },
}

const theme = {
  ':root': {
    '--color-primary': '#3b82f6',
    '--spacing-md': '1rem',
  },
} satisfies VariablesDefinition

下一步

• 建立外掛：開始進行外掛開發。
• API 參考：完整的 API 說明文件。