Rohjans
Rohjans
Explore posts from servers
NNuxt
Created by Rohjans on 4/29/2025 in #❓・help
Nuxt UI 3 Dynamic Icons
@kapa.ai I get the feeling its because I am using HeroIcons instead of the new shiny lucide icons. What config must I have in my nuxt config?
17 replies
NNuxt
Created by Rohjans on 4/29/2025 in #❓・help
Nuxt UI 3 Dynamic Icons
@kapa.ai Still doesn't work, any more suggestions?
17 replies
NNuxt
Created by Rohjans on 4/29/2025 in #❓・help
Nuxt UI 3 Dynamic Icons
@kapa.ai It shouldn't have anything to do with tailwind, I have added this to my nuxt.config
icon: {
serverBundle: {
collections: ['heroicons'],
},
provider: 'server'
},
icon: {
serverBundle: {
collections: ['heroicons'],
},
provider: 'server'
},
17 replies
NNuxt
Created by Rohjans on 4/20/2025 in #❓・help
Tailwind styles not working after migrating to NuxtUI v3
I have solved the issue, apparently you must use a .css file to import NuxtUI and TailwindCSS, this doesn't work on scss. I have also removed all the tailwind dependencies
18 replies
NNuxt
Created by Rohjans on 4/20/2025 in #❓・help
Tailwind styles not working after migrating to NuxtUI v3
Thank you for the reply! I'm using bun is that still needed?
18 replies
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.
18 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"
}
18 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