Uncaught SyntaxError

Hi @foxhound87,

Thanks for reaching out. I’m sorry for the trouble here.

Out of curiosity, does this error appear for you when logged into your WordPress site or when logged out? Or does it appear in both instances?

It’s possible there might be a plugin conflict. Are you able to share with me a list of your active plugins?

Thank you!

Yes it appears only when logged in.

these are my active plugins:

All in One SEO
Contact Form 7
Elementor
Google Analytics for WordPress by MonsterInsights
Kirki Customizer Framework
MC4WP: Mailchimp for WordPress
Meta Box
Razzi Addons
Soo Demo Importer
UserFeedback Lite
WCBoost – Products Compare
WCBoost – Variation Swatches
WCBoost – Wishlist
WooCommerce
WooCommerce PayPal Payments
WooCommerce Shipping & Tax
WooCommerce Weight Based Shipping
WooPayments
WP Super Cache
WPForms Lite

Hello. I have too error on Frontend side with this “Import Module”

The error “Uncaught SyntaxError: Cannot use import statement outside a module” occurs when a JavaScript file with import statements is loaded in a context that doesn’t support ES6 module syntax (also known as ECMAScript 2015). This can happen with files like frontend.min.js if they are loaded without specifying the module type.

Subject: JavaScript Module Loading Issue: Uncaught SyntaxError: Cannot use import statement outside a module

Description: I’m encountering an error in frontend.min.js in the plugin directory (/wp-content/plugins/google-analytics-premium/pro/assets/vue). When attempting to load this file, I receive the following error in the console:

javascript

Copy code

Uncaught SyntaxError: Cannot use import statement outside a module (at frontend.min.js?ver=9.2.1:1:1)

Steps to Reproduce:

1. Load the page where frontend.min.js is used.
2. Observe the console error.

Expected Behavior: The JavaScript file should load without errors, and all module imports should be properly handled.

Observed Behavior: The import statements in frontend.min.js are throwing an error because the file is not recognized as a module.

Details: This issue typically occurs when JavaScript files with import statements are loaded without the necessary type="module" attribute, which is required for ES6 modules. Here is a relevant configuration snippet from manifest.json:

You must add script how <script type=”module” but you add him how <script type=”text/javascript”..

Bug Report: Conflict in Script Tag Type Modification for Module Scripts

Description:

During independent testing, a bug was identified involving the function public function script_loader_tag( $tag, $handle, $src ) located in admin-assets.php. This function is intended to set specific scripts as modules by modifying the <script> tag. However, an issue was observed, where despite modifications from the filter, the <script> tag’s type remains as text/javascript instead of module.

Log results indicate that the filter correctly applies changes to the <script> tag. Nevertheless, the script type is not updated to module because an existing type="text/javascript" attribute is likely predefined, either within the plugin code or influenced by browser behavior. Consequently, for the file js/frontend.min.js, the script type remains incorrect, causing the module-based script not to load as intended.

Proposed Solution:

To address this issue temporarily, I suggest modifying the function in admin-assets.php under the path /wp-content/plugins/google-analytics-for-wordpress/includes/admin as follows:

/**
 * Update script tag.
 * The vue code needs type=module.
 */
public function script_loader_tag( $tag, $handle, $src ) {

    if ( ! in_array( $handle, $this->own_handles ) ) {
        return $tag;
    }

    // Check if the 'monsterinsights-vue-frontend' script is the target
    if ( 'monsterinsights-vue-frontend' === $handle ) {
        // Remove any existing type attribute
        $tag = preg_replace( '/\stype="[^"]+"/', '', $tag );
    }

    // Change the script tag by adding type="module" and return it.
    $tag = str_replace( '></script>', ' type="module"></script>', $tag );

    $domain = monsterinsights_is_pro_version() ? 'ga-premium' : 'ga-premium';
    $tag    = monsterinsights_get_printable_translations( $domain ) . $tag;

    return $tag;
}

This modification removes the type="text/javascript" attribute and correctly sets type="module". It temporarily resolves the console errors and ensures proper functionality of the plugin. We hope the development team can review and implement a permanent fix to detect and set the correct module type without conflict.

Impact:

This issue affects both the Pro and Lite versions of the plugin, preventing the script and its dependencies from executing correctly.

Results After the Fix:

1. Pro Version: <script src="DEMOSITE/wp-content/plugins/google-analytics-premium/pro/assets/vue/js/frontend.min.js?ver=9.2.1" id="monsterinsights-vue-frontend-js" type="module"></script>
2. Lite Version: <script src="DEMOSITE/wp-content/plugins/google-analytics-for-wordpress/lite/assets/vue/js/frontend.min.js?ver=9.2.1" id="monsterinsights-vue-frontend-js" type="module"></script>

The monsterinsights-vue-frontend script is set with the type text/javascript, likely due to the following reasons:

1. Lack of initial check for type in the script_loader_tag function: The MonsterInsights plugin might explicitly set text/javascript for all scripts if the type was not previously modified. The script_loader_tag function may trigger after the type has already been set.
2. Conflicts with wp_enqueue_script(): If the script is registered with the standard WordPress function wp_enqueue_script() or a similar method without the type="module" attribute, WordPress will automatically apply the text/javascript type.

the monsterinsights-vue-frontend script is registered in google-analytics-premium/includes/frontend/frontend.php using the wp_register_script() and wp_enqueue_script() functions:

wp_register_script( 'monsterinsights-vue-frontend', $frontend_js_url, array( 'wp-i18n' ),  monsterinsights_get_asset_version(), true );
 wp_enqueue_script( 'monsterinsights-vue-frontend' );

It’s important to note that the wp_register_script() and wp_enqueue_script() functions do not set the type attribute, so by default, WordPress adds type="text/javascript".

This second solution:

* Update script tag.
* The vue code needs type=module.
*/
public function script_loader_tag( $tag, $handle, $src ) {

    if ( ! in_array( $handle, $this->own_handles ) ) {
        return $tag;
    }

    // Check if the 'monsterinsights-vue-frontend' script is the target
    if ( 'monsterinsights-vue-frontend' === $handle ) {
    // Remove any existing type attribute
    $tag = str_replace( 'text/javascript', 'module', $tag );
    }

    // Change the script tag by adding type="module" and return it.
    $html = str_replace( '></script>', ' type="module"></script>', $tag );

    $domain = monsterinsights_is_pro_version() ? 'ga-premium' : 'ga-premium';
    $html   = monsterinsights_get_printable_translations( $domain ) . $html;

    return $html;
} 

I hope this helps the development team address this critical issue. Thank you!

Running into this as well.

+ New bug in Dashboard WordPress

Error: attribute d: Expected number, "M e -16 6 A -6 -6 …".
TypeError: t.tablePrepareColumnItems is not a function
at ReportReAuth

Hi @foxhound87, @power2009 and @marcguay,

I’ve reached out to our developer team about this and they’re investigating the issue. We appreciate you for bringing this to our attention.

In the meantime, please let us know if you have any further questions.

Thanks!

In new update 9.2.2 – is not fixed( lol…

This is own fix i do for 2min

/**
 * Update script tag.
* The vue code needs type=module.
*/
public function script_loader_tag( $tag, $handle, $src ) {

    if ( ! in_array( $handle, $this->own_handles ) ) {
        return $tag;
    }

    // Check if the 'monsterinsights-vue-frontend' script is the target
    if ( 'monsterinsights-vue-frontend' === $handle ) {
    // Remove any existing type attribute
    $tag = str_replace( 'text/javascript', 'module', $tag );
    }

    // Change the script tag by adding type="module" and return it.
    $html = str_replace( '></script>', ' type="module"></script>', $tag );

    $domain = monsterinsights_is_pro_version() ? 'ga-premium' : 'ga-premium';
    $html   = monsterinsights_get_printable_translations( $domain ) . $html;

    return $html;
} 

Hi @power2009,

I’m sorry for any confusion! This issue is still a work in progress.

I apologize for the wait, but as soon as I have another update I’ll reach out again.

Thank you.

+ new JS issues in WP Dashbord

TypeError: t.tablePrepareColumnItems is not a function
at ReportReAuth-d9fc4de3.min.js:1:38727
at c.pD as _l
at c.kt (ReportReAuth-d9fc4de3.min.js:1:38594)
at RD.e._render (vendor-b19955ae.min.js:5:22157)
at c.n (vendor-b19955ae.min.js:5:32204)
at e.get (vendor-b19955ae.min.js:5:28396)
at e.run (vendor-b19955ae.min.js:5:29133)
at Mk (vendor-b19955ae.min.js:5:34414)
at Array. (vendor-b19955ae.min.js:5:25959)
at uM (vendor-b19955ae.min.js:5:25371)
kq @ vendor-b19955ae.min.js:5

+ that when

Play.

1. Click “Screen Options”
2. Try disabling MonsterInsights
3. Error in console

vendor-b19955ae.min.js:262 Error: <path> attribute d: Expected number, "M e -16 6 A -6 -6 …".vendor-b19955ae.min.js:262 Error: <path> attribute d: Expected number, "M e -16 6 A -6 -6 …".vendor-b19955ae.min.js:262 Error: <path> attribute d: Expected number, "M e -16 6 A -6 -6 …".

The problem disappears only when we switch the widget to smaller mode. In full screen mode, the widget logs this error! I think the error is that the function that the script is looking for is missing in full mode.