Element Plus Nuxt plugin does not work in a layer

I opened an issue there (https://github.com/element-plus/element-plus-nuxt/issues/161), but I would like to ask it here too to make sure.
The plugin works as expected when you use in a standalone Nuxt project, but once it is in a Nuxt layer (instead of installing/using in the root), we aren't able to overwrite the styles by using

additionalData

additionalData

and neither use any other file there.
I created a reproduction repo here: https://github.com/lkjimy/element-plus-nuxt-issue
(It uses NPM workspaces. Run

npm i

npm i

npm run dev

npm run dev

in the root dir)

export default defineNuxtConfig({
  devtools: { enabled: true },

  modules: ['@element-plus/nuxt'],

  elementPlus: {
    importStyle: 'scss',
    themes: ['dark']
  },

  css: ['#layers/ui/assets/scss/main.scss'],

  vite: {
    css: {
      preprocessorOptions: {
        scss: {
          api: 'modern-compiler',

          // TRY ANY SCSS FILE FROM ASSETS/SCSS HERE:
          additionalData: `@use "#layers/ui/assets/scss/_element-plus.scss" as element;`,
          // ALWAYS RESULTS IN AN ERROR...
          // ERROR  Pre-transform error: [sass] Module loop: this module is already being loaded.
        }
      }
    }
  },
})

export default defineNuxtConfig({
  devtools: { enabled: true },

  modules: ['@element-plus/nuxt'],

  elementPlus: {
    importStyle: 'scss',
    themes: ['dark']
  },

  css: ['#layers/ui/assets/scss/main.scss'],

  vite: {
    css: {
      preprocessorOptions: {
        scss: {
          api: 'modern-compiler',

          // TRY ANY SCSS FILE FROM ASSETS/SCSS HERE:
          additionalData: `@use "#layers/ui/assets/scss/_element-plus.scss" as element;`,
          // ALWAYS RESULTS IN AN ERROR...
          // ERROR  Pre-transform error: [sass] Module loop: this module is already being loaded.
        }
      }
    }
  },
})

Any scss file added to the

additionalData

additionalData

key will result in this error, even if it is empty

ERROR  Pre-transform error: [sass] Module loop: this module is already being loaded.

ERROR  Pre-transform error: [sass] Module loop: this module is already being loaded.

If someone from the Nuxt team could help me on this, I'd appreciate it.

GitHub

element-plus/element-plus-nuxt

Element Plus module for Nuxt. Contribute to element-plus/element-plus-nuxt development by creating an account on GitHub.

GitHub

GitHub - lkjimy/element-plus-nuxt-issue

Contribute to lkjimy/element-plus-nuxt-issue development by creating an account on GitHub.

Element Plus Nuxt plugin does not work in a layer

Similar Threads