Cannot resolve vue extension in node_modules

[NicoleKuong]

Hi,

I am using Nuxt 3 and vite for my project. I got an error during the build stage as Vite does not omit vue extension in node_modules:

ERROR [nuxt] [request error] [unhandled] [500] Unknown file extension ".vue" for all the components files like ChallengeV2, ChallengeV3, Checkbox

Has anyone encountered this before and knows how to resolve it?

Thanks

[kost1k]

nuxt: ^3.5.2 vue-recaptcha: 3.0.0-alpha.5

Faced a similar problem, only I don't have errors at the build stage, but I get 500 already on the site.

Unknown file extension ".vue" for /var/task/node_modules/vue-recaptcha/dist/components/ChallengeV2.vue

Found a similar problem on stackoverflow.
Also found a discussion in the Vite repository.

No answer anywhere(

It seems that the problem is solved only by fixing the imports inside the library, you cannot influence this from the vite config.

[GuillaumeDgr]

Hi, I have the same problem when running 'yarn generate' for my project. Any news about solving this issue pls ?

Many thanks in advance!

[RomanGovor]

I have a similar problem when importing in tests

[DanSnow]

Hey @NicoleKuong @kost1k @GuillaumeDgr @RomanGovor, could you please provide a reproducible example?

[GuillaumeDgr]

Hi, no pb, pls find below my configuration and integration of vue-recaptcha:

• package.json

  "devDependencies": {
  ...,
  "nuxt": "^3.4.2",
  ...,
  },
  "dependencies": {
  ...,
  "vue-recaptcha": "^3.0.0-alpha.5"
  ...,
  }

• nuxt.config.js

  modules: [
  ...
  "vue-recaptcha/nuxt",
  ...
  ],
  runtimeConfig: {
  public: {
    recaptcha: {
      v2SiteKey: "*****",
      v3SiteKey: "*****", // I'm using only V2 but I try to add/delete (according to some SO comments) this line without no effect
    },
  },
  },

  • page.vue

    
    <template>
    ...
    <div ref="root" class="hidden invisible" />
    ...
    </template>

  Githubissues.
• Githubissues is a development platform for aggregating issues.