Skip to main content

时间线 – 设置

安装​

🌐 Installation

  1. 将 timeline/ 文件夹复制到你的应用中
  2. 安装所需的依赖：
npm install remotion @remotion/player @remotion/media-utils tailwindcss

Tailwind 配置​

🌐 Tailwind Configuration

使用 Tailwind CSS v4（当前项目）​

🌐 Using Tailwind CSS v4 (Current Project)

此项目使用 Tailwind CSS V4。在你的全局 CSS 文件中导入 src/timeline/theme/timeline.css：

🌐 This project uses Tailwind CSS V4. Import src/timeline/theme/timeline.css in your global CSS file:

@import './timeline/theme/timeline.css';

你可以通过修改 @theme 块中的值来自定义颜色。

🌐 You can customize the colors by modifying the values in the @theme block.

使用 Tailwind CSS v3（旧版）​

🌐 Using Tailwind CSS v3 (Legacy)

Tailwind v3 使用说明

在你的 tailwind.config.js 中使用 src/timeline/theme/timeline-preset.mjs 作为预设：

然后，像这样设置你的 tailwind.config.js：

🌐 Then, set up your tailwind.config.js like this:

import timelinePreset from './timeline/theme/timeline-preset.mjs';

/** @type {import('tailwindcss').Config} */
export default {
  presets: [timelinePreset],
  content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
  theme: {
    extend: {
      // Add your custom theme extensions here
    },
  },
};
Last updated on