Tailwindのタイプ-CSS構成

TailwindにTypescriptを使用-CSS構成

Tailwindには、構成ファイルのタイプが付属しています。それらを使用するには、次の2つの簡単な手順を実行するだけです。

Tailwindへのアップデート-CSS3.1以降

最初の要件は、Tailwind-CSSの依存関係を少なくとも3.1のバージョンに更新することです。これは、それがタイプとともに出荷を開始したバージョンであるためです。

設定ファイルを更新します

2番目の最後のステップは、エクスポートされた構成に「タイプ注釈」と呼ばれる単一の特別なコメントを追加することです。 Typescriptの優れた機能は、Javascriptファイルでも使用できることです。型を含むモジュールを参照できる限り、IDEはこのメタデータを使用して型チェックのオートコンプリートを行うことができます。

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    // The source of your files, e.g. "./src/**/*.{html,js,jsx,tsx}"
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

これらの小さな変更により、Tailwind-CSS構成のファーストクラスタイプのサポートが可能になりました。