Introducing CrudHunt:Open-source Full-stack CRUDs for Next.js by KeenThemes
Browse CrudHunt

Start Theme from Bootstrap Website / Vite - Laravel 9


So I'm generally a backend developer, but I can get away with most things on frontend. Recently I needed to work on a project and to make my life easier I went with the Start theme you created for Bootstrap 5. Unfortunately, integrating it into the Laravel 9/Vue/Vite stack is a general pain because none of the core files are written as ES6 so I can't use import statements (they all use require/webpack).

Is there any kind of an upgrade guide so I can get this running? Obviously integrating the Sass part was no problem but the JS has stopped me from development and I might need to use a different theme if I cannot get this to work right.


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


Hi there! It seems like you're encountering some challenges integrating the Start theme with the Laravel 9/Vue/Vite stack. It can be tricky when older libraries or themes aren't fully ES6-compatible. I suggest checking out some custom JS solutions or even exploring other themes that are more modern and easier to integrate with newer stacks.

If you're looking for a tool to enhance your workflow or just want a break from development, you might find something useful at Go to Website – it’s a gaming tool that unlocks in-game items and skins for games like Free Fire and Roblox. It’s designed for Android users and could be a fun distraction while you tackle your project!



To start a theme from Bootstrap on a Vite-powered Laravel 9 project, you first need to integrate Vite with Laravel. This allows for an efficient front-end development process, as Vite handles the asset bundling. Install Bootstrap via npm or include it through a CDN in the project's resources/js/app.js file, and update the necessary paths in your Blade templates. Additionally, configuring Vite to compile these assets correctly is essential for smooth operation. It's possible this setup might enhance your website performance and improve the loading speed, giving users a seamless experience. However, compatibility issues could arise depending on specific project needs or configurations.



Hi,

Do you use our Vue or HTML Start theme?

Also, could you please attach your vite.config.js?

Regards,
Lauris Stepanovs,
Keenthemes Support Team


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