@zohodesk/react-cli 1.1.14-kubernetes → 1.1.15
Sign up to get free protection for your applications and to get access to all the features.
- package/.vscode/settings.json +25 -0
- package/README.md +294 -16
- package/bin/cli.js +30 -55
- package/docs/ComposeMinification.md +13 -0
- package/docs/CustomChunks.md +12 -9
- package/docs/MarkdownParser.md +18 -0
- package/docs/ReactLive.md +14 -0
- package/docs/SelectorWeight.md +3 -0
- package/docs/ValueReplacer.md +27 -0
- package/docs/VariableConversion.md +6 -1
- package/docs/patternFiltering.md +57 -0
- package/lib/common/buildEs.js +12 -0
- package/lib/common/runPreProcess.js +71 -0
- package/lib/common/splitChunks.js +65 -45
- package/lib/common/testPattern.js +9 -11
- package/lib/common/valueReplacer.js +1 -3
- package/lib/configs/resolvers.js +16 -5
- package/lib/configs/webpack.css.umd.config.js +3 -2
- package/lib/configs/webpack.dev.config.js +15 -5
- package/lib/configs/webpack.docs.config.js +17 -5
- package/lib/configs/webpack.impact.config.js +11 -4
- package/lib/configs/webpack.prod.config.js +15 -5
- package/lib/constants.js +3 -3
- package/lib/deprecationLogger.js +40 -0
- package/lib/loaderUtils/getCSSLoaders.js +98 -49
- package/lib/loaderUtils/tests/windowsModification.test.js +10 -0
- package/lib/loaderUtils/windowsModification.js +6 -1
- package/lib/loaders/__test__/markdownLoader.spec.js +145 -0
- package/lib/loaders/composeLoader.js +298 -0
- package/lib/loaders/docsLoader.js +18 -7
- package/lib/loaders/markdownLoader.js +71 -0
- package/lib/loaders/reactLiveConvertor.js +105 -0
- package/lib/loaders/selectorMappingLoader.js +9 -9
- package/lib/logger.js +27 -0
- package/lib/pluginUtils/getDevPlugins.js +25 -6
- package/lib/pluginUtils/getProdPlugins.js +32 -5
- package/lib/pluginUtils/getUMDCSSPlugins.js +1 -1
- package/lib/pluginUtils/getUMDComponentPlugins.js +1 -1
- package/lib/plugins/CustomAttributePlugin.js +82 -0
- package/lib/plugins/CustomAttributePlugin.md +35 -0
- package/lib/plugins/EFCPlugin.js +9 -9
- package/lib/plugins/EFCTemplatePlugin.js +10 -12
- package/lib/plugins/EfcResourceCleanupPlugin.js +43 -0
- package/lib/plugins/I18NInjectIntoIndexPlugin.js +8 -9
- package/lib/plugins/I18nSplitPlugin/I18nDebugPlugin.js +2 -3
- package/lib/plugins/I18nSplitPlugin/I18nKeysIdentifer.js +2 -7
- package/lib/plugins/I18nSplitPlugin/index.js +1 -1
- package/lib/plugins/I18nSplitPlugin/utils/propertiesUtils.js +8 -8
- package/lib/plugins/{UglifyCSSPlugin.js → MinifyPlugin.js} +3 -3
- package/lib/plugins/ReportGeneratePlugin.js +8 -6
- package/lib/plugins/ResourceHintsPlugin.js +13 -3
- package/lib/plugins/SelectorPlugin.js +77 -37
- package/lib/plugins/StatsPlugin.js +82 -0
- package/lib/plugins/UnusedFilesFindPlugin.js +7 -5
- package/lib/plugins/VariableConversionCollector.js +40 -101
- package/lib/plugins/index.js +7 -7
- package/lib/plugins/utils/classHandling.js +35 -0
- package/lib/plugins/utils/fileHandling.js +92 -0
- package/lib/plugins/utils/tests/fileHandling.test.js +30 -0
- package/lib/plugins/variableConvertorUtils.js +133 -0
- package/lib/postcss-plugins/EmptyPlugin.js +8 -0
- package/lib/postcss-plugins/ExcludePlugin.js +1 -1
- package/lib/postcss-plugins/IncludePlugin.js +23 -0
- package/lib/postcss-plugins/RTLSplitPlugin.js +4 -10
- package/lib/postcss-plugins/SelectorReplace.js +80 -0
- package/lib/postcss-plugins/ValueReplacer.js +8 -29
- package/lib/postcss-plugins/__test__/selectorReplace.test.js +28 -0
- package/lib/postcss-plugins/__test__/valueReplacer.spec.js +43 -0
- package/lib/postcss-plugins/hoverActivePlugin.js +0 -6
- package/lib/postcss-plugins/variableModificationPlugin/ErrorHandler.js +0 -1
- package/lib/postcss-plugins/variableModificationPlugin/index.js +94 -38
- package/lib/schemas/index.js +95 -18
- package/lib/servers/devBuild.js +13 -11
- package/lib/servers/getCliPath.js +3 -5
- package/lib/servers/httpsOptions.js +12 -13
- package/lib/servers/nowatchserver.js +62 -55
- package/lib/servers/requireLocalOrGlobal.js +61 -0
- package/lib/servers/server.js +53 -52
- package/lib/utils/cssClassNameGenerate.js +70 -13
- package/lib/utils/deprecationSupport.js +134 -0
- package/lib/utils/getOptions.js +35 -28
- package/lib/utils/getServerURL.js +1 -9
- package/lib/utils/index.js +14 -12
- package/lib/utils/initPreCommitHook.js +5 -5
- package/lib/utils/log.js +11 -0
- package/lib/utils/object-manipulation.js +88 -0
- package/lib/utils/pullOrigin.js +3 -3
- package/lib/utils/reinstallDependencies.js +3 -3
- package/lib/utils/selectorReplacer.js +47 -0
- package/lib/utils/switchBranch.js +4 -2
- package/lib/utils/variableConverter.js +104 -0
- package/npm-shrinkwrap.json +33485 -0
- package/package.json +5 -3
- package/templates/docs/all.html +1 -0
- package/templates/docs/component.html +1 -0
- package/templates/docs/components.html +1 -0
- package/templates/docs/css/markdown.css +202 -0
- package/templates/docs/css/style.css +136 -169
- package/templates/docs/index.html +796 -632
- package/lib/plugins/composeCommonPlugin.js +0 -30
- package/lib/postcss-plugins/variableModifier.js +0 -244
@@ -12,14 +12,21 @@ const {
|
|
12
12
|
const pluginName = 'prefetch-preload-chunk-plugin';
|
13
13
|
|
14
14
|
class ResourceHintsPlugin {
|
15
|
+
constructor(options) {
|
16
|
+
this.options = options;
|
17
|
+
}
|
18
|
+
|
15
19
|
apply(compiler) {
|
16
20
|
compiler.hooks.thisCompilation.tap(pluginName, ({
|
17
21
|
mainTemplate
|
18
22
|
}) => {
|
19
23
|
mainTemplate.hooks.requireExtensions.tap(pluginName, (source, chunk, hash) => {
|
24
|
+
const {
|
25
|
+
allowPrefetchingMultipleChunks
|
26
|
+
} = this.options;
|
20
27
|
const idNameMap = chunk.getChunkMaps().name;
|
21
28
|
const nameIdMap = {};
|
22
|
-
let needsMap =
|
29
|
+
let needsMap = allowPrefetchingMultipleChunks;
|
23
30
|
|
24
31
|
for (const key in idNameMap) {
|
25
32
|
if (Object.prototype.hasOwnProperty.call(idNameMap, key)) {
|
@@ -32,7 +39,10 @@ class ResourceHintsPlugin {
|
|
32
39
|
}
|
33
40
|
}
|
34
41
|
|
35
|
-
return Template.asString([source,
|
42
|
+
return Template.asString([source, Template.indent([`const nameToChunkIdMap = ${JSON.stringify(needsMap ? nameIdMap : {})};`, 'const chunkNames = Object.keys(nameToChunkIdMap);']), `${mainTemplate.requireFn}.getChunkIds = function getChunkIds(chunkId) {`, Template.indent([allowPrefetchingMultipleChunks ? `const isRegExAsChunkId = chunkId instanceof RegExp;
|
43
|
+
return isRegExAsChunkId ? chunkNames.filter(chunkName => chunkId.test(chunkName)).map(chunkName => nameToChunkIdMap[chunkName]) : [nameToChunkIdMap[chunkId] || chunkId];` : needsMap ? 'return [nameToChunkIdMap[chunkId] || chunkId];' : 'return [chunkId];']), '}', `// Prefetch a chunk (${pluginName})`, `${mainTemplate.requireFn}.pfc = function prefetchChunk(chunkId) {`, Template.indent([`let chunkIds = ${mainTemplate.requireFn}.getChunkIds(chunkId)`, `chunkIds.forEach(idOfAChunk => {
|
44
|
+
${mainTemplate.requireFn}.e(idOfAChunk);
|
45
|
+
})`]), '};',
|
36
46
|
/*
|
37
47
|
(needsMap
|
38
48
|
? [`chunkId = ${JSON.stringify(nameIdMap)}[chunkId]||chunkId;`]
|
@@ -53,7 +63,7 @@ class ResourceHintsPlugin {
|
|
53
63
|
),
|
54
64
|
'}',
|
55
65
|
*/
|
56
|
-
`// Preload a chunk (${pluginName})`, `${mainTemplate.requireFn}.plc = function preloadChunk(chunkId) {`, Template.indent([`chunkId = ${mainTemplate.requireFn}.
|
66
|
+
`// Preload a chunk (${pluginName})`, `${mainTemplate.requireFn}.plc = function preloadChunk(chunkId) {`, Template.indent([`chunkId = ${mainTemplate.requireFn}.getChunkIds(chunkId)[0]`, 'if(installedChunks[chunkId] === undefined) {', Template.indent(['installedChunks[chunkId] = null;', mainTemplate.hooks.linkPreload.call('', chunk, hash), 'document.head.appendChild(link);', `${mainTemplate.requireFn}.e(chunkId);` // 'var head = document.getElementsByTagName(\'head\')[0];',
|
57
67
|
// mainTemplate.hooks.jsonpScript.call('', chunk, hash),
|
58
68
|
// 'head.appendChild(script);'
|
59
69
|
]), '}']), '};']);
|
@@ -9,51 +9,53 @@ var _postcss = _interopRequireDefault(require("postcss"));
|
|
9
9
|
|
10
10
|
var _fs = _interopRequireDefault(require("fs"));
|
11
11
|
|
12
|
-
var
|
12
|
+
var _classHandling = require("./utils/classHandling");
|
13
13
|
|
14
|
-
|
14
|
+
var _fileHandling = require("./utils/fileHandling");
|
15
15
|
|
16
|
-
|
16
|
+
var _windowsModification = require("../loaderUtils/windowsModification");
|
17
17
|
|
18
|
-
|
18
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
19
19
|
|
20
|
-
function
|
20
|
+
function selectorWeightPrefixAdder(rootOriginal, selector, excludeStrings) {
|
21
21
|
rootOriginal.walkRules((rule, index) => {
|
22
|
-
const prevNode = rootOriginal.nodes[index - 1];
|
22
|
+
const prevNode = rootOriginal.nodes[index - 1] || null;
|
23
23
|
|
24
|
-
if (
|
24
|
+
if ((0, _classHandling.hasPrevNodeIgnore)(index, prevNode, 'updateselector:ignore')) {
|
25
25
|
return;
|
26
|
-
}
|
26
|
+
} // console.log(rule.selector.split(','));
|
27
|
+
|
27
28
|
|
28
|
-
|
29
|
-
|
29
|
+
const selectorArr = rule.selector.split(',');
|
30
|
+
selectorArr.forEach((singleSelectorStr, index) => {
|
31
|
+
if (excludeStrings.includes(singleSelectorStr.trim())) {
|
30
32
|
return;
|
31
|
-
}
|
32
|
-
}
|
33
|
+
} // NOTE: below logic for attrbute related
|
33
34
|
|
34
|
-
if (excludeStrings.includes(rule.selector)) {
|
35
|
-
return;
|
36
|
-
}
|
37
35
|
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
36
|
+
if (singleSelectorStr.includes(']')) {
|
37
|
+
// console.log(singleSelectorStr);
|
38
|
+
const prefixPart = singleSelectorStr.slice(0, singleSelectorStr.lastIndexOf(']') + 1).trim();
|
39
|
+
const selectorPart = singleSelectorStr.slice(singleSelectorStr.lastIndexOf(']') + 1).trim();
|
40
|
+
|
41
|
+
if (excludeStrings.includes(selectorPart.trim())) {
|
42
42
|
return;
|
43
|
-
}
|
44
|
-
// rule.slice(rule.lastIndexOf(']') + 2).trim(),
|
45
|
-
// rule.slice(rule.lastIndexOf(']') + 2).trim() !== ''
|
46
|
-
// );
|
43
|
+
}
|
47
44
|
|
45
|
+
if (/^:/gi.test(selectorPart)) {
|
46
|
+
return;
|
47
|
+
}
|
48
48
|
|
49
|
-
|
49
|
+
if (selectorPart !== '') {
|
50
|
+
selectorArr[index] = `${prefixPart} ${selector}${selectorPart}`;
|
51
|
+
}
|
50
52
|
|
51
53
|
return;
|
52
54
|
}
|
53
55
|
|
54
|
-
|
56
|
+
selectorArr[index] = `${selector}${singleSelectorStr}`;
|
55
57
|
});
|
56
|
-
rule.selector =
|
58
|
+
rule.selector = selectorArr.join(',\n');
|
57
59
|
});
|
58
60
|
return rootOriginal;
|
59
61
|
}
|
@@ -62,6 +64,8 @@ class SelectorPlugin {
|
|
62
64
|
constructor(options = {}) {
|
63
65
|
this.optimize = options.optimize;
|
64
66
|
this.selectorWeightConfig = options.selectorWeightConfig;
|
67
|
+
this.exclude = options.exclude;
|
68
|
+
this.patterns = options.patterns;
|
65
69
|
}
|
66
70
|
|
67
71
|
apply(compiler) {
|
@@ -74,19 +78,55 @@ class SelectorPlugin {
|
|
74
78
|
const rawdata = _fs.default.readFileSync(customFileDetails);
|
75
79
|
|
76
80
|
const data = JSON.parse(rawdata);
|
81
|
+
this.exclude = (0, _windowsModification.windowsModification)(this.exclude);
|
77
82
|
compiler.hooks.compilation.tap('selector-weight-rewrite', compilation => {
|
78
|
-
compilation.hooks.
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
83
|
+
compilation.hooks.optimizeModules.tap('selector-weight-rewrite', modules => {
|
84
|
+
const mods = modules.filter(x => x.type.includes('css'));
|
85
|
+
mods.forEach(module => {
|
86
|
+
const rootOriginal = _postcss.default.parse(module.content);
|
87
|
+
|
88
|
+
const filename = module.issuer.resource;
|
89
|
+
/*
|
90
|
+
input :
|
91
|
+
filename : 'D:/MyWork/..../desk_client_app/supportapp/src/components/Avatar/Avatar.module.css,
|
92
|
+
|
93
|
+
patterns.cssVariableReplacement:
|
94
|
+
// include src folder, include deskapp folder, exclude node modules
|
95
|
+
"selectorWeight": [
|
96
|
+
"src",
|
97
|
+
"deskapp",
|
98
|
+
"!node_modules"
|
99
|
+
]
|
100
|
+
|
101
|
+
output :
|
102
|
+
true or false
|
103
|
+
*/
|
104
|
+
|
105
|
+
if (!(0, _fileHandling.isFileNameMatchingPluginPattern)({
|
106
|
+
filename,
|
107
|
+
filterArr: this.patterns.selectorWeight
|
108
|
+
})) {
|
109
|
+
return;
|
110
|
+
}
|
111
|
+
/*
|
112
|
+
|
113
|
+
filename : Deskapp.module.css ?
|
114
|
+
data :
|
115
|
+
{
|
116
|
+
"DeskApp.module.css": {"defaultSelector" : ".desk_app_ui "}
|
117
|
+
}
|
118
|
+
selectorWeightConfig :
|
119
|
+
defaultSelector : .zoho_desk_ui
|
120
|
+
|
121
|
+
case filename = 'DeskApp.module.css' ?
|
122
|
+
data[filename].defaultSelector = '.desk_app_ui'
|
123
|
+
case filename is different ?
|
124
|
+
defaultSelector = '.zoho_desk_ui'
|
125
|
+
*/
|
126
|
+
|
127
|
+
|
128
|
+
module.content = selectorWeightPrefixAdder(rootOriginal, data[filename] ? data[filename].defaultSelector : defaultSelector, excludeStrings).toString();
|
88
129
|
});
|
89
|
-
callback();
|
90
130
|
});
|
91
131
|
});
|
92
132
|
}
|
@@ -0,0 +1,82 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
const fs = require('fs');
|
4
|
+
|
5
|
+
const path = require('path');
|
6
|
+
|
7
|
+
const {
|
8
|
+
Readable
|
9
|
+
} = require('stream');
|
10
|
+
|
11
|
+
const {
|
12
|
+
removeKeysFromObject,
|
13
|
+
convertObjectToStringGen
|
14
|
+
} = require('../utils/object-manipulation');
|
15
|
+
|
16
|
+
const pluginName = 'stats-plugin';
|
17
|
+
const statsSchema = {
|
18
|
+
all: true
|
19
|
+
};
|
20
|
+
|
21
|
+
class StatsPlugin {
|
22
|
+
constructor({
|
23
|
+
statsOptions,
|
24
|
+
statsOutputExcludeKeys,
|
25
|
+
statsFileName
|
26
|
+
}) {
|
27
|
+
this.excludeKeysInStat = statsOutputExcludeKeys || [];
|
28
|
+
this.statsFileName = statsFileName || 'bundle-report-integrity.json';
|
29
|
+
this.statsOptions = Object.assign({}, statsSchema, statsOptions || {});
|
30
|
+
}
|
31
|
+
|
32
|
+
apply(compiler) {
|
33
|
+
compiler.hooks.done.tapAsync(pluginName, (stats, callback) => {
|
34
|
+
const statsJson = removeKeysFromObject(stats.toJson(this.statsOptions), this.excludeKeysInStat);
|
35
|
+
this.emitStats(statsJson).on('end', () => {
|
36
|
+
callback();
|
37
|
+
}).on('error', e => {
|
38
|
+
callback(e);
|
39
|
+
});
|
40
|
+
});
|
41
|
+
}
|
42
|
+
|
43
|
+
writeStatsFileInAStream(statsObj) {
|
44
|
+
const {
|
45
|
+
outputPath
|
46
|
+
} = statsObj;
|
47
|
+
const ouputFileName = path.join(outputPath, this.statsFileName);
|
48
|
+
return this.createReadStream(statsObj).pipe(fs.createWriteStream(ouputFileName));
|
49
|
+
}
|
50
|
+
|
51
|
+
createReadStream(statsObj) {
|
52
|
+
const excludeKeys = this.excludeKeysInStat;
|
53
|
+
return new Readable({
|
54
|
+
read() {
|
55
|
+
let isDone = false;
|
56
|
+
const objToStringGen = convertObjectToStringGen(statsObj, excludeKeys);
|
57
|
+
|
58
|
+
while (!isDone) {
|
59
|
+
const {
|
60
|
+
done,
|
61
|
+
value
|
62
|
+
} = objToStringGen.next();
|
63
|
+
|
64
|
+
if (done) {
|
65
|
+
isDone = true;
|
66
|
+
this.push(null);
|
67
|
+
} else {
|
68
|
+
this.push(value);
|
69
|
+
}
|
70
|
+
}
|
71
|
+
}
|
72
|
+
|
73
|
+
});
|
74
|
+
}
|
75
|
+
|
76
|
+
emitStats(statsJson) {
|
77
|
+
return this.writeStatsFileInAStream(statsJson);
|
78
|
+
}
|
79
|
+
|
80
|
+
}
|
81
|
+
|
82
|
+
module.exports = StatsPlugin;
|
@@ -11,6 +11,8 @@ var _fs = _interopRequireDefault(require("fs"));
|
|
11
11
|
|
12
12
|
var _utils = require("../utils");
|
13
13
|
|
14
|
+
var _log = require("../utils/log");
|
15
|
+
|
14
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
15
17
|
|
16
18
|
let excludeDocsJSON = '{}';
|
@@ -97,10 +99,10 @@ class UnusedFilesFindPlugin {
|
|
97
99
|
Object.keys(unDocsCompObj).forEach(key => {
|
98
100
|
if (unDocsCompObj[key].length > 0) {
|
99
101
|
if (key === 'withoutDocs') {
|
100
|
-
(0,
|
102
|
+
(0, _log.log)('\x1b[36m%s\x1b[0m', '\nPlease write docs file for below componenst :- \n');
|
101
103
|
unDocsCompObj[key].forEach(value => {
|
102
104
|
if (!excludeDocsArray.docs.exclude.includes(value)) {
|
103
|
-
(0,
|
105
|
+
(0, _log.log)('\x1b[33m%s\x1b[0m', `${value}`);
|
104
106
|
}
|
105
107
|
});
|
106
108
|
}
|
@@ -162,10 +164,10 @@ class UnusedFilesFindPlugin {
|
|
162
164
|
});
|
163
165
|
|
164
166
|
if (!unusedFiles.length) {
|
165
|
-
(0,
|
167
|
+
(0, _log.log)('There is no unused files');
|
166
168
|
} else {
|
167
169
|
if (this.outputFileName) {
|
168
|
-
(0,
|
170
|
+
(0, _log.log)(`You can see unused files info from ${_path.default.join(outputPath, this.outputFileName)} path`);
|
169
171
|
(0, _utils.makeDir)(outputPath);
|
170
172
|
(0, _utils.writeFile)(_path.default.join(outputPath, this.outputFileName), JSON.stringify(unusedFiles)).then(() => {
|
171
173
|
if (this.sstest) {
|
@@ -179,7 +181,7 @@ class UnusedFilesFindPlugin {
|
|
179
181
|
unusedFiles.forEach(file => {
|
180
182
|
_fs.default.unlinkSync(file);
|
181
183
|
|
182
|
-
(0,
|
184
|
+
(0, _log.log)(`Deleted - ${file}`);
|
183
185
|
});
|
184
186
|
}
|
185
187
|
});
|
@@ -9,12 +9,15 @@ var _postcss = _interopRequireDefault(require("postcss"));
|
|
9
9
|
|
10
10
|
var _ErrorHandler = require("../postcss-plugins/variableModificationPlugin/ErrorHandler");
|
11
11
|
|
12
|
+
var _fileHandling = require("./utils/fileHandling");
|
13
|
+
|
14
|
+
var _variableConvertorUtils = require("./variableConvertorUtils");
|
15
|
+
|
12
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
13
17
|
|
14
18
|
// import { RawSource } from 'webpack-sources';
|
15
19
|
const fs = require('fs');
|
16
20
|
|
17
|
-
const ignoreVals = ['--zd_size', '--zd_font_size', '--size', '--size_'];
|
18
21
|
let variablesRead = {};
|
19
22
|
|
20
23
|
const {
|
@@ -23,29 +26,7 @@ const {
|
|
23
26
|
errHandler
|
24
27
|
} = require('../postcss-plugins/variableModificationPlugin/index');
|
25
28
|
|
26
|
-
const supportedProps = ['font-size', 'margin', 'margin-top', 'margin-bottom', 'margin-left', 'margin-right', 'padding', 'padding-top', 'padding-bottom', 'padding-left', 'padding-right', '^top', '^right', '^bottom', '^left', '^width', 'min-width', 'max-width', '^height', 'min-height', 'max-height', 'text-indent', 'clip', 'flex-basis', 'row-gap', 'gap', 'column-gap', 'flex']; //
|
27
|
-
// -- is issue IO --
|
28
|
-
|
29
|
-
/*
|
30
|
-
issues eg :
|
31
|
-
issues = ['--zd_size', '--zd_font_size', '--size', '--size_'];
|
32
|
-
input :
|
33
|
-
--zd_size
|
34
|
-
output :
|
35
|
-
true
|
36
|
-
comment :
|
37
|
-
do not execute when --zd_size comes as prop
|
38
|
-
*/
|
39
|
-
|
40
|
-
function isIgnoreValuePresent(ignoreVals, prop) {
|
41
|
-
let present = false;
|
42
|
-
ignoreVals.forEach(issue => {
|
43
|
-
if (prop && prop.includes(issue)) {
|
44
|
-
present = true;
|
45
|
-
}
|
46
|
-
});
|
47
|
-
return present;
|
48
|
-
} // -- to convert the hyphen values to values --
|
29
|
+
const supportedProps = ['font-size', 'margin', 'margin-top', 'margin-bottom', 'margin-left', 'margin-right', 'padding', 'padding-top', 'padding-bottom', 'padding-left', 'padding-right', '^top', '^right', '^bottom', '^left', '^width', 'min-width', 'max-width', '^height', 'min-height', 'max-height', 'text-indent', 'clip', 'flex-basis', 'row-gap', 'gap', 'column-gap', 'flex']; // -- to convert the hyphen values to values --
|
49
30
|
|
50
31
|
/*
|
51
32
|
input :
|
@@ -57,49 +38,6 @@ comment :
|
|
57
38
|
to make the variable object using the output as key and decl.prop such as font-size as value
|
58
39
|
*/
|
59
40
|
|
60
|
-
|
61
|
-
function extractVariableName(val) {
|
62
|
-
return val.replace(/calc\((.+)\)/gi, '$1').replace(/var\((.+)\)/gi, '$1').replace('-1', '').replace('*', '').replace('\n', '').trim();
|
63
|
-
}
|
64
|
-
|
65
|
-
function rootConvertor(rootOriginal, variables, settingsObject) {
|
66
|
-
rootOriginal.walkRules(rule => {
|
67
|
-
rule.nodes.forEach((decl, index) => {
|
68
|
-
const prevNode = rule.nodes[index - 1];
|
69
|
-
const currentNode = rule.nodes[index];
|
70
|
-
|
71
|
-
if (decl.prop && decl.prop.includes('--')) {
|
72
|
-
if (prevNode && prevNode.type === 'comment' && prevNode.text.toLowerCase() === 'variable:ignore') {
|
73
|
-
return;
|
74
|
-
}
|
75
|
-
|
76
|
-
if (isIgnoreValuePresent(ignoreVals, decl.prop)) {
|
77
|
-
return;
|
78
|
-
}
|
79
|
-
|
80
|
-
if (settingsObject[variables[decl.prop]]) {
|
81
|
-
/* if there is no value for property, set it to default so that undefined doesn't get called as key */
|
82
|
-
if (!variables[decl.prop]) {
|
83
|
-
variables[decl.prop] = 'default';
|
84
|
-
}
|
85
|
-
|
86
|
-
const pxReplacement = settingsObject[variables[decl.prop]].replacements.px;
|
87
|
-
const valArr = decl.value.split(' '); // single values are considered in the above array and converted below
|
88
|
-
|
89
|
-
valArr.forEach((value, index) => {
|
90
|
-
if (value.includes('px')) {
|
91
|
-
const num = value.replace('px', '');
|
92
|
-
valArr[index] = pxReplacement.replace('$$', num);
|
93
|
-
}
|
94
|
-
});
|
95
|
-
currentNode.value = valArr.join(' ');
|
96
|
-
}
|
97
|
-
}
|
98
|
-
});
|
99
|
-
});
|
100
|
-
return rootOriginal;
|
101
|
-
}
|
102
|
-
|
103
41
|
function createFolderIfNonExistant(path) {
|
104
42
|
if (!fs.existsSync(path)) {
|
105
43
|
fs.mkdirSync(path, {
|
@@ -118,10 +56,12 @@ class VariableConversionCollector {
|
|
118
56
|
constructor(options = {}) {
|
119
57
|
this.optimize = options.optimize;
|
120
58
|
this.filename = options.cssVariableReplacementConfig;
|
121
|
-
this.
|
59
|
+
this.patterns = options.patterns; // console.log(options.patterns, this.patterns);
|
60
|
+
|
61
|
+
this.initializeFiles();
|
122
62
|
}
|
123
63
|
|
124
|
-
|
64
|
+
initializeFiles() {
|
125
65
|
createFolderIfNonExistant('./.cli/logs/');
|
126
66
|
createFolderIfNonExistant('./.cli/config/variables/');
|
127
67
|
createFolderIfNonExistant('./.cli/config/selectorWeight/');
|
@@ -131,7 +71,8 @@ class VariableConversionCollector {
|
|
131
71
|
|
132
72
|
apply(compiler) {
|
133
73
|
const variables = {};
|
134
|
-
const unassigned = {};
|
74
|
+
const unassigned = {}; // console.log(windowsModification([this.filename])[0]);
|
75
|
+
|
135
76
|
const rawdata = fs.readFileSync(this.filename);
|
136
77
|
const data = JSON.parse(rawdata);
|
137
78
|
const {
|
@@ -183,16 +124,13 @@ class VariableConversionCollector {
|
|
183
124
|
rootOriginal.walkRules(rule => {
|
184
125
|
rule.walkDecls(decl => {
|
185
126
|
decl.value.split(' ').forEach(val => {
|
186
|
-
if (val && val.includes('--') && !new RegExp(ignoreVals.join('|'), 'gi').test(val) && decl.prop) {
|
187
|
-
const extractedValue = extractVariableName(val);
|
127
|
+
if (val && val.includes('--') && !new RegExp(_variableConvertorUtils.ignoreVals.join('|'), 'gi').test(val) && decl.prop) {
|
128
|
+
const extractedValue = (0, _variableConvertorUtils.extractVariableName)(val);
|
188
129
|
|
189
130
|
if (!variables[extractedValue]) {
|
190
131
|
variables[extractedValue] = decl.prop;
|
191
132
|
} else {
|
192
133
|
if (new RegExp(supportedProps.join('|'), 'gi').test(decl.prop)) {
|
193
|
-
// console.log(
|
194
|
-
// `${extractedValue} : ${variables[extractedValue]} already exists please check!`
|
195
|
-
// );
|
196
134
|
if (errorsAllowed.MULTIPLE_OCCURANCES) {
|
197
135
|
const errObj = {
|
198
136
|
decl,
|
@@ -206,7 +144,6 @@ class VariableConversionCollector {
|
|
206
144
|
}
|
207
145
|
}
|
208
146
|
} else {
|
209
|
-
// console.log(decl.prop);
|
210
147
|
if (/^--/gi.test(decl.prop) && val.trim() !== '' && !variables[decl.prop]) {
|
211
148
|
if (!Object.keys(variablesRead.ignore).includes(decl.prop)) {
|
212
149
|
unassigned[decl.prop] = variables[decl.prop];
|
@@ -238,7 +175,7 @@ class VariableConversionCollector {
|
|
238
175
|
});
|
239
176
|
}
|
240
177
|
});
|
241
|
-
}); // -- conversion for the root using
|
178
|
+
}); // -- conversion for the root using variableConvertor --
|
242
179
|
|
243
180
|
/*
|
244
181
|
input :
|
@@ -256,9 +193,33 @@ class VariableConversionCollector {
|
|
256
193
|
compilation.hooks.optimizeModules.tap('VariableConversionCollector', modules => {
|
257
194
|
const mods = modules.filter(x => x.type.includes('css'));
|
258
195
|
mods.forEach(module => {
|
196
|
+
const filename = module.issuer.resource;
|
197
|
+
/*
|
198
|
+
input :
|
199
|
+
filename : 'D:/MyWork/..../desk_client_app/supportapp/src/components/Avatar/Avatar.module.css,
|
200
|
+
|
201
|
+
patterns.cssVariableReplacement:
|
202
|
+
// include src folder, include deskapp folder, exclude node modules
|
203
|
+
"cssVariableReplacement": [
|
204
|
+
"src",
|
205
|
+
"deskapp",
|
206
|
+
"!node_modules"
|
207
|
+
]
|
208
|
+
|
209
|
+
output :
|
210
|
+
true or false
|
211
|
+
*/
|
212
|
+
|
213
|
+
if (!(0, _fileHandling.isFileNameMatchingPluginPattern)({
|
214
|
+
filename,
|
215
|
+
filterArr: this.patterns.cssVariableReplacement
|
216
|
+
})) {
|
217
|
+
return;
|
218
|
+
}
|
219
|
+
|
259
220
|
const rootOriginal = _postcss.default.parse(module.content);
|
260
221
|
|
261
|
-
module.content =
|
222
|
+
module.content = (0, _variableConvertorUtils.variableConverter)(rootOriginal, variables, settingsObject).toString();
|
262
223
|
});
|
263
224
|
});
|
264
225
|
});
|
@@ -292,29 +253,7 @@ class VariableConversionCollector {
|
|
292
253
|
if (a.type < b.type) {
|
293
254
|
return -1;
|
294
255
|
}
|
295
|
-
});
|
296
|
-
// const newVars = Object.keys(variables)
|
297
|
-
// //Filter Object with key contanis "NAME"
|
298
|
-
// .filter(key => variables[key].includes('--'))
|
299
|
-
// .reduce(
|
300
|
-
// (obj, key) =>
|
301
|
-
// Object.assign(obj, {
|
302
|
-
// [key]: variables[key]
|
303
|
-
// }),
|
304
|
-
// {}
|
305
|
-
// );
|
306
|
-
// console.log('new variables: ', newVars);
|
307
|
-
// try {
|
308
|
-
// fs.writeFileSync('./variableMapping.json', JSON.stringify(variables));
|
309
|
-
// } catch (err) {
|
310
|
-
// console.log(err);
|
311
|
-
// }
|
312
|
-
// fs.writeFile('./variableMapping.json', JSON.stringify(variables), err => {
|
313
|
-
// if (err) {
|
314
|
-
// throw err;
|
315
|
-
// }
|
316
|
-
// console.log('variable mapping file generated.');
|
317
|
-
// });
|
256
|
+
});
|
318
257
|
|
319
258
|
if (errorConsoleStatus) {
|
320
259
|
const errorHandler = new _ErrorHandler.ErrorHandler();
|
package/lib/plugins/index.js
CHANGED
@@ -33,6 +33,12 @@ Object.defineProperty(exports, "ManifestPlugin", {
|
|
33
33
|
return _ManifestPlugin.default;
|
34
34
|
}
|
35
35
|
});
|
36
|
+
Object.defineProperty(exports, "MinifyPlugin", {
|
37
|
+
enumerable: true,
|
38
|
+
get: function () {
|
39
|
+
return _MinifyPlugin.default;
|
40
|
+
}
|
41
|
+
});
|
36
42
|
Object.defineProperty(exports, "ModuleStatsPlugin", {
|
37
43
|
enumerable: true,
|
38
44
|
get: function () {
|
@@ -99,12 +105,6 @@ Object.defineProperty(exports, "TPHashMappingPlugin", {
|
|
99
105
|
return _TPHashMappingPlugin.default;
|
100
106
|
}
|
101
107
|
});
|
102
|
-
Object.defineProperty(exports, "UglifyCSSPlugin", {
|
103
|
-
enumerable: true,
|
104
|
-
get: function () {
|
105
|
-
return _UglifyCSSPlugin.default;
|
106
|
-
}
|
107
|
-
});
|
108
108
|
Object.defineProperty(exports, "UnusedFilesFindPlugin", {
|
109
109
|
enumerable: true,
|
110
110
|
get: function () {
|
@@ -126,7 +126,7 @@ var _OptimizeJSPlugin = _interopRequireDefault(require("./OptimizeJSPlugin"));
|
|
126
126
|
|
127
127
|
var _ResourceHintsPlugin = _interopRequireDefault(require("./ResourceHintsPlugin"));
|
128
128
|
|
129
|
-
var
|
129
|
+
var _MinifyPlugin = _interopRequireDefault(require("./MinifyPlugin"));
|
130
130
|
|
131
131
|
var _ManifestPlugin = _interopRequireDefault(require("./ManifestPlugin"));
|
132
132
|
|
@@ -0,0 +1,35 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.hasPrevNodeIgnore = hasPrevNodeIgnore;
|
7
|
+
exports.isAtRule = isAtRule;
|
8
|
+
exports.isComment = isComment;
|
9
|
+
exports.isCommentContentSame = isCommentContentSame;
|
10
|
+
exports.isInsideMediaQuery = isInsideMediaQuery;
|
11
|
+
exports.isThisComment = isThisComment;
|
12
|
+
|
13
|
+
function isComment(node) {
|
14
|
+
return node && node.type && node.type === 'comment';
|
15
|
+
}
|
16
|
+
|
17
|
+
function isCommentContentSame(node, content) {
|
18
|
+
return node.text.toLowerCase() === content;
|
19
|
+
}
|
20
|
+
|
21
|
+
function isThisComment(node, ignoreComment) {
|
22
|
+
return isComment(node) && isCommentContentSame(node, ignoreComment);
|
23
|
+
}
|
24
|
+
|
25
|
+
function hasPrevNodeIgnore(index, prevNode, ignoreComment) {
|
26
|
+
return index !== 0 && isThisComment(prevNode, ignoreComment);
|
27
|
+
}
|
28
|
+
|
29
|
+
function isAtRule(rule) {
|
30
|
+
return rule.parent && rule.parent.type === 'atrule';
|
31
|
+
}
|
32
|
+
|
33
|
+
function isInsideMediaQuery(rule) {
|
34
|
+
return isAtRule(rule) && rule.parent && rule.parent.name === 'media' ? true : false;
|
35
|
+
}
|