quasar/app-vite has problem with (some) CJS module resolution

[fprijate]

I have some quite big app which works well with webpack.
After switching to vite there are some strange runtime errors.
My app has some files that use EMS and CJS files/modules (in some *.js files I use import and require and then module.exports at the end)

App is built without any error.
But at runtime there are errors like:
vue-router.esm-bundler.js:3302 Error: Cannot find module '../components/gridDefs/dispozicije'

After changing 👍

/*
const {
  title,
  axiosPath,
  order,
  columns,
  shortColumns,
} = require("../components/gridDefs/klijenti.js");
*/

import {
  title,
  axiosPath,
  order,
  columns,
  shortColumns,
} from "../components/gridDefs/klijenti.js";

and module.export to export in klijenti.js, it works again.

I have the problem only with my modules (not with all and not with npm modules)
Problem is, that I can't convert all to ESM.

Another problem is that I have node_modules in two layers.

node_modules     /* common modules */
    app1
        node_modules    /* local modules */
   app2
        node_modules    /* local modules */

For some common modules (not all) there is build error.

After flattening (moving common modules to local), everything works again

[rstoenescu]

This is the nature of Vite itself. It doesn't do AST analysis (one of the reasons it's so fast), so mixing ESM with CJS doesn't plays well. In any case, it's outside of our reach. If you really can't transform CJS to ESM, then maybe you're better off with q/app-webpack. Or maybe there is a Vite plugin to handle this (albeit doing it will have a perf penalty for sure).