Dropdown not rendering

Hi TreeSelect is not rendering properly despite importing all the styles. Below is my code

import 'rc-tree-select/assets/index.less';
import TreeSelect from 'rc-tree-select';

function App() {

  const data = [{
    label: 'search me',
    value: 'searchme',

  }]
  return (

    <div>
      Tree select demo
      <TreeSelect treeData={data} style={{ width: '300px' }} placeholder="select" />
    </div>
  );
}

export default App;

Dropdown is not rendering correctly as can be seen from the attached screenshot. Am I missing something here or is it a bug. Please let me know

Do I need to install some compiler to compile .less files? Please let me know

The same thing happens for me, not rendering!

Internally it is loading the index.css but not rendering!

I have same problem. I try the codesandbox and it won't rendered too. show like this

I solve this issue, but my project is in NextJs 13 (without app folder).

Yes, we need a less compiler. This issue helped me #225

install next-with-less as a dependencie and import it on next.config.js

// next.config.js
const withLess = require("next-with-less");

/** @type {import('next').NextConfig} */
const nextConfig = {
  // ...your configs
}

module.exports = withLess(nextConfig);

on _app.tsx import rc-tree-select/assets/index.less

// _app.tsx
import "rc-tree-select/assets/index.less";
...

Navigation Menu

Repository navigation

Dropdown not rendering #422

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Dropdown not rendering #422

Description

Activity

dattakugve commented on Nov 10, 2022

mohamadmulhem commented on Nov 12, 2022

mohamadmulhem commented on Nov 12, 2022

roomay04 commented on Nov 28, 2022

Hidekih commented on Sep 19, 2023

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions