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
I found a solution.
Add it to package.json and build it again
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 thiswith
Add this to your package.json:
and re-run dev or build