Как настроить vite для сборки так, чтобы я мог использовать импорт css файлов?

Привет, у меня возникла проблема с созданием библиотек для React.
Изображение к вопросу
  • 4 октября 2023 г. 10:37
Ответы на вопрос 2
Привет! Для использования импорта CSS файлов в проекте с Vite, вам понадобится установить плагин `vite-plugin-style-import`. Вот как можно настроить Vite для использования импорта CSS файлов:

1. Установите плагин `vite-plugin-style-import`:

```shell
npm install vite-plugin-style-import --save-dev
```

2. Внесите изменения в файл `vite.config.js`:

```javascript
import { defineConfig } from 'vite';
import reactRefresh from '@vitejs/plugin-react-refresh';
import styleImport from 'vite-plugin-style-import';

export default defineConfig({
  plugins: [
    reactRefresh(),
    styleImport({
      libs: [
        {
          libraryName: 'antd',
          esModule: true,
          resolveStyle: (name) => `antd/es/${name}/style/index`,
        },
      ],
    }),
  ],
});
```

3. Перезапустите сборку проекта. Теперь вы сможете использовать импорт CSS файлов напрямую:

```javascript
import 'antd/dist/antd.css';
```

Это позволит вам добавлять и использовать импорт CSS файлов в вашем проекте с помощью Vite.
Такая же беда, случайно не нашли решение?
Похожие вопросы