Vite 'The following dependencies are imported but could not be resolved'

I'm trying to migrate from Symfony encore (that uses webpack under the hood) to vite and stuck with this issue

Error: The following dependencies are imported but could not be resolved:

vue (imported by /root/Gyant/vocwebmanager/web/vwm/js/app.js)

Here is my vite.config.js

import {defineConfig} from 'vite';
import path from 'path';
import symfonyPlugin from 'vite-plugin-symfony';
import vue from '@vitejs/plugin-vue';

export default defineConfig({
  plugins: [
    vue({
      template: {
        transformAssetUrls: {
          includeAbsolute: false,
          base: null,
        },
      },
    }),
    symfonyPlugin({
      viteDevServerHostname: 'localhost'
    }),
  ],
  optimizeDeps: {
    force: true,
  },
  preview: {
    port: 8080,
    strictPort: true,
  },
  server: {
    port: 8080,
    strictPort: true,
    host: '0.0.0.0',
    origin: '',
    hmr: {
      host: 'localhost'
    }
  },
  root: '/assets',
  base: '/assets',
  publicDir: false,
  resolve: {
    extensions: ['.js', '.json', '.vue', '.ts'],
    alias: {
      root: path.resolve(__dirname, './'),
    },
  },
  build: {
    emptyOutDir: false,
    sourcemap: process.env.MODE !== 'production',
    manifest: true,
    cssCodeSplit: true,
    outDir: './web/assets/',
    rollupOptions: {
      input: {
        app: path.resolve(__dirname, './web/vwm/js/app.js'),
      },
    },
  }
});

app.js

import {createApp} from 'vue';


const vm = createApp();

I tried to find any answer on the internet with no success

Issue is resolved by changing root: '/assets in vite.config.js to root: ./