Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Cannot assign to read only property 'exports' of object '#<Object>' #501

Comments

@rodrigopv
Copy link

rodrigopv commented May 21, 2021

Transpile of defu back to CommonJS breaks webpack as it doesn't support mixing different types of imports.

Had to solve it using:

-    "@nuxtjs/axios": "^5.12.5",
+    "@nuxtjs/axios": "5.13.1",

Not sure if I did roll back to the exact version that fixes the issue, but that was the last working one for the nuxt project I'm working on.

image

Might be related to #498
Please check also unjs/defu#28

@pi0
Copy link
Member

pi0 commented May 21, 2021

Can you please help to create a reproduction by forking this sandbox? That would be much help in finding the issue. Knowing exact versions of nuxt, node and axios that causes this can also be helpful.

@rodrigopv
Copy link
Author

Hi,

Unfortunately I've been unable to isolate the environment in the sandbox you sent to reproduce the bug. I've been trying a couple hours from now, importing almost all packages.

The nuxt site I'm working on it's a pretty complex project. From package-lock.json:

    "nuxt": {
      "version": "2.15.6",
    "@nuxtjs/axios": {
      "version": "5.13.4",
     "defu": {
      "version": "5.0.0",`

The project itself has 54 dependencies and I'll keep trying to make the minimum set of packages needed to trigger this bug. From what I've read, in order to trigger the error, webpack should try to make a bundle that includes different types of imports (from dependencies that use export default, module.exports and require).

@pi0
Copy link
Member

pi0 commented May 24, 2021

I see it might be sometimes hard to reproduce. Would be nice if you can try changing nuxt to nuxt-edge (potential fix nuxt/nuxt#9180) and it might be also because of different resolution strategy of npm vs yarn (sandbox and tests are based on yarn).

In either way if even nuxt-edge didn't fix the issue, would be happy having a quick call to check issue on your website. (https://calendly.com/pi0)

@rodrigopv
Copy link
Author

I finally managed to reproduce the issue 🔥

https://codesandbox.io/s/polished-haze-l8j4k

on nuxt.config.js:

    babel: {
      presets: ["@babel/preset-env"],
      plugins: [
        "@babel/plugin-proposal-class-properties",
        ["@babel/plugin-transform-runtime", { regenerator: true }]
      ]
    }

and the following packages:

  "dependencies": {
    "@nuxtjs/axios": "^5.12.5",
    "babel-runtime": "^6.26.0",
    "nuxt": "^2.0.0"
  },
  "devDependencies": {
    "@babel/core": "^7.13.1",
    "@babel/plugin-proposal-class-properties": "^7.13.0",
    "@babel/plugin-transform-runtime": "^7.13.4",
    "@babel/preset-env": "^7.12.17"
  }

I'm not really sure if this the right way to use babel, as there is also a @nuxt/babel-preset-app package (I started working on an existing codebase with this).

@rodrigopv
Copy link
Author

Forgot to comment that nuxt-edge doesn't solves this case and also both yarn and npm get into the same result

@pi0 pi0 closed this as completed in ec2eb0a May 26, 2021
@pi0
Copy link
Member

pi0 commented May 26, 2021

Hi @rodrigopv. I added a fix that solves both sandbox error and keeping ie11 compat. Can you please try v5.13.5? (updated sandbox https://codesandbox.io/s/interesting-chatelet-ewxew?file=/package.json)

@datikken
Copy link

I think we still have a problem here

@pi0
Copy link
Member

pi0 commented May 27, 2021

Hi @datikken Can you please try recreating the lockfile and latest 5.13.5 version? sandbox with latest deps seems working.

@datikken
Copy link

Thank you for fast reply, seems like I've messed with enviroment

@rodrigopv
Copy link
Author

rodrigopv commented Jun 1, 2021

Sorry for the delay in testing the new version. It seems that new release 5.13.5 makes nuxt render the page properly, but now when visiting the page after npm run dev, the following error appears on chrome console:

image

Please note that:

  • I ran npm update and indeed I'm running version 5.13.5
  • from package-lock.json:
    "@nuxtjs/axios": {
      "version": "5.13.5",
      "resolved": "https://registry.npmjs.org/@nuxtjs/axios/-/axios-5.13.5.tgz",
      "integrity": "sha512-GyeuiseDCwfRGDQH/gK+lngCseZS3SQm3q6xqiVx5xQnzCqokojN3uJkNB0DdHCowBP1aim+mDhu3spzcCnyBg==",
      "requires": {
        "@nuxtjs/proxy": "^2.1.0",
        "axios": "^0.21.1",
        "axios-retry": "^3.1.9",
        "consola": "^2.15.3",
        "defu": "^5.0.0"
      },
  • Tried deleting both node_modules and .nuxt to avoid some inconsistency issue
  • Tried switching between node 12 and 14 just in case
  • At nuxt dev output it just shows this now:
"export 'default' (imported as 'defu') was not found in 'defu'                                friendly-errors 16:23:18

Also seen on Chrome console:

[HMR] bundle 'client' has 1 warnings
client.js?1b93:196 ./.nuxt/axios.js 73:31-35"export 'default' (imported as 'defu') was not found in 'defu'

This is happening on the same project that uses babel transpile for some reason (I think we should get rid of IE11 anyway).

@andorfermichael
Copy link

andorfermichael commented Jul 8, 2021

I have the same issue.

It happened to me after doing yarn add --dev jest @nuxt/test-utils

@andorfermichael
Copy link

andorfermichael commented Jul 8, 2021

adding defu to package json (like in the sandbox example) solved the issue for me

@datikken
Copy link

@rodrigopv I've switched to @nuxt/http in that project, but I think it's still an issue

This was referenced Sep 14, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment