<div id="container" style="padding: 24px"></div>
<script>
  var mountNode = document.getElementById('container');
</script>
@import 'antd/dist/antd.css';

const {  DatePicker  } = antd;

function onChange(date, dateString) {
  console.log(date, dateString);
}

ReactDOM.render(
  <>
    <DatePicker onChange={onChange} />
    <br />
    <DatePicker onChange={onChange} picker="week" />
    <br />
    <DatePicker onChange={onChange} picker="month" />
    <br />
    <DatePicker onChange={onChange} picker="year" />
  </>,
  mountNode,
);
View Compiled

External CSS

  1. https://unpkg.com/antd@4.0.2/dist/antd.css

External JavaScript

  1. https://unpkg.com/react@16.x/umd/react.development.js
  2. https://unpkg.com/react-dom@16.x/umd/react-dom.development.js
  3. https://unpkg.com/moment/min/moment-with-locales.js
  4. https://unpkg.com/antd@4.0.2/dist/antd-with-locales.js
  5. https://unpkg.com/@ant-design/icons/dist/index.umd.js
  6. https://unpkg.com/react-router-dom/umd/react-router-dom.min.js
  7. https://unpkg.com/react-router@3.x/umd/ReactRouter.min.js