Alokai•2y ago

Trying to add Storefront UI in nuxt 3

in my newly created nuxt 3 project. I just added tailwindcss which works perfectly fine. Then I wanted add a UI library and opted for Storefront UI because in my work they are using so I thought it will help me get my hands dirty. I followed all the steps they have mentioned in the documentation but at the end I get following error.

 WARN  Using postcss.config.js is not supported together with Nuxt. Use options.postcss instead. You can read more in https://nuxt.com/docs/api/nuxt-config#postcss.                 7:36:41 PM


 ERROR  Pre-transform error: [postcss] Cannot read properties of null (reading '__isOptionsFunction')                                                                                7:36:42 PM

 WARN  Using postcss.config.js is not supported together with Nuxt. Use options.postcss instead. You can read more in https://nuxt.com/docs/api/nuxt-config#postcss.                 7:36:41 PM


 ERROR  Pre-transform error: [postcss] Cannot read properties of null (reading '__isOptionsFunction')                                                                                7:36:42 PM

 WARN  Using postcss.config.js is not supported together with Nuxt. Use options.postcss instead. You can read more in https://nuxt.com/docs/api/nuxt-config#postcss.                 7:36:41 PM


 ERROR  Pre-transform error: [postcss] Cannot read properties of null (reading '__isOptionsFunction')                                                                                7:36:42 PM

 WARN  Using postcss.config.js is not supported together with Nuxt. Use options.postcss instead. You can read more in https://nuxt.com/docs/api/nuxt-config#postcss.                 7:36:41 PM


 ERROR  Pre-transform error: [postcss] Cannot read properties of null (reading '__isOptionsFunction')                                                                                7:36:42 PM

I have following directory structure:

~/assets/css/tailwind.css

***nuxt.config.ts:***
export default defineNuxtConfig({
  modules: [
    '@nuxtjs/tailwindcss',
    '@storefront-ui/nuxt',
  ],
  css: [
    '@/assets/css/tailwind.css',
  ],
})

~/assets/css/tailwind.css

***nuxt.config.ts:***
export default defineNuxtConfig({
  modules: [
    '@nuxtjs/tailwindcss',
    '@storefront-ui/nuxt',
  ],
  css: [
    '@/assets/css/tailwind.css',
  ],
})

~/assets/css/tailwind.css

***nuxt.config.ts:***
export default defineNuxtConfig({
  modules: [
    '@nuxtjs/tailwindcss',
    '@storefront-ui/nuxt',
  ],
  css: [
    '@/assets/css/tailwind.css',
  ],
})

~/assets/css/tailwind.css

***nuxt.config.ts:***
export default defineNuxtConfig({
  modules: [
    '@nuxtjs/tailwindcss',
    '@storefront-ui/nuxt',
  ],
  css: [
    '@/assets/css/tailwind.css',
  ],
})

tailwind.config.ts

export default<Config> {
  content: ['./**/*.vue', './node_modules/@storefront-ui/vue/**/*.{js,mjs}'],

export default<Config> {
  content: ['./**/*.vue', './node_modules/@storefront-ui/vue/**/*.{js,mjs}'],

export default<Config> {
  content: ['./**/*.vue', './node_modules/@storefront-ui/vue/**/*.{js,mjs}'],

export default<Config> {
  content: ['./**/*.vue', './node_modules/@storefront-ui/vue/**/*.{js,mjs}'],

~/assets/css/tailwind.css

@tailwind base;
@tailwind components;
@tailwind utilities;

@tailwind base;
@tailwind components;
@tailwind utilities;

@tailwind base;
@tailwind components;
@tailwind utilities;

@tailwind base;
@tailwind components;
@tailwind utilities;

PS: I create

tailwind.config.ts

tailwind.config.ts

tailwind.config.ts

tailwind.config.ts file using

npx tailwindcss init

npx tailwindcss init

npx tailwindcss init

npx tailwindcss init

No replies yetBe the first to reply to this messageJoin

Trying to add Storefront UI in nuxt 3

Similar Threads

Similar Threads

Similar Threads