unplugin-tailwindcss-mangle 0.0.3 → 0.0.5
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.
- package/README.md +23 -1
- package/dist/classGenerator.d.ts +6 -6
- package/dist/css/plugins.d.ts +2 -2
- package/dist/index.js +34 -22
- package/dist/index.mjs +34 -22
- package/dist/js/index.d.ts +3 -0
- package/dist/types.d.ts +7 -6
- package/dist/utils.d.ts +2 -2
- package/package.json +4 -2
package/README.md
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
mangle tailwindcss utilities plugin
|
|
4
4
|
|
|
5
|
-
> Now Support `vite` and `webpack`
|
|
5
|
+
> Now Support `vite` and `webpack`(Experiment!)
|
|
6
6
|
|
|
7
7
|
- [unplugin-tailwindcss-mangle](#unplugin-tailwindcss-mangle)
|
|
8
8
|
- [Features](#features)
|
|
@@ -13,6 +13,8 @@ mangle tailwindcss utilities plugin
|
|
|
13
13
|
- [4. register this plugin](#4-register-this-plugin)
|
|
14
14
|
- [vite](#vite)
|
|
15
15
|
- [webpack](#webpack)
|
|
16
|
+
- [Options](#options)
|
|
17
|
+
- [classGenerator](#classgenerator)
|
|
16
18
|
- [Notice](#notice)
|
|
17
19
|
|
|
18
20
|
## Features
|
|
@@ -74,6 +76,8 @@ You will see all class was renamed to `tw-*`
|
|
|
74
76
|
|
|
75
77
|
#### webpack
|
|
76
78
|
|
|
79
|
+
> Experiment, not work right now
|
|
80
|
+
|
|
77
81
|
```js
|
|
78
82
|
// esm
|
|
79
83
|
import { webpackPlugin as utwm } from 'unplugin-tailwindcss-mangle'
|
|
@@ -83,6 +87,24 @@ const { webpackPlugin: utwm } = require('unplugin-tailwindcss-mangle')
|
|
|
83
87
|
utwm()
|
|
84
88
|
```
|
|
85
89
|
|
|
90
|
+
## Options
|
|
91
|
+
|
|
92
|
+
### classGenerator
|
|
93
|
+
|
|
94
|
+
custom class generator, if you want to custom class name (default 'tw-*'), use this options
|
|
95
|
+
|
|
96
|
+
```js
|
|
97
|
+
export interface IClassGeneratorOptions {
|
|
98
|
+
reserveClassName?: (string | RegExp)[]
|
|
99
|
+
customGenerate?: (original: string, opts: IClassGeneratorOptions, context: Record<string, any>) => string | undefined
|
|
100
|
+
log?: boolean
|
|
101
|
+
exclude?: (string | RegExp)[]
|
|
102
|
+
include?: (string | RegExp)[]
|
|
103
|
+
ignoreClass?: (string | RegExp)[]
|
|
104
|
+
classPrefix?: string
|
|
105
|
+
}
|
|
106
|
+
```
|
|
107
|
+
|
|
86
108
|
## Notice
|
|
87
109
|
|
|
88
110
|
This plugin only transform those classes which name contain `-` or `:`, like `w-32`, `before:h-[300px]`,`after:dark:via-[#0141ff]/40`. some classes like `flex`,`relative` will not be mangled.
|
package/dist/classGenerator.d.ts
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { IClassGeneratorOptions, IClassGeneratorContextItem, IClassGenerator } from './types';
|
|
2
2
|
declare class ClassGenerator implements IClassGenerator {
|
|
3
|
-
newClassMap: Record<string,
|
|
3
|
+
newClassMap: Record<string, IClassGeneratorContextItem>;
|
|
4
4
|
newClassSize: number;
|
|
5
5
|
context: Record<string, any>;
|
|
6
|
-
opts:
|
|
6
|
+
opts: IClassGeneratorOptions;
|
|
7
7
|
classPrefix: string;
|
|
8
|
-
constructor(opts?:
|
|
9
|
-
|
|
8
|
+
constructor(opts?: IClassGeneratorOptions);
|
|
9
|
+
defaultClassGenerate(): string;
|
|
10
10
|
ignoreClassName(className: string): boolean;
|
|
11
11
|
includeFilePath(filePath: string): boolean;
|
|
12
12
|
excludeFilePath(filePath: string): boolean;
|
|
13
13
|
isFileIncluded(filePath: string): boolean;
|
|
14
14
|
transformCssClass(className: string): string;
|
|
15
|
-
generateClassName(original: string):
|
|
15
|
+
generateClassName(original: string): IClassGeneratorContextItem;
|
|
16
16
|
}
|
|
17
17
|
export default ClassGenerator;
|
package/dist/css/plugins.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { IClassGeneratorContextItem } from '@/types';
|
|
2
2
|
import type { PluginCreator } from 'postcss';
|
|
3
3
|
export type PostcssMangleTailwindcssPlugin = PluginCreator<{
|
|
4
|
-
newClassMap: Record<string,
|
|
4
|
+
newClassMap: Record<string, IClassGeneratorContextItem>;
|
|
5
5
|
}>;
|
|
6
6
|
declare const postcssMangleTailwindcssPlugin: PostcssMangleTailwindcssPlugin;
|
|
7
7
|
export { postcssMangleTailwindcssPlugin };
|
package/dist/index.js
CHANGED
|
@@ -112,7 +112,7 @@ class ClassGenerator {
|
|
|
112
112
|
this.opts = opts;
|
|
113
113
|
this.classPrefix = (_a = opts.classPrefix) !== null && _a !== void 0 ? _a : 'tw-';
|
|
114
114
|
}
|
|
115
|
-
|
|
115
|
+
defaultClassGenerate() {
|
|
116
116
|
const chars = [];
|
|
117
117
|
let rest = (this.newClassSize - (this.newClassSize % acceptChars.length)) / acceptChars.length;
|
|
118
118
|
if (rest > 0) {
|
|
@@ -170,11 +170,11 @@ class ClassGenerator {
|
|
|
170
170
|
if (cn)
|
|
171
171
|
return cn;
|
|
172
172
|
let newClassName;
|
|
173
|
-
if (opts.
|
|
174
|
-
newClassName = opts.
|
|
173
|
+
if (opts.customGenerate && typeof opts.customGenerate === 'function') {
|
|
174
|
+
newClassName = opts.customGenerate(original, opts, this.context);
|
|
175
175
|
}
|
|
176
176
|
if (!newClassName) {
|
|
177
|
-
newClassName = this.
|
|
177
|
+
newClassName = this.defaultClassGenerate();
|
|
178
178
|
}
|
|
179
179
|
if (opts.reserveClassName && regExpTest(opts.reserveClassName, newClassName)) {
|
|
180
180
|
if (opts.log) {
|
|
@@ -322,29 +322,41 @@ function getDefaultExportFromNamespaceIfPresent(n) {
|
|
|
322
322
|
}
|
|
323
323
|
const generate = getDefaultExportFromNamespaceIfPresent(_generate__default["default"]);
|
|
324
324
|
const traverse = getDefaultExportFromNamespaceIfPresent(_traverse__default["default"]);
|
|
325
|
-
function
|
|
326
|
-
|
|
325
|
+
function makeRegex(str) {
|
|
326
|
+
return new RegExp('(?<=^|[\\s"])' + escapeStringRegexp(str), 'g');
|
|
327
|
+
}
|
|
328
|
+
function handleValue(str, node, options) {
|
|
327
329
|
const set = options.runtimeSet;
|
|
328
330
|
const clsGen = options.classGenerator;
|
|
331
|
+
const arr = splitCode(str);
|
|
332
|
+
let rawStr = str;
|
|
333
|
+
for (let i = 0; i < arr.length; i++) {
|
|
334
|
+
const v = arr[i];
|
|
335
|
+
if (set.has(v)) {
|
|
336
|
+
let ignoreFlag = false;
|
|
337
|
+
if (Array.isArray(node.leadingComments)) {
|
|
338
|
+
ignoreFlag = node.leadingComments.findIndex((x) => x.value.includes('tw-mangle') && x.value.includes('ignore')) > -1;
|
|
339
|
+
}
|
|
340
|
+
if (!ignoreFlag) {
|
|
341
|
+
rawStr = rawStr.replace(makeRegex(v), clsGen.generateClassName(v).name);
|
|
342
|
+
}
|
|
343
|
+
}
|
|
344
|
+
}
|
|
345
|
+
return rawStr;
|
|
346
|
+
}
|
|
347
|
+
function jsHandler(rawSource, options) {
|
|
348
|
+
const ast = parser.parse(rawSource);
|
|
329
349
|
const topt = {
|
|
330
350
|
StringLiteral: {
|
|
331
351
|
enter(p) {
|
|
332
352
|
const n = p.node;
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
ignoreFlag = n.leadingComments.findIndex((x) => x.value.includes('tw-mangle') && x.value.includes('ignore')) > -1;
|
|
341
|
-
}
|
|
342
|
-
if (!ignoreFlag) {
|
|
343
|
-
rawStr = rawStr.replace(new RegExp(escapeStringRegexp(v), 'g'), clsGen.generateClassName(v).name);
|
|
344
|
-
}
|
|
345
|
-
}
|
|
346
|
-
}
|
|
347
|
-
n.value = rawStr;
|
|
353
|
+
n.value = handleValue(n.value, n, options);
|
|
354
|
+
}
|
|
355
|
+
},
|
|
356
|
+
TemplateElement: {
|
|
357
|
+
enter(p) {
|
|
358
|
+
const n = p.node;
|
|
359
|
+
n.value.raw = handleValue(n.value.raw, n, options);
|
|
348
360
|
}
|
|
349
361
|
},
|
|
350
362
|
noScope: true
|
|
@@ -392,7 +404,7 @@ const unplugin = unplugin$1.createUnplugin((options = {}, meta) => {
|
|
|
392
404
|
return /[-:]/.test(className);
|
|
393
405
|
};
|
|
394
406
|
let classSet;
|
|
395
|
-
const classGenerator = new ClassGenerator();
|
|
407
|
+
const classGenerator = new ClassGenerator(options.classGenerator);
|
|
396
408
|
function getCachedClassSet() {
|
|
397
409
|
const set = tailwindcssPatch.getClassCacheSet();
|
|
398
410
|
set.forEach((c) => {
|
package/dist/index.mjs
CHANGED
|
@@ -101,7 +101,7 @@ class ClassGenerator {
|
|
|
101
101
|
this.opts = opts;
|
|
102
102
|
this.classPrefix = (_a = opts.classPrefix) !== null && _a !== void 0 ? _a : 'tw-';
|
|
103
103
|
}
|
|
104
|
-
|
|
104
|
+
defaultClassGenerate() {
|
|
105
105
|
const chars = [];
|
|
106
106
|
let rest = (this.newClassSize - (this.newClassSize % acceptChars.length)) / acceptChars.length;
|
|
107
107
|
if (rest > 0) {
|
|
@@ -159,11 +159,11 @@ class ClassGenerator {
|
|
|
159
159
|
if (cn)
|
|
160
160
|
return cn;
|
|
161
161
|
let newClassName;
|
|
162
|
-
if (opts.
|
|
163
|
-
newClassName = opts.
|
|
162
|
+
if (opts.customGenerate && typeof opts.customGenerate === 'function') {
|
|
163
|
+
newClassName = opts.customGenerate(original, opts, this.context);
|
|
164
164
|
}
|
|
165
165
|
if (!newClassName) {
|
|
166
|
-
newClassName = this.
|
|
166
|
+
newClassName = this.defaultClassGenerate();
|
|
167
167
|
}
|
|
168
168
|
if (opts.reserveClassName && regExpTest(opts.reserveClassName, newClassName)) {
|
|
169
169
|
if (opts.log) {
|
|
@@ -311,29 +311,41 @@ function getDefaultExportFromNamespaceIfPresent(n) {
|
|
|
311
311
|
}
|
|
312
312
|
const generate = getDefaultExportFromNamespaceIfPresent(_generate);
|
|
313
313
|
const traverse = getDefaultExportFromNamespaceIfPresent(_traverse);
|
|
314
|
-
function
|
|
315
|
-
|
|
314
|
+
function makeRegex(str) {
|
|
315
|
+
return new RegExp('(?<=^|[\\s"])' + escapeStringRegexp(str), 'g');
|
|
316
|
+
}
|
|
317
|
+
function handleValue(str, node, options) {
|
|
316
318
|
const set = options.runtimeSet;
|
|
317
319
|
const clsGen = options.classGenerator;
|
|
320
|
+
const arr = splitCode(str);
|
|
321
|
+
let rawStr = str;
|
|
322
|
+
for (let i = 0; i < arr.length; i++) {
|
|
323
|
+
const v = arr[i];
|
|
324
|
+
if (set.has(v)) {
|
|
325
|
+
let ignoreFlag = false;
|
|
326
|
+
if (Array.isArray(node.leadingComments)) {
|
|
327
|
+
ignoreFlag = node.leadingComments.findIndex((x) => x.value.includes('tw-mangle') && x.value.includes('ignore')) > -1;
|
|
328
|
+
}
|
|
329
|
+
if (!ignoreFlag) {
|
|
330
|
+
rawStr = rawStr.replace(makeRegex(v), clsGen.generateClassName(v).name);
|
|
331
|
+
}
|
|
332
|
+
}
|
|
333
|
+
}
|
|
334
|
+
return rawStr;
|
|
335
|
+
}
|
|
336
|
+
function jsHandler(rawSource, options) {
|
|
337
|
+
const ast = parse$1(rawSource);
|
|
318
338
|
const topt = {
|
|
319
339
|
StringLiteral: {
|
|
320
340
|
enter(p) {
|
|
321
341
|
const n = p.node;
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
ignoreFlag = n.leadingComments.findIndex((x) => x.value.includes('tw-mangle') && x.value.includes('ignore')) > -1;
|
|
330
|
-
}
|
|
331
|
-
if (!ignoreFlag) {
|
|
332
|
-
rawStr = rawStr.replace(new RegExp(escapeStringRegexp(v), 'g'), clsGen.generateClassName(v).name);
|
|
333
|
-
}
|
|
334
|
-
}
|
|
335
|
-
}
|
|
336
|
-
n.value = rawStr;
|
|
342
|
+
n.value = handleValue(n.value, n, options);
|
|
343
|
+
}
|
|
344
|
+
},
|
|
345
|
+
TemplateElement: {
|
|
346
|
+
enter(p) {
|
|
347
|
+
const n = p.node;
|
|
348
|
+
n.value.raw = handleValue(n.value.raw, n, options);
|
|
337
349
|
}
|
|
338
350
|
},
|
|
339
351
|
noScope: true
|
|
@@ -381,7 +393,7 @@ const unplugin = createUnplugin((options = {}, meta) => {
|
|
|
381
393
|
return /[-:]/.test(className);
|
|
382
394
|
};
|
|
383
395
|
let classSet;
|
|
384
|
-
const classGenerator = new ClassGenerator();
|
|
396
|
+
const classGenerator = new ClassGenerator(options.classGenerator);
|
|
385
397
|
function getCachedClassSet() {
|
|
386
398
|
const set = getClassCacheSet();
|
|
387
399
|
set.forEach((c) => {
|
package/dist/js/index.d.ts
CHANGED
|
@@ -1,2 +1,5 @@
|
|
|
1
|
+
import type { StringLiteral, TemplateElement } from '@babel/types';
|
|
1
2
|
import type { IHandlerOptions } from '../types';
|
|
3
|
+
export declare function makeRegex(str: string): RegExp;
|
|
4
|
+
export declare function handleValue(str: string, node: StringLiteral | TemplateElement, options: IHandlerOptions): string;
|
|
2
5
|
export declare function jsHandler(rawSource: string, options: IHandlerOptions): import("@babel/generator").GeneratorResult;
|
package/dist/types.d.ts
CHANGED
|
@@ -1,13 +1,11 @@
|
|
|
1
1
|
import type ClassGenerator from './classGenerator';
|
|
2
|
-
export interface
|
|
3
|
-
}
|
|
4
|
-
export interface IMangleContextClass {
|
|
2
|
+
export interface IClassGeneratorContextItem {
|
|
5
3
|
name: string;
|
|
6
4
|
usedBy: any[];
|
|
7
5
|
}
|
|
8
|
-
export interface
|
|
6
|
+
export interface IClassGeneratorOptions {
|
|
9
7
|
reserveClassName?: (string | RegExp)[];
|
|
10
|
-
|
|
8
|
+
customGenerate?: (original: string, opts: IClassGeneratorOptions, context: Record<string, any>) => string | undefined;
|
|
11
9
|
log?: boolean;
|
|
12
10
|
exclude?: (string | RegExp)[];
|
|
13
11
|
include?: (string | RegExp)[];
|
|
@@ -15,7 +13,7 @@ export interface IMangleOptions {
|
|
|
15
13
|
classPrefix?: string;
|
|
16
14
|
}
|
|
17
15
|
export interface IClassGenerator {
|
|
18
|
-
newClassMap: Record<string,
|
|
16
|
+
newClassMap: Record<string, IClassGeneratorContextItem>;
|
|
19
17
|
newClassSize: number;
|
|
20
18
|
context: Record<string, any>;
|
|
21
19
|
}
|
|
@@ -24,3 +22,6 @@ export interface IHandlerOptions {
|
|
|
24
22
|
runtimeSet: Set<string>;
|
|
25
23
|
classGenerator: ClassGenerator;
|
|
26
24
|
}
|
|
25
|
+
export interface Options {
|
|
26
|
+
classGenerator?: IClassGeneratorOptions;
|
|
27
|
+
}
|
package/dist/utils.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { IClassGeneratorOptions, IClassGenerator } from './types';
|
|
2
2
|
export declare function groupBy<T>(arr: T[], cb: (arg: T) => string): Record<string, T[]>;
|
|
3
3
|
export declare function getGroupedEntries<T>(entries: [string, T][], options?: {
|
|
4
4
|
cssMatcher(file: string): boolean;
|
|
@@ -7,7 +7,7 @@ export declare function getGroupedEntries<T>(entries: [string, T][], options?: {
|
|
|
7
7
|
}): Record<"css" | "html" | "js" | "other", [string, T][]>;
|
|
8
8
|
export declare const acceptChars: string[];
|
|
9
9
|
export declare function stripEscapeSequence(words: string): string;
|
|
10
|
-
export declare const validate: (opts:
|
|
10
|
+
export declare const validate: (opts: IClassGeneratorOptions, classGenerator: IClassGenerator) => void;
|
|
11
11
|
export declare function isRegexp(value: unknown): boolean;
|
|
12
12
|
export declare function isMap(value: unknown): boolean;
|
|
13
13
|
export declare function regExpTest(arr: (string | RegExp)[] | undefined, str: string): boolean;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "unplugin-tailwindcss-mangle",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.5",
|
|
4
4
|
"description": "mangle tailwindcss utilities class",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"module": "./dist/index.mjs",
|
|
@@ -48,7 +48,9 @@
|
|
|
48
48
|
"tailwindcss",
|
|
49
49
|
"utilities",
|
|
50
50
|
"mangle",
|
|
51
|
-
"class"
|
|
51
|
+
"class",
|
|
52
|
+
"obfuscator",
|
|
53
|
+
"obfuscation"
|
|
52
54
|
],
|
|
53
55
|
"author": "SonOfMagic <qq1324318532@gmail.com>",
|
|
54
56
|
"license": "MIT",
|