Get 2024 Templates Mega Bundle!14 Bootstrap, Vue & React Templates + 3 Vector Sets
Get for 99$

Metronic 8.2.1 Laravel Starter Kit errors in console


There are errors in console:


Uncaught SyntaxError: Cannot use import statement outside a module
scripts.bundle.js:8280 Uncaught ReferenceError: $ is not defined
at scripts.bundle.js:8280:1
general.js:13 Uncaught ReferenceError: FormValidation is not defined
at handleValidation (general.js:13:9)
at Object.init (general.js:207:13)
at HTMLDocument.<anonymous> (general.js:220:21)


I cannot do any console log or anything, cannot log in, Please fix or do you guys have any quick fix for this?

Thanks


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (11)


it's something inside resources/mix/plugins.js i'm debugging i'll let know what i find



The problem is with chart.js plugin:

'node_modules/chart.js/dist/chart.js'

changing it with:

'node_modules/chart.js/dist/chart.umd.js'

Solves the problem



Can you provide me with more details on how to resolve this problem?



Please apply the fix so others don't face this problem, Thank you!



Hello. I had the same problem. Although I installed Metronic version 8.2.1 many times, the problem was not fixed. The solution you mentioned worked for me. This fix needs to be released as soon as possible. Thx Carlos.



Hi Carlos,

Thank you for identifying the issue. It seems like there is a problem with the Chart.js plugin in the recent version, which has led to this error. They appear to have renamed the file. We appreciate your feedback, and we will work on releasing a fix for this as soon as possible.

Thanks



Try removing the node_modules folder and the yarn.lock file. It's possible that the recent version of Chart.js no longer includes the chart.umd.js file. After removing these files, you can run yarn install or npm install again to fetch the updated dependencies. This might help resolve the problem.



"chart.js": "^4.4.0",

it does have chart.umd.js

in metronic its including a chart.js which doesn't exists



https://imgur.com/t7KSXCP



in version 3.6.0 it used to be chart.js but versions 4+ got renamed to chart.umd.js


you can check at the migration site:

https://www.chartjs.org/docs/latest/migration/v4-migration.html

dist/chart.js has been removed.
dist/chart.min.js has been renamed to dist/chart.umd.js.



Your clarification is much appreciated. We will make the necessary updates accordingly.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(