stackblitz / bolt.new

Prompt, run, edit, and deploy full-stack web applications
https://bolt.new
MIT License
8.51k stars 3.26k forks source link

error creating a quasar project #1054

Open weimars70 opened 3 weeks ago

weimars70 commented 3 weeks ago

Describe the bug

trying to create vue projects with quasar framework in all of them gives me the following error

Link to the Bolt URL that caused the error

https://bolt.new/~/sb1-zzbzw8

Steps to reproduce

npm run dev

Expected behavior

I want to preview the project

Screen Recording / Screenshot

image

Platform

Browser name = Chrome
Full version = 130.0.0.0
Major version = 130
navigator.appName = Netscape
navigator.userAgent = Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36
performance.memory = {
  "totalJSHeapSize": 44116060,
  "usedJSHeapSize": 42577060,
  "jsHeapSizeLimit": 4294705152
}
Username = weimars70
Chat ID = 23c382e789f1

Additional context

No response

paladyne-io commented 3 weeks ago

I am not an expert on Bolt but I have tried using it with Quasar a few times.

One way you might like to try is opening a quasar template project from Stackblitz. This is the link shown on Quasar's site.

https://stackblitz.quasar.dev

After the template opens, click "Open in Bolt" and the quasar project should be loaded in Bolt. I tried this today and it worked.

The other way is to try to a create a project from scratch. I also tried this with mixed results. Eventually I got a project loaded but it wasn't very easy. These are the steps.

Create a simple vuejs project (with Vite)

if you get an error that the @vitejs/plugin-vue is missing then prompt Bolt to install it. This is the terminal/npm command. npm i @vitejs/plugin-vue

I also found that sometimes to get the vue project to display in the preview I had to request it to add a 'vite.config.mjs' file. (you just have to write that - you dont need more detailed instructions.)

Then prompt Bolt to install the quasar vite plugin. or add it yourself: npm i @quasar/vite-plugin (The latest version is 1.8.0.)

I think Bolt (the LLM model) doesn't know about the extra steps required to configure the vite plugin shown on Quasar's page. https://quasar.dev/start/vite-plugin/

npm install --save quasar @quasar/extras npm install --save-dev @quasar/vite-plugin sass-embedded@^1.80.2

Then customizing and replacing main.js using the configurator on the page and optionally adding the src/quasar-variables.sass file.


I hope it helps.