The New Way to Build with AI! Introducing ReUI — the developer platform for agentic UI with shadcn/ui
Browse ReUI Pro

Best Practice: Using importExtraPlugins Instead of webpack/plugins/

Hey Metronic Community!

I am working on integrating Webpack with the Metronic template and noticed that plugins can be added in two different ways:

  1. Through importExtraPlugins() in webpack.config.js.
  2. By placing the plugin inside webpack/plugins/custom/ and importing it in plugins.js.

What is Metronic’s best practice for deciding which plugins belong in importExtraPlugins() vs. webpack/plugins/custom/?

I want to ensure that I’m following the best approach for managing plugin bundling in Webpack while keeping performance optimized.

Thank you for your guidance!

Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (1)

 
Deleted comment
 
Deleted comment

Hi Ivan Tamoni

Here's the recommended approach:

  1. Global Bundle (plugins.bundle.js)
  • Use for: Core plugins that are used throughout application on most pages
  • Single HTTP request, better caching
  • Add to resources/mix/plugins.js file
  1. Custom Plugins (in resources/mix/vendors/)
  • Use for: Page-specific or feature-specific plugins not needed globally
  • loads plugins only when needed
  • Example use cases: Charts, specific form elements, specialized UI components

Will the plugin be used on most pages of application? If YES → Add to global bundle in plugins.js If NO → Add as custom plugin in resources/mix/vendors/

Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
buy metronic keenthemes mega bundle

ReUI

Open-source React components, blocks and templates built on shadcn/ui and Tailwind CSS by Keenthemes.