Rohjans
Rohjans
Explore posts from servers
NNuxtKKysely
PostsComments
NNuxt
Created by Rohjans on 4/20/2025 in #❓・help
Tailwind styles not working after migrating to NuxtUI v3
@kapa.ai Running the upgrade tool now will only result in this error: ❯ npx @tailwindcss/upgrade (node:226220) ExperimentalWarning: CommonJS module /home/raul/.nvm/versions/node/v23.1.0/lib/node_modules/npm/node_modules/debug/src/node.js is loading ES Module /home/raul/.nvm/versions/node/v23.1.0/lib/node_modules/npm/node_modules/supports-color/index.js using require(). Support for loading ES Module in require() is an experimental feature and might change at any time (Use node --trace-warnings ... to show where the warning was created) ≈ tailwindcss v4.1.4 │ Tailwind CSS v4.1.4 found. The migration tool can only be run on v3 projects.
16 replies
NNuxt
Created by Rohjans on 4/20/2025 in #❓・help
Tailwind styles not working after migrating to NuxtUI v3
@kapa.ai Here are my package.json dependecies: 
"devDependencies": {
        "@compodium/nuxt": "0.1.0-beta.9",
        "@iconify-json/heroicons": "^1.2.2",
        "@nuxt/devtools": "latest",
        "@nuxt/eslint": "^1.3.0",
        "@nuxt/icon": "^1.12.0",
        "@nuxt/ui": "^3.0.2",
        "@nuxtjs/color-mode": "^3.4.0",
        "@nuxtjs/eslint-config-typescript": "^12.1.0",
        "@nuxtjs/i18n": "9.5.3",
        "@pinia-plugin-persistedstate/nuxt": "^1.2.1",
        "@pinia/nuxt": "^0.11.0",
        "@sidebase/nuxt-auth": "^0.10.0",
        "@tailwindcss/node": "^4.1.4",
        "@tailwindcss/postcss": "^4.1.4",
        "@tailwindcss/vite": "^4.1.4",
        "@types/bcrypt": "^5.0.2",
        "@types/bun": "^1.1.2",
        "@types/formidable": "^3.4.5",
        "@types/jsonwebtoken": "^9.0.6",
        "@types/node": "^22.14.1",
        "@types/pg": "^8.11.5",
        "eslint": "^9.4.0",
        "eslint-config-prettier": "^10.1.2",
        "eslint-plugin-prettier": "^5.2.6",
        "kysely-codegen": "^0.18.0",
        "nuxt": "3.16.2",
        "prettier": "^3.3.0",
        "sass": "^1.75.0",
        "typescript": "^5.4.5"
    },
    "dependencies": {
        "@langchain/community": "^0.3.0",
        "@langchain/core": "^0.3.0",
        "@langchain/openai": "^0.5.0",
        "@vuepic/vue-datepicker": "^11.0.2",
        "bcrypt": "^5.1.1",
        "echarts": "^5.5.0",
        "formidable": "^3.5.1",
        "h3-formidable": "^1.0.0",
        "jsonwebtoken": "^9.0.2",
        "kysely": "^0.28.0",
        "langchain": "^0.3.0",
        "pg": "^8.11.5",
        "pinia": "^3.0.2",
        "tailwindcss": "^4.1.4",
        "unhead": "^2.0.8",
        "vue-echarts": "^6.7.2",
        "vuedraggable": "^4.1.0",
        "zod": "^3.24.3"
    }
"devDependencies": {
        "@compodium/nuxt": "0.1.0-beta.9",
        "@iconify-json/heroicons": "^1.2.2",
        "@nuxt/devtools": "latest",
        "@nuxt/eslint": "^1.3.0",
        "@nuxt/icon": "^1.12.0",
        "@nuxt/ui": "^3.0.2",
        "@nuxtjs/color-mode": "^3.4.0",
        "@nuxtjs/eslint-config-typescript": "^12.1.0",
        "@nuxtjs/i18n": "9.5.3",
        "@pinia-plugin-persistedstate/nuxt": "^1.2.1",
        "@pinia/nuxt": "^0.11.0",
        "@sidebase/nuxt-auth": "^0.10.0",
        "@tailwindcss/node": "^4.1.4",
        "@tailwindcss/postcss": "^4.1.4",
        "@tailwindcss/vite": "^4.1.4",
        "@types/bcrypt": "^5.0.2",
        "@types/bun": "^1.1.2",
        "@types/formidable": "^3.4.5",
        "@types/jsonwebtoken": "^9.0.6",
        "@types/node": "^22.14.1",
        "@types/pg": "^8.11.5",
        "eslint": "^9.4.0",
        "eslint-config-prettier": "^10.1.2",
        "eslint-plugin-prettier": "^5.2.6",
        "kysely-codegen": "^0.18.0",
        "nuxt": "3.16.2",
        "prettier": "^3.3.0",
        "sass": "^1.75.0",
        "typescript": "^5.4.5"
    },
    "dependencies": {
        "@langchain/community": "^0.3.0",
        "@langchain/core": "^0.3.0",
        "@langchain/openai": "^0.5.0",
        "@vuepic/vue-datepicker": "^11.0.2",
        "bcrypt": "^5.1.1",
        "echarts": "^5.5.0",
        "formidable": "^3.5.1",
        "h3-formidable": "^1.0.0",
        "jsonwebtoken": "^9.0.2",
        "kysely": "^0.28.0",
        "langchain": "^0.3.0",
        "pg": "^8.11.5",
        "pinia": "^3.0.2",
        "tailwindcss": "^4.1.4",
        "unhead": "^2.0.8",
        "vue-echarts": "^6.7.2",
        "vuedraggable": "^4.1.0",
        "zod": "^3.24.3"
    }
16 replies
NNuxt
Created by Rohjans on 6/18/2024 in #❓・help
Nuxt ENV not working in docker container
Apparently, by default, Nuxt only reads system envs that start with "NUXT_", example: "NUXT_DBHOST". So there are 2 solutions: - Change the env names in the docker compose, and add the NUXT prefix to all of them. - Configure nuxt to remove/change the prefix (https://github.com/unjs/nitro/issues/1836#issuecomment-1770116095). This can be done by adding the following to nuxt config: 
runtimeConfig: {
        nitro: {
            // Remove mandatory NUXT_ from system runtime variables
            envPrefix: '',
        },
}
runtimeConfig: {
        nitro: {
            // Remove mandatory NUXT_ from system runtime variables
            envPrefix: '',
        },
}
5 replies
NNuxt
Created by Rohjans on 6/18/2024 in #❓・help
Nuxt ENV not working in docker container
Envs in nuxt are read at build time and injected into the compiled solution. Thanks to the runtime config, it also has the capability of reading runtime system envs
5 replies
NNuxt
Created by Rohjans on 6/18/2024 in #❓・help
Nuxt ENV not working in docker container
I have solved the issue, documentation is not good at explaining this...
5 replies
NNuxt
Created by Rohjans on 6/18/2024 in #❓・help
Nuxt ENV not working in docker container
Nuxt runtime config: 
runtimeConfig: {
        JWT_SECRET: process.env.JWT_SECRET as string,
        JWT_EXPIRATION: process.env.JWT_EXPIRATION || '900',
        PASSWORD_SALT_ROUNDS: process.env.PASSWORD_SALT_ROUNDS || '10',

        DB_NAME: process.env.DB_NAME,
        DB_HOST: process.env.DB_HOST,
        DB_USER: process.env.DB_USER,
        DB_PASSWORD: process.env.DB_PASSWORD,
        DB_PORT: process.env.DB_PORT || '5432',

        MAX_TRANSACTION_FILE_SIZE: Number(
            process.env.MAX_TRANSACTION_FILE_SIZE || 1024 * 1024 * 10
        ) //10 MB
    },
runtimeConfig: {
        JWT_SECRET: process.env.JWT_SECRET as string,
        JWT_EXPIRATION: process.env.JWT_EXPIRATION || '900',
        PASSWORD_SALT_ROUNDS: process.env.PASSWORD_SALT_ROUNDS || '10',

        DB_NAME: process.env.DB_NAME,
        DB_HOST: process.env.DB_HOST,
        DB_USER: process.env.DB_USER,
        DB_PASSWORD: process.env.DB_PASSWORD,
        DB_PORT: process.env.DB_PORT || '5432',

        MAX_TRANSACTION_FILE_SIZE: Number(
            process.env.MAX_TRANSACTION_FILE_SIZE || 1024 * 1024 * 10
        ) //10 MB
    },
Use of ENV in the code: 
const { DB_NAME, DB_HOST, DB_USER, DB_PASSWORD, DB_PORT } = useRuntimeConfig()
console.log(DB_NAME, DB_HOST, DB_USER, DB_PASSWORD, DB_PORT)
const { DB_NAME, DB_HOST, DB_USER, DB_PASSWORD, DB_PORT } = useRuntimeConfig()
console.log(DB_NAME, DB_HOST, DB_USER, DB_PASSWORD, DB_PORT)
5 replies