Good theme and laravel integration
Hello, friends. Just bought Good template to implement admin panel for my website.
I use Laravel 10 framework. Laravel uses Vite out of the box for all frontend cases.
I have a problems with integration, too many files and I don't know which of files I have to use and how to use for convenient usage of template.
Do you have any guide for laravel integration. It will be usefull. Thank you.
Replies (3)
Hi,
For integrating the Good template with Laravel, consider the following steps:
Begin by copying the necessary generated assets from the Good template into your Laravel project.
Proceed with integrating the CSS files:
Copy the contents of assets/plugins/global/* into your Laravel project.
Specifically, look for plugins.bundle.css.
Copy the contents of assets/css/* into your Laravel project.
Look for styles.bundle.css.
By integrating the CSS files first, you can identify and resolve any styling issues or conflicts that may arise. Once the styling is successfully applied, you can then proceed to integrate the JavaScript part by part.
Remember to adjust the file paths in your Laravel project to match the structure of your project.
Feel free to reach out if you encounter any specific challenges during the integration process.
Thank you for the fast answer. I really appreciate this.
I’ve tried to make template integration the way you suggest.
Css import was not difficult, it’s ok.
But I’ve faced with the issue when I tried to import js files with Vite.
I’ve tried to import necessary common js files from assets (scripts.bundle.js and plugins.bundle.js). I declare importing in blade layout of the template the way as Laravel documentation recommends:
@vite(path/to/js/file)File imports successfully, but js doesn’t work (some error occured)
But if I tried to import files not via Vite:
{{asset(path/to/js/file)}}File also imports but works without errors and everything is ok.
The only difference between these approaches that compiled import code is different. In case of Vite import inside of script tag there is declared type=“module”, in second approaches this tring is absent.
I resume my issue.
How I can include necessary js files vie Vite proper way? Your advise should be valuable
Could you please try this method:
// vite.config.js
export default {
// Other configurations...
build: {
target: "es2015",
polyfillDynamicImport: false,
},
};Setting the target to 'es2015' and polyfillDynamicImport to false may help ensure proper handling of JavaScript modules.
The @vite directive should be used within a script tag. For example:
<!-- In your Blade layout -->
<script type="module">
@vite("path/to/js/file")
</script>Ensure that the @vite directive is within a script tag with type="module".
