Vue & Vite: lodash modules have no default

[HerrHansen]

Setup vue: "^3.2.25" with vite

1. I installed "vue-agile": "^2.0.0" via npm i vue-agile
2. I initialized it in main.js
3. I get fatal error in console, app won't load

Error in console

settings.js:5 Uncaught SyntaxError: The requested module '/node_modules/lodash.orderby/index.js?v=e65522c4' does not provide an export named 'default'

Initialization in main.js

//main.js
... other imports
import VueAgile from 'vue-agile';

const app = createApp({
  setup() {
    provide(DefaultApolloClient, apolloClient);
  },
  render: () => h(App),
});

app.use(VueAgile);

Expected behavior A running app.

Screenshots If applicable, add screenshots to help explain your problem.

Solution It is a vite issue.

Found a solution here: https://github.com/nuxt/vite/issues/56

// vite.config.js
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import path from 'path';

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  server: {
    port: 3001,
  },
  optimizeDeps: {
    include: [
      'lodash.throttle' // if it is inlcuded here, error is gone 🐓
    ]
  },
  ...
});

[fritzdultimate]

It doesn't solve my problem, still showing the errors above

[dllsystem]

this way it worked for me

optimizeDeps: { include: [ 'lodash.throttle', 'lodash.orderby' ] },

[semer-11]

this way it worked for me

optimizeDeps: { include: [ 'lodash.throttle', 'lodash.orderby' ] },

It did solve the problem