How to configure absolute imports on a react app created using Vite

absolute-imports-react-vite.js

// #######################################################################
// En jsconfig.json:
{
    "compilerOptions": {
        "baseUrl": "./src",
        "paths": {
            "@/*": ["*"]
        }
    }
}
// #######################################################################


// #######################################################################
// En consola:
npm i @vitejs/plugin-react-refresh
// #######################################################################


// #######################################################################
// En vite.config.js:
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
const path = require('path')
import reactRefresh from '@vitejs/plugin-react-refresh'

// https://vitejs.dev/config/
export default defineConfig({
  resolve: {
    alias: [{ find: '@', replacement: path.resolve(__dirname, '/src') }],
  },
  plugins: [
    react(),
    reactRefresh()
  ]
})
// #######################################################################


// #######################################################################
// Para hacer los imports de los componentes desde cualquier carpeta:
import TestComponent from '@/components/test_folder/TestComponent.jsx'
// #######################################################################