{"id":26380,"date":"2023-01-23T10:10:55","date_gmt":"2023-01-23T15:10:55","guid":{"rendered":"https:\/\/plumrocket.com\/docs\/?p=26380"},"modified":"2023-02-13T05:45:07","modified_gmt":"2023-02-13T10:45:07","slug":"how-to-fix-javascript-errors","status":"publish","type":"post","link":"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1\/troubleshooting\/js-errors","title":{"rendered":"How to Fix JavaScript Errors in Magento 2"},"content":{"rendered":"\n<p>JS errors can often occur when incorporating JS libraries into a bundle. This is because JS libraries have specific dependencies, which can be incorrectly defined and therefore placed in the wrong order, or they may be incorrectly inserted in the bundle structure. This troubleshooting article will help you fix JS errors that occurred after creating JS bundles in the <a href=\"\/magento-page-speed-optimizer\">Magento 2 Page Speed Optimizer extension<\/a>.  <\/p>\n\n\n\n<h2 id=\"h-how-to-exclude-js-files-from-bundling\">How to Exclude JS Files from Bundling<\/h2>\n\n\n\n<p>By adding error-causing JavaScript files to the exclusion list, you will prevent them from being bundled and therefore avoid errors.<\/p>\n\n\n\n<h3 id=\"h-step-1-specify-the-js-file-path-in-the-exclusion-list\">Step 1. Specify the JS file path in the exclusion list<\/h3>\n\n\n\n<div class=\"wp-block-group pr-notice pr-notice-info\"><div class=\"wp-block-group__inner-container\">\n<p class=\"pr-notice-title\">Step-by-step guide:<\/p>\n\n\n\n<ol><li>In the main Magento menu, go to <strong>Plumrocket<\/strong> -> <strong>Google Page Speed Optimizer<\/strong>.<\/li><li>Expand the <strong>Additional Settings<\/strong> tab under the <strong>JavaScript Smart Bundling<\/strong><em> <\/em>section.<\/li><li>In the &#8220;<strong>Exclude JS Files From Bundling<\/strong>&#8221; field, specify the path to the JS files each on a new line in the correct formats described below.<\/li><li>Click <strong>Save Config<\/strong>.<\/li><\/ol>\n<\/div><\/div>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" width=\"1206\" height=\"772\" src=\"https:\/\/plumrocket.com\/docs\/wp-content\/uploads\/2023\/02\/magento-2-page-speed-optimizer-troubleshooting-js-errors-1.png\" alt=\"How to exclude JS Files from Bundling in Magento 2\" class=\"wp-image-26437\" srcset=\"https:\/\/plumrocket.com\/docs\/wp-content\/uploads\/2023\/02\/magento-2-page-speed-optimizer-troubleshooting-js-errors-1.png 1206w, https:\/\/plumrocket.com\/docs\/wp-content\/uploads\/2023\/02\/magento-2-page-speed-optimizer-troubleshooting-js-errors-1-300x192.png 300w, https:\/\/plumrocket.com\/docs\/wp-content\/uploads\/2023\/02\/magento-2-page-speed-optimizer-troubleshooting-js-errors-1-1024x655.png 1024w, https:\/\/plumrocket.com\/docs\/wp-content\/uploads\/2023\/02\/magento-2-page-speed-optimizer-troubleshooting-js-errors-1-768x492.png 768w\" sizes=\"(max-width: 1206px) 100vw, 1206px\" \/><\/figure>\n\n\n\n<h4 id=\"h-supported-formats\">Supported Formats<\/h4>\n\n\n\n<ol><li>If the JS file is from Magento and does not belong to any extension, for example: <code>https:\/\/example.com\/static\/version000000\/frontend\/Magento\/luma\/en_US\/mage\/storage.js<\/code>,<br>you should add the two following entries:<\/li><\/ol>\n\n\n\n<div class=\"wp-block-prismatic-blocks\"><div><\/div><pre><code class=\"language-bash\">mage\/storage.js\nmage\/storage.min.js<\/code><\/pre><\/div>\n\n\n\n<p>Alternatively, you may exclude all JS files from a folder by adding the following entry: <\/p>\n\n\n\n<div class=\"wp-block-prismatic-blocks\"><div><\/div><pre><code class=\"language-bash\">mage\/validation\/*<\/code><\/pre><\/div>\n\n\n\n<ol start=\"2\"><li>If the JS file belongs to the extension, for example <br><code>https:\/\/example.com\/static\/version000000\/frontend\/Magento\/luma\/en_US\/Magento_Catalog\/js\/price-box.js<\/code>, <br>then you should use the following format:<\/li><\/ol>\n\n\n\n<div class=\"wp-block-prismatic-blocks\"><div><\/div><pre><code class=\"language-bash\">Magento_Catalog::js\/price-box.js<\/code><\/pre><\/div>\n\n\n\n<h3 id=\"h-step-2-apply-changes\">Step 2. Apply Changes<\/h3>\n\n\n\n<p>Run the following commands to delete the specified JS files and regenerate bundles.<\/p>\n\n\n\n<div class=\"wp-block-prismatic-blocks\"><div><\/div><pre><code class=\"language-\">find .\/pub\/static\/frontend\/ -type f -name '*requirejs-config*.js' -delete\nbin\/magento setup:static-content:deploy<\/code><\/pre><\/div>\n","protected":false},"excerpt":{"rendered":"<p>JS errors can often occur when incorporating JS libraries into a bundle. This is because JS libraries have specific dependencies, which can be incorrectly defined and therefore placed in the wrong order, or they may be incorrectly inserted in the bundle structure. This troubleshooting article will help you fix JS errors that occurred after creating &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1\/troubleshooting\/js-errors\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;How to Fix JavaScript Errors in Magento 2&#8221;<\/span><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"_mi_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0},"categories":[370],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v17.2 (Yoast SEO v17.2) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How to Fix JavaScript Errors in Magento 2 - Plumrocket Documentation<\/title>\n<meta name=\"description\" content=\"JS errors can often occur when incorporating JS libraries into a bundle. This is because JS libraries have specific dependencies, which can be incorrectly\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1\/troubleshooting\/js-errors\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Fix JavaScript Errors in Magento 2\" \/>\n<meta property=\"og:description\" content=\"JS errors can often occur when incorporating JS libraries into a bundle. This is because JS libraries have specific dependencies, which can be incorrectly\" \/>\n<meta property=\"og:url\" content=\"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1\/troubleshooting\/js-errors\" \/>\n<meta property=\"og:site_name\" content=\"Plumrocket Documentation\" \/>\n<meta property=\"article:published_time\" content=\"2023-01-23T15:10:55+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-02-13T10:45:07+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/plumrocket.com\/docs\/wp-content\/uploads\/2023\/02\/magento-2-page-speed-optimizer-troubleshooting-js-errors-1.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Plumrocket\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"How to Fix JavaScript Errors in Magento 2 - Plumrocket Documentation","description":"JS errors can often occur when incorporating JS libraries into a bundle. This is because JS libraries have specific dependencies, which can be incorrectly","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1\/troubleshooting\/js-errors","og_locale":"en_US","og_type":"article","og_title":"How to Fix JavaScript Errors in Magento 2","og_description":"JS errors can often occur when incorporating JS libraries into a bundle. This is because JS libraries have specific dependencies, which can be incorrectly","og_url":"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1\/troubleshooting\/js-errors","og_site_name":"Plumrocket Documentation","article_published_time":"2023-01-23T15:10:55+00:00","article_modified_time":"2023-02-13T10:45:07+00:00","og_image":[{"url":"https:\/\/plumrocket.com\/docs\/wp-content\/uploads\/2023\/02\/magento-2-page-speed-optimizer-troubleshooting-js-errors-1.png"}],"twitter_card":"summary_large_image","twitter_misc":{"Written by":"Plumrocket","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebSite","@id":"https:\/\/plumrocket.com\/docs\/#website","url":"https:\/\/plumrocket.com\/docs\/","name":"Plumrocket Documentation","description":"Extensions docs, troubleshootings etc.","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/plumrocket.com\/docs\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1\/troubleshooting\/js-errors#primaryimage","inLanguage":"en-US","url":"https:\/\/plumrocket.com\/docs\/wp-content\/uploads\/2023\/02\/magento-2-page-speed-optimizer-troubleshooting-js-errors-1.png","contentUrl":"https:\/\/plumrocket.com\/docs\/wp-content\/uploads\/2023\/02\/magento-2-page-speed-optimizer-troubleshooting-js-errors-1.png","width":1206,"height":772},{"@type":"WebPage","@id":"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1\/troubleshooting\/js-errors#webpage","url":"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1\/troubleshooting\/js-errors","name":"How to Fix JavaScript Errors in Magento 2 - Plumrocket Documentation","isPartOf":{"@id":"https:\/\/plumrocket.com\/docs\/#website"},"primaryImageOfPage":{"@id":"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1\/troubleshooting\/js-errors#primaryimage"},"datePublished":"2023-01-23T15:10:55+00:00","dateModified":"2023-02-13T10:45:07+00:00","author":{"@id":"https:\/\/plumrocket.com\/docs\/#\/schema\/person\/c96fccdb89342ae6804272265723eca8"},"description":"JS errors can often occur when incorporating JS libraries into a bundle. This is because JS libraries have specific dependencies, which can be incorrectly","breadcrumb":{"@id":"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1\/troubleshooting\/js-errors#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1\/troubleshooting\/js-errors"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1\/troubleshooting\/js-errors#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Magento 2 Extensions","item":"https:\/\/plumrocket.com\/magento-extensions"},{"@type":"ListItem","position":2,"name":"Magento 2 Google Page Speed Optimizer","item":"https:\/\/plumrocket.com\/magento-page-speed-optimizer"},{"@type":"ListItem","position":3,"name":"Documentation","item":"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer"},{"@type":"ListItem","position":4,"name":"v1","item":"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1"},{"@type":"ListItem","position":5,"name":"Troubleshooting","item":"https:\/\/plumrocket.com\/docs\/magento-page-speed-optimizer\/v1\/troubleshooting"},{"@type":"ListItem","position":6,"name":"How to Fix JavaScript Errors in Magento 2"}]},{"@type":"Person","@id":"https:\/\/plumrocket.com\/docs\/#\/schema\/person\/c96fccdb89342ae6804272265723eca8","name":"Plumrocket","image":{"@type":"ImageObject","@id":"https:\/\/plumrocket.com\/docs\/#personlogo","inLanguage":"en-US","url":"https:\/\/secure.gravatar.com\/avatar\/10c44aa45aab391250913d982e552e53?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/10c44aa45aab391250913d982e552e53?s=96&d=mm&r=g","caption":"Plumrocket"}}]}},"_links":{"self":[{"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/posts\/26380"}],"collection":[{"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/comments?post=26380"}],"version-history":[{"count":13,"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/posts\/26380\/revisions"}],"predecessor-version":[{"id":26440,"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/posts\/26380\/revisions\/26440"}],"wp:attachment":[{"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/media?parent=26380"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/categories?post=26380"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/tags?post=26380"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}