nuxt-modules / tailwindcss

Tailwind CSS module for Nuxt

Home Page:https://tailwindcss.nuxtjs.org

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Logical properties are not working with Nuxt 2

basemkhirat opened this issue · comments

Version

@nuxtjs/tailwindcss: 6.9.4
nuxt: 2.17.2

The issue is exist with nuxt2 but works fine in nuxt3.

Reproduction Link

https://codesandbox.io/p/sandbox/hungry-bird-k2r8qr

Steps to reproduce

To reproduce the issue, you can generate a fresh installation of Nuxt2, then use Tailwindcss as the UI Framwork.

What is Expected?

In TailwindCSS v3, adding the class ms-10should generate the CSS rule margin-inline-start: 2.5rem

using-logical-properties

What is actually happening?

When I add the classms-10, the CSS rule margin-left: 2.5rem will be rendered!

This issue related to nuxt.

Fixed by updating nuxt.config.js

 build: {
   postcss: {
     preset: {
       stage: 3,
     },
   },
 }

nuxt/nuxt#8387

Thanks for researching into it and documenting the issue for future reference. In this case, I'm closing the issue as it's not in module scope.