Setting alias ‘@’ on Quasar CLI with Vite

Quasar is a fantastic cross-platform Vuejs framework, you can get more details at https://quasar.dev/

Using Quasar CLI with Vite you will be in the peculiarity that you will not have the classic vite.config.js file, instead, for configuration you will have the file quasar.config.js file (more details here https://quasar.dev/quasar-cli-vite/quasar-config-file). A common problem on the forums refers to setting an alias to the src folder (I mean the classical problem: alias src to @ not working)

To solve the problem you need to edit quasar.config.js, where you will find the parameter extendViteConf, most likely commented. To point the alias ‘@’ to the src path, uncomment and make it look like below:

extendViteConf (viteConf, { isServer, isClient }) {
  Object.assign(viteConf.resolve.alias, {
    "@": path.join(__dirname, './src')
  })
}

Greetings, from my first and small article!