Unable to load Datepicker via UMD

Topic: Unable to load Datepicker via UMD

unikladmin pro premium priority asked 10 months ago

0 0

Expected behavior

Pro component (in this case, Datepicker) should load

Actual behavior

Error displayed: Cannot use import statement outside a module

Resources (screenshots, code snippets etc.) enter image description here

Add comment

Kamila Pieńkowska staff answered 10 months ago

0 0 Best answer

Here is example on how to import mdb package:

<script type="module">
  // MDB import
  import * as mdb from '/src/js/mdb.pro.umd.js';
</script>

Kamila Pieńkowska staff commented 10 months ago

Of course you need to change path according to your use case.

unikladmin pro premium priority commented 10 months ago

This is the code:

    <!-- MDB -->
    <script type="text/javascript" src="/UmsWeb/js/mdb.min.js"></script>

    <!-- MDB ESSENTIAL -->
    <script type="text/javascript" src="/UmsWeb/js/mdb.umd.min.js"></script>
    <!-- MDB PLUGINS -->
    <script type="text/javascript" src="/UmsWeb/plugins/js/all.min.js"></script>    

    <script type="module">
        import * as mdb from '/UmsWeb/src/mdb/js/mdb.pro.umd.js';
    </script>

However, I'm getting another error:

GET https://.../UmsWeb/src/mdb/js/bootstrap/mdb-prefix/offcanvas net::ERR_ABORTED 404 (Not Found)

Kamila Pieńkowska staff commented 10 months ago

If you have this:  <script type="text/javascript" src="/UmsWeb/js/mdb.umd.min.js"></script>

You've allready imported MDB package. There is no need to add:

import * as mdb from '/UmsWeb/src/mdb/js/mdb.pro.umd.js';

Kamila Pieńkowska staff commented 10 months ago

I did not catch this in the screen you provided in the main question, sorry.

unikladmin pro premium priority commented 10 months ago

Thanks a lot! It works now

Add comment

Kamila Pieńkowska staff answered 10 months ago

0 0 Best answer

You need to add type="module" to your script tag.

unikladmin pro premium priority commented 10 months ago

Now I got another error: Uncaught TypeError: Failed to resolve module specifier "mdb-ui-kit". Relative references must start with either "/", "./", or "../".

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

User: Pro
Premium support: Yes
Technology: MDB Standard
MDB Version: MDB5 7.2.0
Device: Laptop
Browser: Chrome
OS: Windows 11
Provided sample code: No
Provided link: No

unikladmin

Pro User Premium support

0Support score
4Questions 0Answers

0Snippets likes 3Snippets