@youthfulhps/prettier-plugin-tailwindcss-normalizer 0.3.7 → 0.3.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/README.md +29 -7
  2. package/dist/index.d.ts +7 -3
  3. package/dist/index.js +22 -33
  4. package/package.json +1 -1
package/README.md CHANGED
@@ -45,7 +45,7 @@ Add the plugin to your Prettier configuration:
45
45
 
46
46
  ```javascript
47
47
  module.exports = {
48
- plugins: ['@youthfulhps/prettier-plugin-tailwindcss-normalizer'],
48
+ plugins: ["@youthfulhps/prettier-plugin-tailwindcss-normalizer"],
49
49
  };
50
50
  ```
51
51
 
@@ -59,15 +59,39 @@ npx prettier --write .
59
59
  npx prettier --write src/**/*.{tsx,jsx,html,vue}
60
60
  ```
61
61
 
62
+ ## 🔗 Using with Other Prettier Tailwind Plugins
63
+
64
+ To use this plugin alongside other prettier tailwind plugins, you need to install and configure `prettier-plugin-merge`.
65
+
66
+ ### Installation
67
+
68
+ ```bash
69
+ npm install --save-dev prettier-plugin-merge
70
+ ```
71
+
72
+ ### Configuration
73
+
74
+ In your `.prettierrc.js` file, add `prettier-plugin-merge` as the last item in the plugins array:
75
+
76
+ ```javascript
77
+ module.exports = {
78
+ plugins: [
79
+ "@youthfulhps/prettier-plugin-tailwindcss-normalizer",
80
+ "prettier-plugin-tailwindcss",
81
+ "prettier-plugin-merge",
82
+ ],
83
+ };
84
+ ```
85
+
86
+ > **Note**: `prettier-plugin-merge` is a plugin that enables multiple prettier plugins to work together. When using with other tailwind-related plugins, it should always be placed last in the plugins array.
87
+
62
88
  ## 🎯 Examples
63
89
 
64
90
  ### Before
65
91
 
66
92
  ```jsx
67
93
  <div className="p-[16px] m-[8px] bg-blue-500">
68
- <span className="px-[24px] py-[12px] rounded-[6px]">
69
- Button
70
- </span>
94
+ <span className="px-[24px] py-[12px] rounded-[6px]">Button</span>
71
95
  </div>
72
96
  ```
73
97
 
@@ -75,9 +99,7 @@ npx prettier --write src/**/*.{tsx,jsx,html,vue}
75
99
 
76
100
  ```jsx
77
101
  <div className="p-4 m-2 bg-blue-500">
78
- <span className="px-6 py-3 rounded-md">
79
- Button
80
- </span>
102
+ <span className="px-6 py-3 rounded-md">Button</span>
81
103
  </div>
82
104
  ```
83
105
 
package/dist/index.d.ts CHANGED
@@ -1,3 +1,7 @@
1
- import { CompatPlugin } from "./types/prettier-compat";
2
- declare const plugin: CompatPlugin;
3
- export default plugin;
1
+ import { CompatParser } from "./types/prettier-compat";
2
+ declare const parsers: Record<string, CompatParser>, languages: {
3
+ name: string;
4
+ parsers: string[];
5
+ extensions: string[];
6
+ }[] | undefined;
7
+ export { parsers, languages };
package/dist/index.js CHANGED
@@ -1,5 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.languages = exports.parsers = void 0;
3
4
  const ast_transformer_1 = require("./ast-transformer");
4
5
  const version_utils_1 = require("./utils/version-utils");
5
6
  function createParser(parserName, fileType) {
@@ -35,45 +36,33 @@ const plugin = {
35
36
  },
36
37
  {
37
38
  name: "TypeScript",
38
- parsers: ["babel-ts"],
39
+ parsers: ["typescript"],
39
40
  extensions: [".ts", ".tsx"],
40
41
  },
41
42
  ],
42
43
  parsers: {
43
- html: createParser("html", "html"),
44
- vue: createParser("html", "vue"),
45
- angular: createParser("angular", "html"),
44
+ html: {
45
+ ...createParser("html", "html"),
46
+ astFormat: "html",
47
+ },
48
+ vue: {
49
+ ...createParser("html", "vue"),
50
+ astFormat: "vue",
51
+ },
52
+ angular: {
53
+ ...createParser("angular", "html"),
54
+ astFormat: "html",
55
+ },
46
56
  babel: {
47
- ...createParser("babel", "jsx"),
48
- parse: (text, options) => {
49
- const filepath = options.filepath || "";
50
- if (filepath.endsWith(".jsx") || filepath.endsWith(".tsx")) {
51
- const transformedText = (0, ast_transformer_1.transformByFileType)(text, filepath);
52
- const baseParser = (0, version_utils_1.safeLoadParser)("babel");
53
- return baseParser.parse
54
- ? baseParser.parse(transformedText, options)
55
- : text;
56
- }
57
- const baseParser = (0, version_utils_1.safeLoadParser)("babel");
58
- return baseParser.parse ? baseParser.parse(text, options) : text;
59
- },
57
+ ...createParser("babel", "babel"),
58
+ astFormat: "estree",
60
59
  },
61
- "babel-ts": {
62
- ...createParser("babel", "tsx"),
63
- parse: (text, options) => {
64
- const filepath = options.filepath || "";
65
- if (filepath.endsWith(".tsx")) {
66
- const transformedText = (0, ast_transformer_1.transformByFileType)(text, filepath);
67
- const baseParser = (0, version_utils_1.safeLoadParser)("babel", "babel-ts");
68
- return baseParser.parse
69
- ? baseParser.parse(transformedText, options)
70
- : text;
71
- }
72
- const baseParser = (0, version_utils_1.safeLoadParser)("babel", "babel-ts");
73
- return baseParser.parse ? baseParser.parse(text, options) : text;
74
- },
60
+ typescript: {
61
+ ...createParser("typescript", "typescript"),
62
+ astFormat: "estree",
75
63
  },
76
64
  },
77
65
  };
78
- module.exports = plugin;
79
- exports.default = plugin;
66
+ const { parsers, languages } = plugin;
67
+ exports.parsers = parsers;
68
+ exports.languages = languages;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@youthfulhps/prettier-plugin-tailwindcss-normalizer",
3
- "version": "0.3.7",
3
+ "version": "0.3.10",
4
4
  "description": "A Prettier plugin that normalizes Tailwind CSS arbitrary values into standard utility classes.",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",