` can be what the core is generating for your initial class `something`. So the example above could have been generated from this source:
69 |
70 | ```html
71 |
75 |
76 | Yeah
77 |
78 |
83 | ```
84 | In that case, the initial code is semantically wrong since the `querySelector` should return `undefined`. The minified CSS selector code will thus return a different result in that case.
85 |
86 | If you had followed the advice above and excluded (or reserved) all potential HTML tag name (see below), then `something` won't be mapped to `b`, but, for example, `t` and the initial code behavior will be preserved.
87 |
88 | Similarly, if your initial code was:
89 | ```js
90 | ...
91 | const a = 'b';
92 | ...
93 | ```
94 | then the core will generate a warning telling you that `b` is already used in the renaming map and that you should fix the ambiguity.
95 |
96 | By default all HTML and CSS attributes are excluded, see [here](https://github.com/JPeer264/node-rcs-core/blob/master/lib/helpers/excludeList.ts)
97 |
98 | The incovenient being that such selectors won't be minified (think about `header` for example, it's quite common for a class name)
99 |
100 | ## Caveat for step 3
101 |
102 | > **tl;dr:** Be careful with CSS selectors in JavaScript. Do not use string concatenation with your CSS selectors.
103 |
104 | Replacement is relatively safe for CSS and HTML (again, because such format are explicit enough to avoiding ambiguity).
105 |
106 | Replacements inside JavaScript code is much harder because a string for a selector can be generated from many small parts (like in `const a = '.' + objClass;`), can be used in functions that have different semantics (like `getElementById` and `querySelector`), etc...
107 |
108 | So, here's the way the core is trying to resolve ambiguities (but as seen above, not all ambiguities can be solved):
109 |
110 | 1. ECMAScript template, like in ``const a = `some text ${jsConst}`;`` is parsed like HTML, looking for `class="X"` or `id='Y'` or `for="Z"`.
111 | If you use template code to make your CSS selector from each part, it'll fail:
112 | Don't write ``const myClass = 'something'; const sel = `.${myClass}`;``, but instead `const myClass = '.something'`.
113 |
114 | 2. Each string literal is extracted from your JavaScript code and:
115 | - If it contains some CSS specific selectors chars (like `#` or `.` or ` ` etc...), then it's parsed as a CSS selector. **This is safer and usually gives the expected result.**
116 | - If it does not contain some CSS specific selectors (like a single word), then it's tried as an ID selector first and if not found as a class selector (or not replaced if not found in either one).
117 | **This can lead to the ambiguity shown above.**
118 |
119 | So, to avoid such ambiguity, try to store your class or id with their respective prefix (`.` or `#`) in your code, and rely on `querySelector` et al.
120 |
121 | For example, here are some replacement selected by the library, with these CSS selector:
122 |
123 | ```css
124 | .something {} /* Mapped to .a */
125 | #test {} /* Mapped to #a */
126 | .test {} /* Mapped to .b */
127 | ```
128 | | Initial code | Replaced code | Reason |
129 | |---|---|---|
130 | |`const a = 'something';`|`const a = 'b';`| The core could not deduce the string literal is a selector, so fallback to searching for any rule with `something`, class had one|
131 | |`const a = 'test';`|`const a = 'a';`| The core could not deduce the string literal is a selector and in fallback to search for any rule, it selected #test=>#a since it was searched first|
132 | |`const a = '.something';`|`const a = '.a';`| The core deduced a class selector was required and replaced it|
133 | |`const a = '.test';`|`const a = '.b';`| The core deduced a class selector was required and replaced it|
134 | |`const a = ' something';`|`const a = ' something';`| The core deduced the string literal is a CSS selector, but could not find any match|
135 | |`const a = 'div[class=something]';`|`const a = 'div[class=a]';`| The core deduced the attribute selector was related to a class selector and replaced it|
136 | |`const a = 'input[name=something]';`|`const a = 'input[name=something]';`| The core deduced the attribute selector wasn't related to a class, id or for attribute, no replacement was done|
137 | |`const a = 'b #test, .something';`|`const a = 'b #a, .a';`| The core parsed all selectors and produced correct replacement for each of them|
138 |
139 | ### Another remark:
140 | Some are writing CSS selector this way:
141 | ```css
142 | div[class = something]
143 | {
144 | color: red;
145 | }
146 | ```
147 | This is perfectly safe from JavaScript code (if you have `const a = 'div[class=something]';`), then this will be replaced correctly by the core (*to* `const a = 'div[class=b]';`).
148 |
149 | This however requires much more work from the developper so this is not a solution we recommend.
150 |
--------------------------------------------------------------------------------
/global.d.ts:
--------------------------------------------------------------------------------
1 | declare module 'json-extra';
2 |
3 | declare type RCSError = null | { message: string; error?: string };
4 |
5 | declare type Callback = (
6 | err: null | { message: string; error?: string } | NodeJS.ErrnoException, successMessage?: string
7 | ) => void;
8 |
--------------------------------------------------------------------------------
/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | preset: 'ts-jest',
3 | transform: {
4 | '^.+\\.(t|j)sx?$': 'ts-jest',
5 | },
6 | testPathIgnorePatterns: ['/node_modules/', '/__tests__/files/', '/__tests__/helpers/', '/test/'],
7 | setupFilesAfterEnv: ['./jest.setup.js'],
8 | globals: {
9 | 'ts-jest': {
10 | isolatedModules: true,
11 | },
12 | },
13 | };
14 |
--------------------------------------------------------------------------------
/jest.setup.js:
--------------------------------------------------------------------------------
1 | jest.setTimeout(30000);
2 |
--------------------------------------------------------------------------------
/lib/Config.ts:
--------------------------------------------------------------------------------
1 | import rcs from 'rcs-core';
2 | import path from 'path';
3 | import json from 'json-extra';
4 | import minimatch from 'minimatch';
5 |
6 | class Config {
7 | private static singleton: Config;
8 |
9 | ignorePatterns: string[] = [];
10 |
11 | public load(pathString = path.join(process.cwd(), '.rcsrc')): void {
12 | let configObject;
13 |
14 | configObject = json.readToObjSync(pathString);
15 |
16 | if (!configObject) {
17 | // package.json .rcs if no other config is found
18 | configObject = json.readToObjSync(path.join(process.cwd(), 'package.json')).rcs;
19 | }
20 |
21 | if (configObject.exclude) {
22 | rcs.selectorsLibrary.setExclude(configObject.exclude);
23 | }
24 |
25 | if (configObject.reserve) {
26 | rcs.selectorsLibrary.setReserved(configObject.reserve);
27 | }
28 |
29 | if (configObject.ignore) {
30 | this.ignorePatterns = configObject.ignore;
31 | }
32 | }
33 |
34 | public isIgnored(filePath: string): boolean {
35 | return this.ignorePatterns.some((pattern) => minimatch(filePath, pattern));
36 | }
37 |
38 | public static getInstance(): Config {
39 | if (!this.singleton) {
40 | this.singleton = new this();
41 | }
42 |
43 | return this.singleton;
44 | }
45 | }
46 |
47 | export default Config;
48 |
--------------------------------------------------------------------------------
/lib/helper/save.ts:
--------------------------------------------------------------------------------
1 | import { fromPromise } from 'universalify';
2 | import fs from 'fs-extra';
3 | import path from 'path';
4 |
5 | interface SaveOptions {
6 | overwrite?: boolean;
7 | }
8 |
9 | const save = async (
10 | destinationPath: string,
11 | data: string,
12 | options: SaveOptions = {},
13 | ): Promise
=> {
14 | // @todo check if the filepath has an .ext
15 | if (!options.overwrite && fs.existsSync(destinationPath)) {
16 | throw new Error('File exist and cannot be overwritten. Set the option overwrite to true to overwrite files.');
17 | }
18 |
19 | await fs.mkdirs(path.dirname(destinationPath));
20 | await fs.writeFile(destinationPath, data);
21 | }; // /save
22 |
23 | export default fromPromise(save);
24 |
--------------------------------------------------------------------------------
/lib/helper/saveSync.ts:
--------------------------------------------------------------------------------
1 | import fs from 'fs-extra';
2 | import path from 'path';
3 |
4 | const saveSync = (
5 | destinationPath: string,
6 | data: string,
7 | options: { overwrite?: boolean } = {},
8 | ): void => {
9 | if (!options.overwrite && fs.existsSync(destinationPath)) {
10 | throw new Error('File exist and cannot be overwritten. Set the option overwrite to true to overwrite files.');
11 | }
12 |
13 | fs.mkdirsSync(path.dirname(destinationPath));
14 | fs.writeFileSync(destinationPath, data);
15 | }; // /saveSync
16 |
17 | export default saveSync;
18 |
--------------------------------------------------------------------------------
/lib/index.ts:
--------------------------------------------------------------------------------
1 | // process
2 | import typeChooserSync from './process/typeChooser/typeChooserSync';
3 | import typeChooser from './process/typeChooser/typeChooser';
4 |
5 | // mapping
6 | import generateMapping from './mapping/generateMapping';
7 | import loadMapping from './mapping/loadMapping';
8 |
9 | // config
10 | import Config from './Config';
11 |
12 | export default {
13 | process: {
14 | cssSync: typeChooserSync('css'),
15 | css: typeChooser('css'),
16 | jsSync: typeChooserSync('js'),
17 | js: typeChooser('js'),
18 | htmlSync: typeChooserSync('html'),
19 | html: typeChooser('html'),
20 | pugSync: typeChooserSync('pug'),
21 | pug: typeChooser('pug'),
22 | anySync: typeChooserSync('any'),
23 | any: typeChooser('any'),
24 | autoSync: typeChooserSync('auto'),
25 | auto: typeChooser('auto'),
26 | },
27 | mapping: {
28 | generate: generateMapping,
29 | load: loadMapping,
30 | },
31 | config: Config.getInstance(),
32 | };
33 |
--------------------------------------------------------------------------------
/lib/mapping/generateMapping.ts:
--------------------------------------------------------------------------------
1 | import { fromPromise } from 'universalify';
2 | import rcs from 'rcs-core';
3 | import path from 'path';
4 | import json from 'json-extra';
5 | import { GenerateMappingOptions } from 'rcs-core/dest/mapping/generate';
6 |
7 | import save from '../helper/save';
8 |
9 | export interface Options extends GenerateMappingOptions {
10 | json?: boolean;
11 | overwrite?: boolean;
12 | fileName?: string;
13 | }
14 |
15 | const generateMapping = async (
16 | pathString: string,
17 | opts: Options,
18 | ): Promise => {
19 | let fileName = 'renaming_map';
20 | let fileNameExt = '.json';
21 | let mappingName = 'CSS_NAME_MAPPING';
22 |
23 | const options: Options = {
24 | json: true,
25 | origValues: true,
26 | overwrite: false,
27 | ...opts,
28 | };
29 |
30 | if (!options.origValues) {
31 | options.origValues = false;
32 | mappingName = 'CSS_NAME_MAPPING_MIN';
33 | fileName = `${fileName}_min`;
34 | }
35 |
36 | if (options.fileName) {
37 | fileName = options.fileName;
38 | mappingName = options.fileName;
39 | }
40 |
41 | const cssMappingArray = rcs.mapping.generate(opts);
42 |
43 | let mapping = json.stringify(cssMappingArray, null, '\t');
44 | const newPath = path.join(pathString, fileName);
45 |
46 | // no json
47 | if (!options.json) {
48 | mapping = `var ${mappingName} = ${mapping};`;
49 | fileNameExt = '.js';
50 | }
51 |
52 | await save(`${newPath}${fileNameExt}`, mapping, { overwrite: options.overwrite });
53 | }; // /generateMapping
54 |
55 | export default fromPromise(generateMapping);
56 |
--------------------------------------------------------------------------------
/lib/mapping/loadMapping.ts:
--------------------------------------------------------------------------------
1 | import rcs from 'rcs-core';
2 | import fs from 'fs-extra';
3 | import { LoadMappingOptions, Mapping } from 'rcs-core/dest/mapping/load';
4 |
5 | async function loadMapping(
6 | pathString: string,
7 | opts?: LoadMappingOptions,
8 | ): Promise;
9 |
10 | function loadMapping(
11 | pathString: Mapping,
12 | opts?: LoadMappingOptions,
13 | ): void;
14 |
15 | async function loadMapping(
16 | pathString: string | Mapping,
17 | opts?: LoadMappingOptions,
18 | ): Promise {
19 | let selectors: Mapping;
20 |
21 | if (typeof pathString === 'string') {
22 | try {
23 | selectors = await fs.readJSON(pathString, { encoding: 'utf8' });
24 | } catch {
25 | selectors = {};
26 | }
27 | } else {
28 | selectors = pathString;
29 | }
30 |
31 | rcs.mapping.load(selectors, opts);
32 | }
33 |
34 | export default loadMapping;
35 |
--------------------------------------------------------------------------------
/lib/process/defaults.ts:
--------------------------------------------------------------------------------
1 | export default {
2 | availableTypes: ['auto', 'js', 'html', 'pug', 'css', 'any'],
3 | fileExt: {
4 | js: ['.js', '.jsx'],
5 | css: ['.css', '.scss', '.sass', '.less'],
6 | html: ['.html', '.htm', '.handlebars', '.hbs'],
7 | pug: ['.pug'],
8 | },
9 | optionsDefault: {
10 | type: 'auto',
11 | overwrite: false,
12 | cwd: process.cwd(),
13 | newPath: 'rcs',
14 | },
15 | };
16 |
--------------------------------------------------------------------------------
/lib/process/process.ts:
--------------------------------------------------------------------------------
1 | import { fromPromise } from 'universalify';
2 | import fs from 'fs';
3 | import rcs from 'rcs-core';
4 | import path from 'path';
5 | import glob from 'glob';
6 | import { eachSeries, each } from 'async';
7 | import assert from 'assert';
8 |
9 | import { ReplaceStringOptions } from 'rcs-core/dest/replace/string';
10 | import { ReplaceHtmlOptions } from 'rcs-core/dest/replace/html';
11 | import { ReplacePugOptions } from 'rcs-core/dest/replace/pug';
12 | import { ReplaceCssOptions } from 'rcs-core/dest/replace/css';
13 | import { ReplaceJsOptions } from 'rcs-core/dest/replace/js';
14 | import { FillLibrariesOptions as RcsFillLibrariesOptions } from 'rcs-core/dest/fillLibraries';
15 |
16 | import save from '../helper/save';
17 | import replaceData from './replaceData';
18 | import defaults from './defaults';
19 | import Config from '../Config';
20 |
21 | const { fileExt, availableTypes, optionsDefault } = defaults;
22 |
23 | export interface BaseOptions {
24 | cwd?: string;
25 | newPath?: string;
26 | overwrite?: boolean;
27 | }
28 |
29 | export interface FillLibrariesOptions extends RcsFillLibrariesOptions {
30 | optimize?: boolean;
31 | }
32 |
33 | export interface AllOptions {
34 | pug: BaseOptions & ReplacePugOptions;
35 | any: BaseOptions & ReplaceStringOptions;
36 | js: BaseOptions & ReplaceJsOptions;
37 | html: BaseOptions & FillLibrariesOptions & ReplaceHtmlOptions;
38 | css: BaseOptions & FillLibrariesOptions & ReplaceCssOptions;
39 | auto: (
40 | & BaseOptions
41 | & FillLibrariesOptions
42 | & ReplaceCssOptions
43 | & ReplacePugOptions
44 | & ReplaceHtmlOptions
45 | & ReplaceStringOptions
46 | & ReplaceJsOptions
47 | );
48 | }
49 |
50 | async function rcsProcess(type: 'auto', pathString: string | string[], opts?: AllOptions['auto']): Promise;
51 | async function rcsProcess(type: 'css', pathString: string | string[], opts?: AllOptions['css']): Promise;
52 | async function rcsProcess(type: 'js', pathString: string | string[], opts?: AllOptions['js']): Promise;
53 | async function rcsProcess(type: 'html', pathString: string | string[], opts?: AllOptions['html']): Promise;
54 | async function rcsProcess(type: 'pug', pathString: string | string[], opts?: AllOptions['pug']): Promise;
55 | async function rcsProcess(type: 'any', pathString: string | string[], opts?: AllOptions['any']): Promise;
56 | async function rcsProcess(type: any, pathString: string | string[], opts: any = {}): Promise {
57 | const options = { ...optionsDefault, ...opts };
58 | const shouldOptimize = options.optimize ?? true;
59 |
60 | let globString: string;
61 |
62 | assert(
63 | availableTypes.includes(type),
64 | `type must be one of the following: ${availableTypes}`,
65 | );
66 |
67 | if (Array.isArray(pathString)) {
68 | globString = pathString.length > 1
69 | ? `{${pathString.join(',')}}`
70 | : pathString[0];
71 | } else {
72 | globString = pathString;
73 | }
74 |
75 | const cwd = options.cwd || process.cwd();
76 | const filesArray: string[] = await new Promise((res, rej) => (
77 | glob(globString, { cwd, ignore: Config.getInstance().ignorePatterns }, (error, allFiles) => (
78 | error
79 | ? rej(error)
80 | : res(allFiles)
81 | ))
82 | ));
83 |
84 | // fail if nothing is found
85 | if (filesArray.length <= 0) {
86 | throw new Error('No files found');
87 | }
88 |
89 | // sort in case of 'auto'
90 | const cssHtmlFiles = filesArray.filter((file) => (
91 | fileExt.css.includes(path.extname(file))
92 | || fileExt.html.includes(path.extname(file))
93 | ));
94 |
95 | const fillLibraryFiles = type === 'auto'
96 | ? cssHtmlFiles
97 | : filesArray;
98 |
99 | // call in series
100 | // not all selectors are stored, maybe some selectors are duplicated in different files
101 | await new Promise((res, rej) => (
102 | eachSeries(fillLibraryFiles, (filePath, asyncCb) => {
103 | // skip if it is not meant to fill the library
104 | if (type !== 'auto' && type !== 'css' && type !== 'html') {
105 | return asyncCb();
106 | }
107 |
108 | return fs.readFile(path.join(cwd, filePath), (errReadFile, bufferData) => {
109 | if (errReadFile) {
110 | return asyncCb(errReadFile);
111 | }
112 |
113 | // add here again so typescript gets the correct option types
114 | if (type !== 'auto' && type !== 'css' && type !== 'html') {
115 | return undefined;
116 | }
117 |
118 | const isHtml = fileExt.html.includes(path.extname(filePath));
119 |
120 | rcs.fillLibraries(
121 | bufferData.toString(),
122 | {
123 | prefix: options.prefix,
124 | suffix: options.suffix,
125 | replaceKeyframes: options.replaceKeyframes,
126 | preventRandomName: options.preventRandomName,
127 | ignoreAttributeSelectors: options.ignoreAttributeSelectors,
128 | ignoreCssVariables: options.ignoreCssVariables,
129 | codeType: isHtml ? 'html' : 'css',
130 | },
131 | );
132 |
133 | return asyncCb();
134 | });
135 | }, (err) => (
136 | err ? rej(err) : res()
137 | ))
138 | ));
139 |
140 | if (shouldOptimize) {
141 | rcs.optimize();
142 | }
143 |
144 | await new Promise((res, rej) => (
145 | // now all files can be renamed and saved
146 | // can be fired parallel
147 | // all selectors are collected
148 | // ⚡️ speed it up with async/each ⚡️
149 | each(filesArray, (filePath, asyncEachCb) => {
150 | fs.readFile(path.join(cwd, filePath), 'utf8', (err, bufferData) => {
151 | let data;
152 | let shouldOverwrite = options.overwrite;
153 |
154 | if (err) {
155 | return asyncEachCb(err);
156 | }
157 |
158 | try {
159 | data = replaceData(type, filePath, bufferData, options);
160 | } catch (e) {
161 | return asyncEachCb(e);
162 | }
163 |
164 | const joinedPath = path.join(options.newPath || cwd, filePath);
165 |
166 | if (!options.overwrite) {
167 | shouldOverwrite = joinedPath !== path.join(cwd, filePath);
168 | }
169 |
170 | return save(joinedPath, data, { overwrite: shouldOverwrite }, (errSave: any) => {
171 | if (errSave) {
172 | return asyncEachCb(errSave);
173 | }
174 |
175 | return asyncEachCb(null);
176 | });
177 | });
178 | }, (errProcess) => {
179 | rcs.warnings.warn();
180 |
181 | if (errProcess) {
182 | rej(errProcess);
183 | } else {
184 | res();
185 | }
186 | })
187 | ));
188 | } // /process
189 |
190 | export default fromPromise(rcsProcess);
191 |
--------------------------------------------------------------------------------
/lib/process/processSync.ts:
--------------------------------------------------------------------------------
1 | import fs from 'fs';
2 | import rcs from 'rcs-core';
3 | import path from 'path';
4 | import glob from 'glob';
5 | import assert from 'assert';
6 |
7 | import saveSync from '../helper/saveSync';
8 | import replaceData from './replaceData';
9 | import defaults from './defaults';
10 | import { AllOptions } from './process';
11 | import Config from '../Config';
12 |
13 | const { fileExt, availableTypes, optionsDefault } = defaults;
14 |
15 | /**
16 | * The synchronous method for process
17 | */
18 | function processSync(type: 'auto', pathString: string | string[], opts?: AllOptions['auto']): void;
19 | function processSync(type: 'css', pathString: string | string[], opts?: AllOptions['css']): void;
20 | function processSync(type: 'js', pathString: string | string[], opts?: AllOptions['js']): void;
21 | function processSync(type: 'html', pathString: string | string[], opts?: AllOptions['html']): void;
22 | function processSync(type: 'pug', pathString: string | string[], opts?: AllOptions['pug']): void;
23 | function processSync(type: 'any', pathString: string | string[], opts?: AllOptions['any']): void;
24 | function processSync(type: any, pathString: string | string[], opts: any = {}): void {
25 | let globString: string;
26 | const options = { ...optionsDefault, ...opts };
27 |
28 | assert(
29 | availableTypes.includes(type),
30 | `type must be one of the following: ${availableTypes}`,
31 | );
32 |
33 | if (Array.isArray(pathString)) {
34 | globString = `{${pathString.join(',')}}`;
35 | } else {
36 | globString = pathString;
37 | }
38 |
39 | const globArray = glob.sync(globString, {
40 | cwd: options.cwd,
41 | ignore: Config.getInstance().ignorePatterns,
42 | });
43 | const cssHtmlFiles = globArray.filter((file) => (
44 | fileExt.css.includes(path.extname(file))
45 | || fileExt.html.includes(path.extname(file))
46 | ));
47 | const fillLibraryFiles = type === 'auto'
48 | ? cssHtmlFiles
49 | : globArray;
50 |
51 | if (type === 'auto' || type === 'css' || type === 'html') {
52 | fillLibraryFiles.forEach((filePath) => {
53 | const fileData = fs.readFileSync(path.join(options.cwd, filePath), 'utf8');
54 | const isHtml = fileExt.html.includes(path.extname(filePath));
55 |
56 | rcs.fillLibraries(
57 | fileData.toString(),
58 | {
59 | prefix: options.prefix,
60 | suffix: options.suffix,
61 | replaceKeyframes: options.replaceKeyframes,
62 | preventRandomName: options.preventRandomName,
63 | ignoreAttributeSelectors: options.ignoreAttributeSelectors,
64 | ignoreCssVariables: options.ignoreCssVariables,
65 | codeType: isHtml ? 'html' : 'css',
66 | },
67 | );
68 | });
69 | }
70 |
71 | globArray.forEach((filePath) => {
72 | let shouldOverwrite = options.overwrite;
73 | const joinedPath = path.join(options.newPath, filePath);
74 |
75 | if (!options.overwrite) {
76 | shouldOverwrite = joinedPath !== path.join(options.cwd, filePath);
77 | }
78 |
79 | const fileData = fs.readFileSync(path.join(options.cwd, filePath), 'utf8');
80 | const data = replaceData(type, filePath, fileData, options);
81 |
82 | saveSync(joinedPath, data, { overwrite: shouldOverwrite });
83 | });
84 |
85 | rcs.warnings.warn();
86 | } // /processSync
87 |
88 | export default processSync;
89 |
--------------------------------------------------------------------------------
/lib/process/replaceData.ts:
--------------------------------------------------------------------------------
1 | import rcs from 'rcs-core';
2 | import path from 'path';
3 |
4 | import { AllOptions } from './process';
5 | import defaults from './defaults';
6 |
7 | function replaceData(type: 'auto', filePath: string, fileData: string, options: AllOptions['auto']): string;
8 | function replaceData(type: 'css', filePath: string, fileData: string, options: AllOptions['css']): string;
9 | function replaceData(type: 'js', filePath: string, fileData: string, options: AllOptions['js']): string;
10 | function replaceData(type: 'html', filePath: string, fileData: string, options: AllOptions['html']): string;
11 | function replaceData(type: 'pug', filePath: string, fileData: string, options: AllOptions['pug']): string;
12 | function replaceData(type: 'any', filePath: string, fileData: string, options: AllOptions['any']): string;
13 | function replaceData(type: any, filePath: string, fileData: string, options: any): string {
14 | let data;
15 |
16 | if (
17 | type === 'js'
18 | || (
19 | type === 'auto'
20 | && defaults.fileExt.js.includes(path.extname(filePath))
21 | )
22 | ) {
23 | data = rcs.replace.js(fileData, { ...options.espreeOptions, sourceFile: filePath });
24 | } else if (
25 | type === 'css'
26 | || (
27 | type === 'auto'
28 | && defaults.fileExt.css.includes(path.extname(filePath))
29 | )
30 | ) {
31 | data = rcs.replace.css(fileData, { ...options, sourceFile: filePath });
32 | } else if (
33 | type === 'html'
34 | || (
35 | type === 'auto'
36 | && defaults.fileExt.html.includes(path.extname(filePath))
37 | )
38 | ) {
39 | data = rcs.replace.html(fileData, { ...options, sourceFile: filePath });
40 | } else if (
41 | type === 'pug'
42 | || (
43 | type === 'auto'
44 | && defaults.fileExt.pug.includes(path.extname(filePath))
45 | )
46 | ) {
47 | data = rcs.replace.pug(fileData, { ...options, sourceFile: filePath });
48 | } else {
49 | data = rcs.replace.any(fileData, { ...options, sourceFile: filePath });
50 | }
51 |
52 | return data;
53 | }
54 |
55 | export default replaceData;
56 |
--------------------------------------------------------------------------------
/lib/process/typeChooser/typeChooser.ts:
--------------------------------------------------------------------------------
1 | import rcsProcess, { AllOptions } from '../process';
2 |
3 | /**
4 | * typeChooser will be obsolete as soon as
5 | * `process.bind(null, 'js')` works with TypeScript method overloads
6 | * https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-2.html#caveats
7 | * "[...] when used on a function with overloads, only the last overload will ever be modeled."
8 | */
9 | function typeChooser(processType: 'pug'): (pathString: string | string[], opts?: AllOptions['pug']) => Promise;
10 | function typeChooser(processType: 'any'): (pathString: string | string[], opts?: AllOptions['any']) => Promise;
11 | function typeChooser(processType: 'js'): (pathString: string | string[], opts?: AllOptions['js']) => Promise;
12 | function typeChooser(processType: 'html'): (pathString: string | string[], opts?: AllOptions['html']) => Promise;
13 | function typeChooser(processType: 'css'): (pathString: string | string[], opts?: AllOptions['css']) => Promise;
14 | function typeChooser(processType: 'auto'): (pathString: string | string[], opts?: AllOptions['auto']) => Promise;
15 | function typeChooser(processType: any): any {
16 | return (...args: any) => rcsProcess(processType, ...args);
17 | } // /typeChooser
18 |
19 | export default typeChooser;
20 |
--------------------------------------------------------------------------------
/lib/process/typeChooser/typeChooserSync.ts:
--------------------------------------------------------------------------------
1 | import rcsProcessSync from '../processSync';
2 | import { AllOptions } from '../process';
3 |
4 | function typeChooserSync(processType: 'pug'): (pathString: string | string[], opts?: AllOptions['html']) => void;
5 | function typeChooserSync(processType: 'any'): (pathString: string | string[], opts?: AllOptions['any']) => void;
6 | function typeChooserSync(processType: 'js'): (pathString: string | string[], opts?: AllOptions['js']) => void;
7 | function typeChooserSync(processType: 'html'): (pathString: string | string[], opts?: AllOptions['html']) => void;
8 | function typeChooserSync(processType: 'css'): (pathString: string | string[], opts?: AllOptions['css']) => void;
9 | function typeChooserSync(processType: 'auto'): (pathString: string | string[], opts?: AllOptions['auto']) => void;
10 | function typeChooserSync(processType: any): any {
11 | return (pathString: any, opts: any) => rcsProcessSync(processType, pathString, opts);
12 | } // /typeChooserSync
13 |
14 | export default typeChooserSync;
15 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "rename-css-selectors",
3 | "version": "4.1.0",
4 | "description": "Rename css classes and id's in files",
5 | "main": "dest",
6 | "scripts": {
7 | "test": "jest --coverage",
8 | "build": "tsc && babel dest -d dest",
9 | "lint": "eslint lib/**/*.ts __tests__/**/*.ts",
10 | "fix": "npm run lint -- --fix",
11 | "prepublish": "npm run build"
12 | },
13 | "husky": {
14 | "hooks": {
15 | "pre-push": "npm test",
16 | "pre-commit": "lint-staged"
17 | }
18 | },
19 | "lint-staged": {
20 | "*.{js,ts}": [
21 | "eslint --fix"
22 | ]
23 | },
24 | "rcs": {
25 | "exclude": [
26 | "js",
27 | "no-js"
28 | ]
29 | },
30 | "keywords": [
31 | "css",
32 | "minify",
33 | "rename",
34 | "selectors",
35 | "shrink",
36 | "classes",
37 | "compress",
38 | "styles",
39 | "munch"
40 | ],
41 | "repository": {
42 | "url": "https://www.github.com/JPeer264/rename-css-selectors",
43 | "type": "git"
44 | },
45 | "author": "Jan Peer Stöcklmair",
46 | "license": "MIT",
47 | "dependencies": {
48 | "async": "^2.6.3",
49 | "fs-extra": "^8.1.0",
50 | "glob": "^7.1.6",
51 | "json-extra": "^0.5.0",
52 | "lodash.merge": "^4.6.2",
53 | "minimatch": "^3.0.4",
54 | "universalify": "^2.0.0"
55 | },
56 | "peerDependencies": {
57 | "rcs-core": "^3.*"
58 | },
59 | "devDependencies": {
60 | "@babel/cli": "^7.14.5",
61 | "@types/async": "^3.0.8",
62 | "@types/fs-extra": "^8.0.1",
63 | "@types/glob": "^7.1.1",
64 | "@types/jest": "^25.1.2",
65 | "@types/lodash.merge": "^4.6.6",
66 | "@types/node": "^13.7.1",
67 | "@types/parse5": "^5.0.2",
68 | "@types/tmp": "^0.1.0",
69 | "@types/universalify": "^0.1.0",
70 | "@typescript-eslint/eslint-plugin": "^2.19.2",
71 | "@typescript-eslint/parser": "^2.19.2",
72 | "babel-plugin-add-module-exports": "^1.0.2",
73 | "eslint": "^6.8.0",
74 | "eslint-config-airbnb-base": "^14.0.0",
75 | "eslint-plugin-import": "^2.20.1",
76 | "html-minifier": "^3.5.20",
77 | "husky": "^4.2.3",
78 | "jest": "^25.1.0",
79 | "lint-staged": "^10.0.7",
80 | "rcs-core": "^3.5.1",
81 | "tmp": "^0.1.0",
82 | "ts-jest": "^25.2.0",
83 | "typescript": "^3.7.5"
84 | }
85 | }
86 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es2017",
4 | "module": "commonjs",
5 | "declaration": true,
6 | "lib": [
7 | "es2017",
8 | "es2016",
9 | "dom"
10 | ],
11 | "allowJs": true,
12 | "checkJs": false,
13 | "strict": true,
14 | "esModuleInterop": true,
15 | "outDir": "dest",
16 | "rootDir": "lib"
17 | },
18 | "include": [
19 | "lib"
20 | ],
21 | "files": [
22 | "./global.d.ts"
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------