New Metronic Docs!Added Integration Docs with Starter Kits Apps for Laravel, Laravel Livewire, Angular, Vue, Symfony, Blazor Server, Django & Flask & more
Browse Docs

Upgrade from 8.1.9 to 8.3.1


I download the latest metronic 8.3.1 for laravel, I notice some function is missing
e.g this is 8.1.9, they have config/menu.php

https://preview.keenthemes.com/metronic8/laravel/documentation/getting-started/changelog?demo=demo1

and latest documentation, a lot CRUD, helper and function is missing?
https://preview.keenthemes.com/laravel/metronic/docs/index

Should I use 8.1.9 version slowly upgrade patch, or do you have one for full version of 8.3.1.
I am confuse for it


2. I tried use 8.3.1, and use npm install, the login page, validation will run 2 times, e.g Email is required. show tried. but if I use your zip public/assets/ version it is working fine.
There is no clear what version I need to use to build


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 (5)


Hi

Sorry for the delay in response. This 2 versions have breaking changes. The config/menu.php file doesn't exist in this version. Instead, the menu is structured differently:

1. Menu Location: The menu is defined in Blade templates at:
resources/views/layout/partials/sidebar-layout/sidebar/_menu.blade.php

2. Menu Structure: The menu uses Laravel's route-based approach with:
- Direct Blade template rendering
- Route-based active states (request()->routeIs())
- Icon helper functions (getIcon())

3. Configuration: Menu configuration is handled through:
- Bootstrap classes in app/Core/Bootstrap/BootstrapDefault.php
- Theme configuration in app/Core/Theme.php

Second issue, this is seems to be caused by conflicting JavaScript files during the build process. Here's the solution:

1. Check for duplicate script includes:
- The build process uses Laravel Mix (see webpack.mix.js)
- Check you're not including both compiled and source files

2. Clear build cache:

npm cache clean --force
rm -rf node_modules package-lock.json
rm -rf public/assets/*
npm install
npm run dev


3. Check for validation script conflicts:
- Look for duplicate jQuery validation includes
- Check only one validation library is active
- Check if both public/assets/ and source files are being loaded



Hi Faizal,

I use your method

npm cache clean --force
rm -rf node_modules package-lock.json
rm -rf public/assets/*
npm install
npm run dev

does not work, it also happen to 8.3.1 laravel package, you can try and check, download your zip, run above command, only happen in login page.
<img>https://i.imgur.com/5FxDg2V.png</img>
I found out it is because
/starterkit/resources/_keenthemes/src/js/components/util.js:1580
document.addEventListener('livewire:navigated', callback);

I debug in the login page, when I remove email, and move to next textbox, it show 2 error, because in sign-in/general.js the init function call twice

// Public functions
return {
// Initialization
init: function () {
...
}


I am not sure it only affected sign-in or other page also will issue, please help to fix the bug.
Thanks



If I want to add own custom css, where should I add to? and it allow to compile together with `npm run prod` or `npm run dev`
e.g
```
.my-class-red{
color:red;
}
```



Hi

Recommended locations to add your custom CSS in the Laravel Metronic v8 project.

Primary Location (Recommended): Create a custom SCSS file in the components directory: resources/_keenthemes/src/metronic/demo1/sass/components/_custom.scss

Then add your custom styles:

Add this import to resources/_keenthemes/src/metronic/demo1/sass/components/components.scss at the end:

@import "custom";


Alternative Location: You can also add custom styles to the existing override file:
resources/_keenthemes/src/metronic/demo1/sass/components/_variables.override.scss

The webpack.mix.js file compiles the main SCSS from resources/_keenthemes/src/metronic/demo1/sass/style.scss
This file imports components/components.scss which includes all component styles
Your custom CSS will be automatically compiled when you run:
- npm run dev (development with source maps)
- npm run prod (production build, minified)



Can anyone explain it? I am stuck at here didn't find much information about the version change. is it normal 8.3.1 or I missing something?


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  :(