mohammadsiyou / prettier-plugin-twin.macro

Sort Tailwind and Twin classes based on recommended class order of Tailwind using Prettier.
11 stars 1 forks source link

Compatibility with prettier-plugin-sort-imports #7

Open wottpal opened 1 year ago

wottpal commented 1 year ago

Hey @mohammadsiyou, how is it going?

I do not get this plugin to work with @ianvs/prettier-plugin-sort-imports, unfortunately. This is a known issue from previous versions of the base tailwind prettier plugin, but they recently fixed compatibility. So if you might fetch in the latest changes from them this would already fix it 🤷‍♂️

Also, did you make any progress on #1?

u3u commented 1 year ago

My solution

plugins.js

const tailwindPlugin = require('prettier-plugin-twin.macro')
const sortImportsPlugin = require('@trivago/prettier-plugin-sort-imports')
const { mapValues } = require('remeda')

/** @type {import('prettier').Plugin} */
module.exports = {
  options: {
    ...sortImportsPlugin.options,
  },

  parsers: {
    ...mapValues(tailwindPlugin.parsers, (item, key) => ({
      ...item,
      preprocess: sortImportsPlugin.parsers[key].preprocess,
    })),
  },
}

prettier.config.js

/** @type {import('prettier').Config} */
module.exports = {
  importOrderSortSpecifiers: true,
  plugins: [
    require.resolve('./plugins'),
  ],
}
wottpal commented 1 year ago

@u3u awesome 🔥 worked instantly 🤩

we should join forces to resolve the other issues in this repo. especially #1 really bothers me.