chakra-ui/chakra-ui-vue

FATAL defu is not a function

chwan97 opened this issue · 6 comments

chwan97 commented

When I initialized the project with Nuxt2 and selected the chakra-ui
then I got this error when I started, console show the error was in this package.

 FATAL  defu is not a function                                                                                                                   

  at ModuleContainer.module.exports (node_modules/@chakra-ui/nuxt/lib/module.js:20:32)
  at ModuleContainer.addModule (node_modules/@nuxt/core/dist/core.js:239:34)
  at node_modules/@nuxt/utils/dist/utils.js:639:43
  at async ModuleContainer.ready (node_modules/@nuxt/core/dist/core.js:55:5)
  at async Nuxt._init (node_modules/@nuxt/core/dist/core.js:478:5)


   ╭───────────────────────────────────────╮
   │                                       │
   │   ✖ Nuxt Fatal Error                  │
   │                                       │
   │   TypeError: defu is not a function   │
   │                                       │
   ╰───────────────────────────────────────╯
codebender828 commented
carwack commented

I do think this issue: #531 addresses the same issue. I do think you best install defu yourself as a dependency since it should be a peer dependency

Hope it helps 😊

chwan97 commented

I do think this issue: #531 addresses the same issue. I do think you best install defu yourself as a dependency since it should be a peer dependency

Hope it helps 😊

Thank you for your reply, I suppose defu 6.0.0 do have problem, turn @chakra-ui/nuxt 's version from ^0.6.0 to 0.5.0 solved this question.

  • 🎉1
caocuong2404 commented

Same problem with the first run.
My package JSON files:

{
  "name": "demo-nuxtjs",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "dev": "nuxt",
    "build": "nuxt build",
    "start": "nuxt start",
    "generate": "nuxt generate",
    "lint:js": "eslint --ext \".js,.ts,.vue\" --ignore-path .gitignore .",
    "lint:prettier": "prettier --check .",
    "lint": "yarn lint:js && yarn lint:prettier",
    "lintfix": "prettier --write --list-different . && yarn lint:js --fix",
    "prepare": "husky install",
    "test": "jest"
  },
  "lint-staged": {
    "*.{js,ts,vue}": "eslint --cache",
    "*.**": "prettier --check --ignore-unknown"
  },
  "dependencies": {
    "@chakra-ui/nuxt": "^0.6.0",
    "@nuxt/content": "^1.0.0",
    "@nuxtjs/axios": "^5.13.6",
    "@nuxtjs/emotion": "^0.1.0",
    "@nuxtjs/pwa": "^3.3.5",
    "core-js": "^3.25.3",
    "nuxt": "^2.15.8",
    "vue": "^2.7.10",
    "vue-server-renderer": "^2.7.10",
    "vue-template-compiler": "^2.7.10"
  },
  "devDependencies": {
    "@babel/eslint-parser": "^7.19.1",
    "@commitlint/cli": "^17.1.2",
    "@commitlint/config-conventional": "^17.1.0",
    "@nuxt/types": "^2.15.8",
    "@nuxt/typescript-build": "^2.1.0",
    "@nuxtjs/eslint-config-typescript": "^11.0.0",
    "@nuxtjs/eslint-module": "^3.1.0",
    "@vue/test-utils": "^1.3.0",
    "babel-core": "7.0.0-bridge.0",
    "babel-jest": "^29.1.2",
    "eslint": "^8.24.0",
    "eslint-config-prettier": "^8.5.0",
    "eslint-plugin-jest": "^27.0.4",
    "eslint-plugin-nuxt": "^4.0.0",
    "eslint-plugin-vue": "^9.5.1",
    "husky": "^8.0.1",
    "jest": "^29.1.2",
    "jest-environment-jsdom": "^29.1.2",
    "lint-staged": "^13.0.3",
    "prettier": "^2.7.1",
    "ts-jest": "^29.0.3",
    "vue-jest": "^3.0.4"
  }
}
masud-jatri commented

Got the same issue. It was resolved after using the correct information at .env file.