Is it possible to use react-select in the browser from the cdn?

Viewed 772
1 Answers

I figured out. Hope this can help others. Never give up.

react-select v3 (v3.1.1 at this moment) doesn't have standalone lib anymore, so the only way to use it is by v2.

To use v2, you will need to include all the dependences first.

<div id="root"></div>

<script src="https://unpkg.com/react@17/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/@babel/standalone@7.12.7/babel.min.js"></script>
<script src="https://unpkg.com/prop-types@15.7.2/prop-types.js"></script>
<script src="https://unpkg.com/classnames@2.2.6/index.js"></script>
<script src="https://unpkg.com/react-input-autosize@2.2.2/dist/react-input-autosize.js"></script>
<script src="https://unpkg.com/emotion@10.0.27/dist/emotion.umd.min.js"></script><script src="https://unpkg.com/react-select@2.4.4/dist/react-select.js"></script>

<script type="text/babel">

const options = [
  { value: 'chocolate', label: 'Chocolate' },
  { value: 'strawberry', label: 'Strawberry' },
  { value: 'vanilla', label: 'Vanilla' },
];

    class Hello extends React.Component {
        render() {
            return <Select options={options} />;
        }
    }
    ReactDOM.render(
        <Hello />,
        document.getElementById('root')
    );
</script>

Related