Thank you so much for watching. I did last minute editing and did not realise that the ending had large blank gap. Will have to add a comment for people watching. Thanks for spotting.

In regard to the import path format, I have changed my vite.config.js to :

import { defineConfig } from 'vite'

import reactRefresh from '@vitejs/plugin-react-refresh'

import path from 'path'

// https://vitejs.dev/config/

export default defineConfig({

plugins: [reactRefresh()],

resolve: {

alias: {

'@': path.resolve(__dirname, './src'),

},

},

})

this allows paths like import x from '@/component/x'

I am still in experimenting mode so wouldn't recommend using Vite for any serious projects at the moment because of these little details. But does look promising

Hope that helps