Vite chrome-ext issue

My stack react, vite, ts. The only thing is, I changed the manifest a little bit. I need react (other scripts) to load as soon as I click on an extension, i.e. when I click on an extension the react app should appear.

//vite.config.ts
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react-swc';
import svgr from 'vite-plugin-svgr';
import { TanStackRouterVite } from '@tanstack/router-plugin/vite';

export default defineConfig({
  plugins: [react(), svgr(), TanStackRouterVite()],
  server: {
    watch: {
      usePolling: true,
    },
    host: true,
    strictPort: true,
    port: 3001,
  },
  build: {
    rollupOptions: {
      input: {
        content: 'src/content.tsx',
        background: 'src/background.ts',
      },
      output: {
        entryFileNames: 'assets/[name].js',
        assetFileNames: 'assets/[name].[ext]',
      },
    },
    outDir: 'dist',
    emptyOutDir: true,
    assetsDir: '.',
    sourcemap: false,
  },
});

// manifest.json
{
  "manifest_version": 3,
  "name": "Test",
  "version": "1.0",
  "action": { "default_icon": {} },
  "permissions": ["activeTab", "scripting"],
  "background": {
    "service_worker": "assets/background.js"
  },
  "icons": {
    "16": "favicon-16x16.png",
    "32": "favicon-32x32.png",
    "48": "icon-48x48.png",
    "128": "icon-128x128.png"
  },
  "web_accessible_resources": [
    {
      "resources": [
        "assets/content.css",
        "favicon-16x16.png",
        "favicon-32x32.png",
        "icon-48x48.png",
        "icon-128x128.png"
      ],
      "matches": []
    }
  ]
}

//background.ts
chrome.action.onClicked.addListener((tab) => {
  if (!tab.id) return;

  chrome.scripting.executeScript({
    target: { tabId: tab.id },
    files: ['assets/content.js'],
  });
});

I want to make a build for chrome extension, but the browser writes error(s) – Uncaught SyntaxError: Unexpected token ‘export’. It’s like it’s not transpiling the code correctly, I don’t know