Giter Site home page Giter Site logo

Transpile nuxt2 module about ofetch HOT 14 CLOSED

unjs avatar unjs commented on August 16, 2024
Transpile nuxt2 module

from ofetch.

Comments (14)

danielroe avatar danielroe commented on August 16, 2024 1

I am reluctant to dispense such unlimited agreement 😜

But I don't believe webpack 5 has this issue.

from ofetch.

danielroe avatar danielroe commented on August 16, 2024

Perhaps try adding ohmyfetch to the transpile array as well?

from ofetch.

maartenvanhunsel avatar maartenvanhunsel commented on August 16, 2024

@danielroe Doesn't seem to work

build.transpile: ['ohmyfetch', 'destr', 'ufo', '@maartenvanhunsel/nuxt-statamic'],
"ohmyfetch": "^0.4.15",

log.md

from ofetch.

BrandonlinU avatar BrandonlinU commented on August 16, 2024

I have the same problem months ago, when I found ohmyfetch, and the error was because the particular import of Webpack in Nuxt2: The ohmyfetch package expose 4 types of bundles depending of the import mode (if it was from a ES module or a CJS module) and the environment (if it was for Node or for the browser), but I don't know why Webpack or Nuxt can't understand the dynamic import of the module. If you want to import ohmyfetch in a module for Nuxt2 you need to split your imports in 2 plugins: one that imports the CJS file directly and one server plugin that imports the polyfills needed for Node (just like in the @nuxt/http) module.

from ofetch.

joffreyBerrier avatar joffreyBerrier commented on August 16, 2024

Hi @BrandonlinU do you have an example of that :D ?

from ofetch.

danielroe avatar danielroe commented on August 16, 2024

What is your node version?

from ofetch.

joffreyBerrier avatar joffreyBerrier commented on August 16, 2024

Hi @danielroe
node version : 16.15.1

I have tried with the last one : 16.17.0 same error

There is my plugin api file : https://gist.github.com/joffreyBerrier/cd5c8c0a4fd7fa1db78fbcb442098269

Error when i have added ohmyfetch on nuxt.config.js

  • transpile: ['vee-validate/dist/rules', 'ohmyfetch'],

Capture d’écran, le 2022-09-14 aΜ€ 19 21 30

Without :
Capture d’écran, le 2022-09-14 aΜ€ 19 22 45

Thx

from ofetch.

joffreyBerrier avatar joffreyBerrier commented on August 16, 2024

Any idea @danielroe ? :)

from ofetch.

danielroe avatar danielroe commented on August 16, 2024

It's hard to say without a minimal reproduction.

from ofetch.

joffreyBerrier avatar joffreyBerrier commented on August 16, 2024

Hi @danielroe there is an example πŸ™
https://github.com/joffreyBerrier/nuxt-ohmyfetch

from ofetch.

danielroe avatar danielroe commented on August 16, 2024

I'm afraid this is a known bug in webpack 4 which was resolved in webpack 5.

You can work around it like this, as we do in Bridge:

https://stackblitz.com/edit/github-vtace5?file=nuxt.config.js

https://github.com/nuxt/bridge/blob/2dfed6aa69a60999d581d4d0ec71ea80bc478e51/src/app.ts#L89-L102

from ofetch.

joffreyBerrier avatar joffreyBerrier commented on August 16, 2024

OMG thanks a lot @danielroe you are a King ! πŸ‘‘
Do we agree that I can push my app in production without problem with webpack 5 ?

from ofetch.

joffreyBerrier avatar joffreyBerrier commented on August 16, 2024

Thx a lot πŸ™

from ofetch.

NozomuIkuta avatar NozomuIkuta commented on August 16, 2024

Since there is a workaround for the issue, I will close this issue for now.
Please reopen it as needed.

from ofetch.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.