skip to Main Content

When I try to build docker image get this error after run yarn build.

#0 0.496 yarn run v1.22.19                                                                                                                                                                                         
#0 0.531 $ nuxt build
#0 1.538 ℹ️ Using Tailwind CSS from ~/assets/css/tailwind.css
#0 1.543 
#0 1.543  FATAL  Cannot destructure property 'nuxt' of 'this' as it is undefined.
#0 1.543 
#0 1.543   at postcss8Module (node_modules/@nuxt/postcss8/dist/index.js:15:10)
#0 1.543   at installModule (node_modules/@nuxt/kit/dist/index.mjs:416:9)
#0 1.543   at async setup (node_modules/@nuxtjs/tailwindcss/dist/module.mjs:186:7)
#0 1.543   at async ModuleContainer.normalizedModule (node_modules/@nuxt/kit/dist/index.mjs:167:5)
#0 1.543   at async ModuleContainer.addModule (node_modules/@nuxt/core/dist/core.js:239:20)
#0 1.543   at async ModuleContainer.ready (node_modules/@nuxt/core/dist/core.js:51:7)
#0 1.543   at async Nuxt._init (node_modules/@nuxt/core/dist/core.js:478:5)
#0 1.543 
#0 1.548 
#0 1.548 ╭──────────────────────────────────────────────────────────────────────────────╮│                                                                              ││   ✖️ Nuxt Fatal Error                                                         ││                                                                              ││   TypeError: Cannot destructure property 'nuxt' of 'this' as it is           ││   undefined.                                                                 ││                                                                              │╰──────────────────────────────────────────────────────────────────────────────╯
#0 1.548 
#0 1.574 info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
#0 1.574 error Command failed with exit code 1.

Dockerfile:

FROM node:16-slim

ARG AXIOS_BASEURL

WORKDIR /usr/src/app

RUN npm install yarn

COPY package*.json ./
RUN yarn install

COPY . .

ENV NUXT_HOST=0.0.0.0

ENV AXIOS_BASEURL=https://example.com

ENV NUXT_ENV_BACKEND="TEST"

RUN yarn build

CMD yarn start

package.json:

{
  "name": "Project-Front",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "dev": "nuxt",
    "build": "nuxt build",
    "start": "nuxt start",
    "generate": "nuxt generate"
  },
  "dependencies": {
    "@nuxtjs/axios": "^5.13.6",
    "@nuxtjs/i18n": "^7.2.0",
    "cookie-universal-nuxt": "^2.1.5",
    "core-js": "^3.23.3",
    "jalali-moment": "^3.3.11",
    "nuxt": "^2.15.7",
    "v-mask": "^2.3.0",
    "vue-js-modal": "^2.0.1",
    "vue-toasted": "^1.1.28",
    "vue2-touch-events": "^3.2.2",
    "vuelidate": "^0.7.6",
    "vuex-map-fields": "^1.4.1"
  },
  "devDependencies": {
    "@nuxt/postcss8": "^1.1.3",
    "@nuxtjs/color-mode": "^2.1.1",
    "@nuxtjs/pwa": "^3.3.5",
    "@nuxtjs/tailwindcss": "^5.0.4",
    "autoprefixer": "^10.4.6",
    "postcss": "^8.4.20",
    "sass": "~1.32.6",
    "sass-loader": "10.1.1",
    "tailwindcss-dir": "^4.0.0"
  }
}

Thank you for helping me

3

Answers


  1. Chosen as BEST ANSWER

    I found a solution.

    Add it to package.json and build it again

     "resolutions": {
        "@nuxt/kit": "3.0.0-rc.13"
      }
    

  2. if you just set up the new project with Tailwind CSS, of course, it will alert an error, so the solution for me is:

    go to -> nuxt.config.js -> replace this

    '@nuxtjs/tailwindcss' 
    

    with

    '@nuxt/postcss8'.
    

    enter image description here

    Login or Signup to reply.
  3. Add this to your package.json:

    "resolutions": {
        "@nuxt/kit": "3.0.0-rc.12"
    }
    

    and re-run dev or build

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search