Skip to content

Commit 32952bf

Browse files
committed
feat: support ident prefix/suffix options
1 parent 7ccc78c commit 32952bf

File tree

7 files changed

+208
-124
lines changed

7 files changed

+208
-124
lines changed

.github/workflows/release.yml

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,9 +28,10 @@ jobs:
2828
- name: Build NPM package
2929
run: npm run build
3030

31-
- name: Edit Inital Version
31+
- name: Edit First Release Version
3232
run: sed -i 's/\( FIRST_RELEASE\) = "1.0.0"/\1 = "3.0.0"/' node_modules/semantic-release/lib/definitions/constants.js
33-
- name: Edit Inital Version
33+
34+
- name: Edit First Prerelease Version
3435
run: sed -i 's/\( FIRSTPRERELEASE\) = "1"/\1 = "3"/' node_modules/semantic-release/lib/definitions/constants.js
3536

3637
- name: Create Release

README.md

Lines changed: 57 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,7 @@ Project starts on 30-10-2023
1515

1616
Visit the [GitHub Page](https://github.com/soranoo/next-css-obfuscator/) for better reading experience and latest docs. 😎
1717

18-
---
19-
18+
---
2019

2120
### 🎉 Version 3 has NOW been released 🎉 (💥 Breaking Changes)
2221

@@ -26,41 +25,43 @@ Visit the [GitHub Page](https://github.com/soranoo/next-css-obfuscator/) for bet
2625
>[!TIP]\
2726
> Don't upgrade to this version unless you are using TailwindCSS 4.0.0 or above. "If it works, don't touch it." :)
2827
29-
#### 📌 Feature Changes
28+
#### 📌 Feature Changes
3029

31-
- Support TailwindCSS 4.
32-
- Support nested CSS.
33-
- Support CSS idents obfuscation.
30+
- Support TailwindCSS 4.
31+
- Support nested CSS.
32+
- Support CSS idents obfuscation.
3433

35-
#### 📌 Configuration Changes
34+
#### 📌 Configuration Changes
3635

37-
- `enableJsAst` option is now enabled by default.
38-
- Default `generatorSeed` not longer fixed to `-1`, but a random string.
39-
- `simplify-seedable` mode is not longer supported. Use `random` mode instead.
40-
- Removed `includeAnyMatchRegexes` and `excludeAnyMatchRegexes` options, the `whiteListedFolderPaths` and `blackListedFolderPaths` options will be used instead.
41-
- Deprecated `classLength` option, not longer supported.
42-
- Added `ignorePatterns` option to ignore the class names and idents that match the regexes or strings.
43-
- Not longer preserve TailwindCSS dark mode class names (ie `.dark`). Add the dark mode class name to the `ignorePatterns.selectors` option to preserve it.
44-
- Merge `classIgnore` into `ignorePatterns.selectors` option.
45-
- Renamed `classPrefix` and `classSuffix` to `prefix` and `suffix`.
36+
- `enableJsAst` option is now enabled by default.
37+
- Default `generatorSeed` not longer fixed to `-1`, but a random string.
38+
- `simplify-seedable` mode is not longer supported. Use `random` mode instead.
39+
- Removed `includeAnyMatchRegexes` and `excludeAnyMatchRegexes` options, the `whiteListedFolderPaths` and `blackListedFolderPaths` options will be used instead.
40+
- Deprecated `classLength` option, not longer supported.
41+
- Added `ignorePatterns` option to ignore the class names and idents that match the regexes or strings.
42+
- Not longer preserve TailwindCSS dark mode class names (ie `.dark`). Add the dark mode class name to the `ignorePatterns.selectors` option to preserve it.
43+
- Merge `classIgnore` into `ignorePatterns.selectors` option.
44+
- Renamed `classPrefix` and `classSuffix` to `prefix` and `suffix`.
4645

4746
### 💥 Version 2 (Major Update)
47+
4848
This version is deeply inspired by [PostCSS-Obfuscator](https://github.com/n4j1Br4ch1D/postcss-obfuscator). Shout out to [n4j1Br4ch1D](https://github.com/n4j1Br4ch1D) for creating such a great package and thank you [tremor](https://github.com/tremorlabs) for sponsoring this project.
4949

50-
#### 📌 Changes
51-
- Support basic partial obfuscation
52-
- Support TailwindCSS Dark Mode
53-
- New configuration file `next-css-obfuscator.config.cjs`
54-
- More configuration options
55-
- Now become a independent solution (no need to patch `PostCSS-Obfuscator` anymore)
56-
- More tests
57-
- Better CSS parsing
50+
#### 📌 Changes
51+
52+
- Support basic partial obfuscation
53+
- Support TailwindCSS Dark Mode
54+
- New configuration file `next-css-obfuscator.config.cjs`
55+
- More configuration options
56+
- Now become a independent solution (no need to patch `PostCSS-Obfuscator` anymore)
57+
- More tests
58+
- Better CSS parsing
5859

5960
### 📚 Migration Guides
61+
6062
- [Migrate from version 1.x to 2.x](docs/upgrade-to-v2.md)
6163
- [Migrate from version 2.x to 3.x](docs/upgrade-to-v3.md)
6264

63-
6465
[version 1.x README](https://github.com/soranoo/next-css-obfuscator/tree/v.1.1.0)
6566

6667
[version 2.x README](https://github.com/soranoo/next-css-obfuscator/tree/v.2.2.19)
@@ -166,7 +167,8 @@ Visit the [npm](https://www.npmjs.com/package/next-css-obfuscator) page.
166167

167168
1. Create and add the following code to `next-css-obfuscator.config.cjs` or `next-css-obfuscator.config.ts`:
168169

169-
##### Obfuscate all files
170+
##### Obfuscate all files
171+
170172
```javascript
171173
module.exports = {
172174
enable: true,
@@ -176,8 +178,9 @@ Visit the [npm](https://www.npmjs.com/package/next-css-obfuscator) page.
176178
};
177179

178180
```
179-
##### Partially obfuscate
180-
181+
182+
##### Partially obfuscate
183+
181184
> [!CAUTION]\
182185
> Partially obfuscate can be EXTREMELY buggy. Be cautious when using this feature.
183186

@@ -193,7 +196,8 @@ Visit the [npm](https://www.npmjs.com/package/next-css-obfuscator) page.
193196
194197
```
195198

196-
##### TypeScript
199+
##### TypeScript
200+
197201
```ts
198202
import { Options } from "next-css-obfuscator";
199203
@@ -202,8 +206,6 @@ Visit the [npm](https://www.npmjs.com/package/next-css-obfuscator) page.
202206
} satisfies Options;
203207
```
204208

205-
206-
207209
Feel free to checkout [📖 Config Options Reference](#-config-options-reference) for more options and details.
208210

209211
> [!TIP]\
@@ -250,6 +252,7 @@ to make sure the build is always obfuscated and no need to run `obfuscate-build`
250252
> It is a good idea to add the `/css-obfuscator` folder to `.gitignore` to prevent the conversion table from being uploaded to the repository.
251253
252254
#### Partially obfuscate
255+
253256
To partially obfuscate your project, you have to add the obfuscate marker class to the components you want to obfuscate.
254257
255258
```diff
@@ -312,13 +315,15 @@ It may not be the best setting but it works for me. :)
312315
|buildFolderPath|string|"./.next"|The folder path to store the build files built by Next.js.|
313316
|classConversionJsonFolderPath|string|"./css-obfuscator"|The folder path to store the before obfuscate and after obfuscated classes conversion table.|
314317
|refreshClassConversionJson|boolean|false|Refresh the class conversion JSON file(s) at every obfuscation. Good for setting tweaking but not recommended for production.|
315-
|prefix|string|""|The prefix of the obfuscated class and ident name.|
316-
|suffix|string|""|The suffix of the obfuscated class and ident name.|
318+
|prefix.selectors|string|""|The prefix of the obfuscated classname.|
319+
|prefix.idents|string|""|The prefix of the obfuscated ident name.|
320+
|suffix.selectors|string|""|The suffix of the obfuscated classname.|
321+
|suffix.idents|string|""|The suffix of the obfuscated ident name.|
317322
|ignorePatterns|{selectors: [], idents: []}|{selectors: [], idents: []}|The patterns to be ignored during obfuscation.|
318323
|allowExtensions|string[ ]|[".jsx", ".tsx", ".js", ".ts", ".html", ".rsc"]|The file extensions to be processed.|
319324
|contentIgnoreRegexes|RegExp[ ]|[/\.jsxs\)\("\w+"/g]|The regexes to match the content to be ignored during obfuscation.|
320-
|whiteListedFolderPaths|(string \| Regex)[ ]|[ ]|The folder paths/Regex to be processed. Empty array means all folders will be processed.|
321-
|blackListedFolderPaths|(string \| Regex)[ ]|[ ]|The folder paths/Regex to be ignored.|
325+
|whiteListedFolderPaths|[string \| Regex]( )|[ ]|The folder paths/Regex to be processed. Empty array means all folders will be processed.|
326+
|blackListedFolderPaths|[string \| Regex]( )|[ ]|The folder paths/Regex to be ignored.|
322327
|enableMarkers|boolean|false|Enable or disable the obfuscation markers.|
323328
|markers|string[ ]|[ ]|Classes that indicate component(s) need to obfuscate.|
324329
|removeMarkersAfterObfuscated|boolean|true|Remove the obfuscation markers from HTML elements after obfuscation.|
@@ -327,6 +332,7 @@ It may not be the best setting but it works for me. :)
327332
|logLevel|"debug" \| "info" \| "warn" \| "error" \| "success"| "info"|The log level.|
328333
329334
### Experimental Features Options 🚧
335+
330336
| Option| Type| Default| Description| Stage |
331337
| - | - | - | - | - |
332338
|enableJsAst|boolean|true|Whether to obfuscate JS files using abstract syntax tree parser. <br><br>`contentIgnoreRegexes` option will be ignored if this option is enabled.|Alpha|
@@ -338,12 +344,14 @@ It may not be the best setting but it works for me. :)
338344
339345
> [!NOTE]\
340346
> **Stages** -
347+
>
341348
> 1. **PoC**: Proof of Concept. The feature is still in the concept stage and is not recommended in production.
342349
> 2. **Alpha**: The feature is still in the early stage of development and may not work as expected.
343350
> 3. **Beta**: The feature is almost completed and should work as expected but may have some issues. (if no issue is reported in a period, it will be considered stable.)
344351
> 4. **Stable**: The feature is in the final stage of development and should work as expected.
345352
346353
### All options in one place 📦
354+
347355
```js
348356
// next-css-obfuscator.config.cjs
349357
@@ -369,8 +377,14 @@ module.exports = {
369377
*/
370378
classSuffix: "", // Suffix of the obfuscated class name.
371379
372-
prefix: "", // Prefix of the obfuscated class and ident name.
373-
suffix: "", // Suffix of the obfuscated class and ident name.
380+
prefix: {
381+
selectors: "", // Prefix of the obfuscated classname.
382+
idents: "", // Prefix of the obfuscated ident name.
383+
},
384+
suffix: {
385+
selectors: "", // Suffix of the obfuscated classname.
386+
idents: "", // Suffix of the obfuscated ident name.
387+
},
374388
375389
/**
376390
* @deprecated Merged into `ignorePatterns.selectors` from v3.0.0 and will be removed in the next major version.
@@ -428,6 +442,7 @@ Your conversion table may be messed up. Try to delete the `classConversionJsonFo
428442
In a normal situation, the package will only remove the original CSS that is related to the obfuscation and you should not see any CSS sharing the same declaration block.
429443
430444
You are not expected to see this:
445+
431446
```css
432447
/* example.css */
433448

@@ -508,6 +523,7 @@ If you are going to obfuscate the whole site, you will get a way more accurate o
508523
Thank you to all the sponsors who support this project.
509524
510525
#### Organizations (1)
526+
511527
<table>
512528
<tr>
513529
<td align="center">
@@ -520,6 +536,7 @@ Thank you to all the sponsors who support this project.
520536
</table>
521537
522538
#### Individuals (1)
539+
523540
<table>
524541
<tr>
525542
<td align="center">
@@ -532,6 +549,7 @@ Thank you to all the sponsors who support this project.
532549
</table>
533550
534551
## 🦾 Special Thanks
552+
535553
<table>
536554
<tr>
537555
<td align="center">
@@ -550,9 +568,11 @@ Contributions are welcome! If you find a bug or have a feature request, please o
550568
## 🏛️ Commercial Usage
551569
552570
#### Individual🕺
571+
553572
Are you using this package for a personal project? That's great! You can support us by starring this repo on Github ⭐🌟⭐.
554573
555574
#### Organization 👯‍♂️
575+
556576
Are you using this package within your organization and generating revenue from it? Fantastic! We depend on your support to continue developing and maintaining the package under an MIT License. You might consider showing your support through [Github Sponsors](https://github.com/sponsors/soranoo).
557577
558578
## 📝 License

docs/upgrade-to-v3.md

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,10 @@ The following table outlines the changes to the configuration options from versi
1111
| `generatorSeed` (default: -1) | `generatorSeed` (default: {random}) | Default seed is now a random string. Provide a fixed string if you need consistent output across builds (e.g., for CDN caching). |
1212
| `mode: "simplify-seedable"` | ⛔ (Removed) | Use `mode: "random"` with a fixed `generatorSeed` instead. |
1313
| `classLength` | ⛔ (Deprecated) | No longer supported. Will be removed in the next major version. |
14-
| `classPrefix` | `prefix` | Renamed for clarity, now applies to both selectors and idents. `classPrefix` will be removed in the next major version. |
15-
| `classSuffix` | `suffix` | Renamed for clarity, now applies to both selectors and idents. `classSuffix` will be removed in the next major version. |
14+
| `classPrefix` | `prefix.selectors` | Renamed for clarity, now applies to both selectors and idents. `classPrefix` will be removed in the next major version. |
15+
| ➡️ | `prefix.idents` | New option to add specific prefix idents|
16+
| `classSuffix` | `suffix.selectors` | Renamed for clarity, now applies to both selectors and idents. `classSuffix` will be removed in the next major version. |
17+
| ➡️ | `suffix.idents` | New option to add specific suffix idents|
1618
| `classIgnore` | `ignorePatterns.selectors` | Merged into the new `ignorePatterns` object. `classIgnore` will be removed in the next major version. |
1719
| ➡️ | `ignorePatterns.idents` | New option to ignore specific CSS idents|
1820
| `includeAnyMatchRegexes` | ⛔ (Removed) | Use `whiteListedFolderPaths` instead. |

src/config.ts

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,8 +22,14 @@ export const defaultOptions: Options = {
2222
*/
2323
classSuffix: "", // Suffix of the obfuscated class name.
2424

25-
prefix: "", // Prefix of the obfuscated class and ident name.
26-
suffix: "", // Suffix of the obfuscated class and ident name.
25+
prefix: {
26+
selectors: "", // Prefix of the obfuscated classname.
27+
idents: "", // Prefix of the obfuscated ident name.
28+
},
29+
suffix: {
30+
selectors: "", // Suffix of the obfuscated classname.
31+
idents: "", // Suffix of the obfuscated ident name.
32+
},
2733

2834
/**
2935
* @deprecated Merged into `ignorePatterns.selectors` from v3.0.0 and will be removed in the next major version.

0 commit comments

Comments
 (0)