Uncaught TypeError: can't access property "Component", u.a is undefined

smac89 commented 3 years ago

I'm Submitting a ...

[ ] Bug report
[ ] Feature request
[x] Support request

Steps to Reproduce

Just trying to use this package in a simple index.html, but the component is not shown:

Expected Results

The picker should be shown along with the button

Actual Results

If I open the above in a browser, all I see is the button, but the component is not shown or loaded and I see an error in the console:

Uncaught TypeError: can't access property "Component", u.a is undefined

Minimal Reproduction of the Problem

index.html

<!DOCTYPE html>
<html>

<head>
    <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="theme-color" content="#000000">

    <title>Report Generator</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/react-datetime/3.0.4/css/react-datetime.min.css"
        integrity="sha512-K7YB1Wc9+Qbb8JKr6G/RDdfYJIb4mRUS9NUIaxThxkt7ZRzhTwWpqD8/Li162hoplRqK61WgSNK9vEXgr/CniA=="
        crossorigin="anonymous" />
</head>

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

    <script crossorigin src="https://unpkg.com/react@17/umd/react.production.min.js"></script>
    <script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"
        integrity="sha512-qTXRIMyZIFb8iQcfjXWCO8+M5Tbc38Qi5WzdPOYZHIlZpzBHG3L3by84BBBOiRGiEb7KKtAOAs5qYdUiZiQNNQ=="
        crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react-datetime/3.0.4/react-datetime.umd.min.js"
        integrity="sha512-NcXvO++n/DhFKj8o7iBHtjusrz2jVY2K10cFSoZAiNchCvKhu/Z31bk1A6EdK+c8WA3s22OgqrzYxQraElyMUA=="
        crossorigin="anonymous"></script>

    <script>
        'use strict';

        const { createElement: e, useState, useRef } = React;

        const ReportGenerator = () => {
            const [reportDate, setReportDate] = useState(new Date());
            return e(
                'div', {},
                e('Datetime', {
                    input: false,
                    selected: reportDate,
                    onChange: setReportDate,
                    // initialViewMode: 'months',
                    open: true
                }),
                e('button', { onClick: () => alert("Report generated!!") }, "Generate Report")
            );
        };
        ReactDOM.render(e(ReportGenerator), document.getElementById('root'));
    </script>
</body>

</html>

cjauvin commented 3 years ago

I have exactly the same problem, with the same version.

wiryonolau commented 1 year ago

any update ? In my case the error already appear with just loading the script , using version 3.1.1

Uncaught TypeError: u.a is undefined
    v https://cdnjs.cloudflare.com/ajax/libs/react-datetime/3.1.1/react-datetime.umd.min.js:1
    i https://cdnjs.cloudflare.com/ajax/libs/react-datetime/3.1.1/react-datetime.umd.min.js:1
    a https://cdnjs.cloudflare.com/ajax/libs/react-datetime/3.1.1/react-datetime.umd.min.js:1
    i https://cdnjs.cloudflare.com/ajax/libs/react-datetime/3.1.1/react-datetime.umd.min.js:1
    a https://cdnjs.cloudflare.com/ajax/libs/react-datetime/3.1.1/react-datetime.umd.min.js:1
    <anonymous> https://cdnjs.cloudflare.com/ajax/libs/react-datetime/3.1.1/react-datetime.umd.min.js:1
    <anonymous> https://cdnjs.cloudflare.com/ajax/libs/react-datetime/3.1.1/react-datetime.umd.min.js:1
    <anonymous> https://cdnjs.cloudflare.com/ajax/libs/react-datetime/3.1.1/react-datetime.umd.min.js:1

3.2.0 also have same problem, when using unminified version this is the error

Uncaught TypeError: c.a is undefined
    <anonymous> DaysView.js:4
    Webpack 7
        n
        <anonymous>
        n
        <anonymous>
        <anonymous>
        <anonymous>
        <anonymous>

wiryonolau commented 1 year ago

Any update ?

arqex / react-datetime