Как собрать библиотеку с typescript и типами на Vite?

Для сборки библиотеки с использованием TypeScript и типов на Vite, вам необходимо выполнить несколько шагов.

1. Создайте новый проект React с помощью шаблона Vite:

yarn create vite my-library --template react-ts

2. Установите необходимые зависимости:

cd my-library
yarn add typescript @types/react @types/react-dom

3. Создайте свою библиотеку. Например, создайте компонент "Button" в папке "src/components".

4. В файле "src/components/Button.tsx" определите свой компонент:

import React from 'react';

interface ButtonProps {
  text: string;
}

const Button: React.FC<ButtonProps> = ({ text }) => {
  return <button>{text}</button>;
}

export default Button;

5. В файле "src/index.ts" экспортируйте свою библиотеку:

export { default as Button } from './components/Button';

6. Проверьте, что ваша библиотека работает, запустив dev-сервер Vite:

yarn dev

7. Теперь вы можете использовать свою библиотеку в другом проекте. Создайте новый проект React с помощью шаблона Vite:

yarn create vite my-app --template react-ts

8. Установите вашу библиотеку:

yarn add path-to-your-library

9. В файле "src/App.tsx" добавьте импорт и использование компонента из вашей библиотеки:

import React from 'react';
import { Button } from 'path-to-your-library';

const App: React.FC = () => {
  return (
    <div>
      <Button text="Click me" />
    </div>
  );
}

export default App;

10. Запустите dev-сервер Vite для нового проекта:

yarn dev

Теперь ваша библиотека с TypeScript и типами успешно собрана и готова к использованию.