Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now
Light
Dark
System
Ask  Question

Explanatory for assets compiling Metronic 8

So I have a Laravel Metronic 8 app and I'm trying to understand how the asset compiling works. There are a lot of folders and a lot of code and directories in resources/assets:

  • core
  • demo8 (chosen demo)
  • extended

Questions:

  1. What are all these folders?
  2. Why are core and demo folders so similar?
  3. How are they being compiled exactly?

For eg. according to webpack.mix.js in line 51 it says "build Metronic css/js". What does this mean? Are these the main js assets? In line 54 it loads the following script: 

.scripts(require(./resources/assets/${demo}/js/scripts.js), public/${demo}/js/scripts.bundle.js);

But 'resources/assets/demo8/js/scripts.js' in its turn loads components from 'resources/assets/core' directory. Why is this?

Lastly, I'm asking this because I would like to use Vue, but I have no clue how to install it? I do not want to use it as a SPA, some Vue components would just come in handy for some stuff. Any pointers?

I would appreciate some actual help. Thank you.

P
Plaisir Digital 3 years ago
Laravel Vue PHP
2 Answers
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 (2)

user
Faizal Author 3 years ago

Hi,

  1. Those folders are the assets folder from the HTML version as the core. We do this way easier to update.

  2. Demo folder is a demo level folder, while the core folder assets are shared assets being used by all demos.

  3. Core and demo level assets will be combined.

style.scss and scripts.js are the demo level assets.

'resources/assets/demo8/js/scripts.js' is in the demo8 folder.

You can try to use the Inertia plugin to integrate with Vue. It has been made specifically for Laravel. https://laravel.com/docs/9.x/frontend#using-vue-react

Thanks

P
Plaisir Digital 3 years ago

I found some extra documentation, which I will read thoroughly.


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