Having a list of js errors when integrating html lading page in demo55 with symfony6
received a list of js errors:
Uncaught TypeError: Cannot read properties of undefined (reading 'defaults')
at 66565 (plugins.bundle.6c2a0ad5.js:2:558049)
at o (runtime.6c30001d.js:1:143)
at plugins.bundle.6c2a0ad5.js:2:2363029
at o.O (runtime.6c30001d.js:1:494)
at plugins.bundle.6c2a0ad5.js:2:2363049
at r (runtime.6c30001d.js:1:1370)
at plugins.bundle.6c2a0ad5.js:2:43
scripts.bundle.58e5d437.js:2
Uncaught TypeError: Cannot read properties of undefined (reading 'init')
at Object.init (scripts.bundle.58e5d437.js:2:738)
at 56021 (scripts.bundle.58e5d437.js:2:940)
at o (runtime.6c30001d.js:1:143)
at scripts.bundle.58e5d437.js:2:93043
at o.O (runtime.6c30001d.js:1:494)
at scripts.bundle.58e5d437.js:2:93063
at r (runtime.6c30001d.js:1:1370)
at scripts.bundle.58e5d437.js:2:43
Uncaught ReferenceError: KTUtil is not defined
at 65310 (landing.564a0378.js:1:124)
at o (runtime.6c30001d.js:1:143)
at landing.564a0378.js:1:187
at r (runtime.6c30001d.js:1:1370)
at landing.564a0378.js:1:56
pricing.general.42fedf20.js:1
Uncaught ReferenceError: KTUtil is not defined
at 23976 (pricing.general.42fedf20.js:1:774)
at o (runtime.6c30001d.js:1:143)
at pricing.general.42fedf20.js:1:1798
at o.O (runtime.6c30001d.js:1:494)
I just created a new symfony6 empty project with webencore enabled.
// webpack.config.js
/*
* ENTRY CONFIG
*
* Each entry will result in one JavaScript file (e.g. app.js)
* and one CSS file (e.g. app.css) if your JavaScript imports CSS.
*/
.addEntry('plugins.bundle', './assets/plugins.bundle.js')
.addEntry('scripts.bundle', './assets/scripts.bundle.js')
.addEntry('app', './assets/app.js')
.addEntry('fslightbox.bundle', './assets/plugins/fslightbox.bundle.js')
.addEntry('typedjs.bundle', './assets/plugins/typedjs.bundle.js')
.addEntry('landing', './assets/landing.js')
.addEntry('pricing.general', './assets/pricing/general.js')
// css
.addEntry('landing.header', './assets/styles/landing.header.css')
.addEntry('colors', './assets/styles/colors.css')
// images
.copyFiles({
from: './assets/media',
})
// and then in my base.html.twig
<body id="kt_body" data-bs-spy="scroll" data-bs-target="#kt_landing_menu" class="bg-white position-relative app-blank">
<script> let defaultThemeMode = "light"; let themeMode; if ( document.documentElement ) { if ( document.documentElement.hasAttribute("data-bs-theme-mode")) { themeMode = document.documentElement.getAttribute("data-bs-theme-mode"); } else { if ( localStorage.getItem("data-bs-theme") !== null ) { themeMode = localStorage.getItem("data-bs-theme"); } else { themeMode = defaultThemeMode; } } if (themeMode === "system") { themeMode = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light"; } document.documentElement.setAttribute("data-bs-theme", themeMode); } </script>
{% block body %}{% endblock %}
{# load js at bottom as lazy loading #}
{% block javascripts %}
{{ encore_entry_script_tags('plugins.bundle') }}
{{ encore_entry_script_tags('scripts.bundle') }}
{{ encore_entry_script_tags('app') }}
{% endblock %}
</body>
// in landing.html.twig
{% extends 'base.html.twig' %}
{% block javascripts %}
{{ parent() }}
{{ encore_entry_script_tags('fslightbox.bundle') }}
{{ encore_entry_script_tags('typedjs.bundle') }}
{{ encore_entry_script_tags('landing') }}
{{ encore_entry_script_tags('pricing.general') }}
{% endblock %}
and run yarn build, the command finished successfully.
and go to the page, all those js erros popped out in browser console
Replies (8)
Hi,
Maybe the problem is that you are adding the plugins.bundle.js file as an entry in your webpack.config.js file, but this file is already bundled by webpack. Could you please try to addEntry with this file instead?
/tools/webpack/plugins/plugins.js
This file contains the original plugins that are not bundled yet. Maybe this will solve the errors. Let me know if it works.
Thanks
any updates on this?
tried, and it didn't work, js errors still popped out. even though I copied this plugins.bundle.js directly into /public/build folder, and source it directly in base.html.twig by <script> tag, and it still didn't work.
by html script tag, and it still didn't work
I also tried to see if symfony demo is working by the following steps:
1. open symfony demo folder directly
2. run composer install
3. run yarn install
4. run symfony server:start
5. go to http://127.0.0.1:8000/
and also there was a list of js errors, GET chrome-extension://invalid/ net::ERR_FAILED. and none of menu items worked.
Hi,
Sorry for the late reply.
We are currently preparing Metronic v8.1.9 with Bootstrap 5.3.0 stable version and lots of bug fixes and improvements. This new update should be released by Tuesday or Wednesday. Could you please give it try to use the new version hopefully your issues will be fixed.
If you need any further help please do let us know.
Regards.
Hi,
To clarify, are you working on a new Symfony project from scratch or if you are using the Metronic Symfony theme?
Thanks
I am working on a brand new symfony6 project with metronic html landing page in demo55 not the symfony one inside metronic
