Vibe coding with Gemini CLI

My hobby project newsSum was using Vue 2 and I have been thinking about upgrading to Vue 3 with Composition API. I thought it would be a good idea to try out vibe coding with Gemini CLI running 2.5 pro even though it is not the best model for programming.

I used a very simple prompt:

The current folder contains a Vue 2 application. Could you upgrade it to Vue 3? update package.json for the new packages. update all code to use Vue 3 using best practice design"

I intentionally didn't specify "Composition API" as I wanted to see if it understand what the best approach for a Vue 3 application is.

A few observations:

• it struggled for a bit but able to find alternatives. e.g. it couldn't get vue-cli working and resorted to vite instead
• BootstrapVue doesn't work with Vue 3 and it automatically switched to use bootstrap-vue-3. Unfortunately, the library is deprecated and I needed to port to bootstrap-vue-next myself. Maybe giving a more detailed prompt to use a specific library may help
• it stopped when the app builds successfully. However functionally the application is broken. Mainly because inherited components work differently in Vue 3
• when I tried to ask Gemini again to fix the issue it started to hallucinate and wanted to delete files instead of fixing the issue. Ended up stopping it and fixing the code manually

Overall, I think it was a good experience. It helped to upgrade most of the packages and revising the code to use Composition API. I would say it saved me 60% of the time.