@zohodesk/react-cli 1.0.2 → 1.0.3-exp.2
Sign up to get free protection for your applications and to get access to all the features.
- package/.eslintignore +7 -7
- package/.eslintrc.js +180 -180
- package/.prettierrc +6 -6
- package/Changelog.md +1019 -1019
- package/README.md +1209 -1165
- package/bin/cli.js +489 -483
- package/docs/ComposeMinification.md +14 -0
- package/docs/CustomChunks.md +26 -26
- package/docs/DevServerPort.md +39 -39
- package/docs/DevStart.md +18 -18
- package/docs/HoverActive.md +12 -12
- package/docs/InstallNode.md +28 -28
- package/docs/SelectorWeight.md +8 -8
- package/docs/TODOS.md +10 -10
- package/docs/ValueReplacer.md +60 -60
- package/docs/VariableConversion.md +729 -729
- package/docs/warnings_while_install.txt +35 -35
- package/files/eslintrc.js +62 -62
- package/files/prettierrc.js +3 -3
- package/lib/common/buildEs.js +12 -0
- package/lib/common/testPattern.js +0 -2
- package/lib/common/valueReplacer.js +1 -3
- package/lib/configs/resolvers.js +14 -3
- package/lib/configs/webpack.css.umd.config.js +4 -4
- package/lib/configs/webpack.dev.config.js +6 -0
- package/lib/configs/webpack.docs.config.js +4 -0
- package/lib/configs/webpack.impact.config.js +4 -0
- package/lib/configs/webpack.prod.config.js +6 -0
- package/lib/loaderUtils/configsAssetsLoaders.js +33 -33
- package/lib/loaderUtils/getCSSLoaders.js +78 -49
- package/lib/loaderUtils/tests/windowsModification.test.js +10 -0
- package/lib/loaderUtils/windowsModification.js +6 -1
- package/lib/loaders/composeLoader.js +172 -0
- package/lib/loaders/selectorMappingLoader.js +9 -9
- package/lib/loaders/workerLoader.js +9 -9
- package/lib/logger.js +20 -0
- package/lib/pluginUtils/getDevPlugins.js +23 -8
- package/lib/pluginUtils/getProdPlugins.js +20 -8
- 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/EFCPlugin.md +6 -6
- package/lib/plugins/EFCTemplatePlugin.js +10 -12
- package/lib/plugins/I18NInjectIntoIndexPlugin.js +12 -13
- package/lib/plugins/I18nSplitPlugin/I18nDebugPlugin.js +2 -3
- package/lib/plugins/I18nSplitPlugin/I18nDownlodLogic.js +38 -38
- package/lib/plugins/I18nSplitPlugin/I18nFilesEmitter.js +30 -30
- package/lib/plugins/I18nSplitPlugin/I18nKeysIdentifer.js +10 -15
- package/lib/plugins/I18nSplitPlugin/I18nSplit.md +95 -95
- package/lib/plugins/I18nSplitPlugin/README.md +25 -25
- package/lib/plugins/I18nSplitPlugin/index.js +57 -57
- package/lib/plugins/I18nSplitPlugin/utils/propertiesUtils.js +8 -8
- package/lib/plugins/{UglifyCSSPlugin.js → MinifyPlugin.js} +3 -3
- package/lib/plugins/ResourceHintsPlugin.js +17 -17
- package/lib/plugins/RtlSplitPlugin/RtlCssPlugin.js +6 -6
- package/lib/plugins/RtlSplitPlugin/RtrSplit.md +30 -30
- package/lib/plugins/SelectorPlugin.js +66 -48
- package/lib/plugins/ServiceWorkerPlugin.js +9 -9
- package/lib/plugins/TPHashMappingPlugin.js +4 -4
- package/lib/plugins/VariableConversionCollector.js +94 -88
- package/lib/plugins/index.js +7 -7
- package/lib/plugins/utils/classHandling.js +20 -0
- package/lib/plugins/utils/fileHandling.js +107 -0
- package/lib/plugins/utils/tests/fileHandling.test.js +30 -0
- package/lib/postcss-plugins/EmptyPlugin.js +8 -0
- package/lib/postcss-plugins/ExcludePlugin.js +1 -1
- package/lib/postcss-plugins/IncludePlugin.js +0 -1
- package/lib/postcss-plugins/RTLSplitPlugin.js +14 -20
- package/lib/postcss-plugins/ValueReplacer.js +2 -13
- package/lib/postcss-plugins/__test__/test1Input.css +38 -38
- package/lib/postcss-plugins/__test__/test1Output.css +38 -38
- package/lib/postcss-plugins/hoverActivePlugin.js +3 -9
- package/lib/postcss-plugins/variableModificationPlugin/index.js +2 -21
- package/lib/schemas/index.js +39 -4
- package/lib/servers/devBuild.js +13 -11
- package/lib/servers/httpsOptions.js +12 -13
- package/lib/servers/nowatchserver.js +5 -3
- package/lib/servers/requireLocalOrGlobal.js +61 -0
- package/lib/servers/server.js +3 -5
- package/lib/sh/pre-commit.sh +34 -34
- package/lib/sh/reportPublish.sh +45 -45
- package/lib/utils/buildstats.html +148 -148
- package/lib/utils/cssClassNameGenerate.js +38 -12
- package/lib/utils/getOptions.js +9 -0
- package/lib/utils/resultSchema.json +73 -73
- package/lib/utils/variableConvertor.js +159 -0
- package/npm8.md +9 -9
- package/package-lock.json +14412 -0
- package/package.json +121 -120
- package/postpublish.js +8 -8
- package/templates/app/.eslintrc.js +140 -140
- package/templates/app/README.md +12 -12
- package/templates/app/app/index.html +24 -24
- package/templates/app/app/properties/ApplicationResources_en_US.properties +1 -1
- package/templates/app/app/properties/i18nkeys.json +3 -3
- package/templates/app/docs/all.html +69 -69
- package/templates/app/mockapi/index.js +18 -18
- package/templates/app/package.json +37 -37
- package/templates/app/src/actions/SampleActions/index.js +37 -37
- package/templates/app/src/actions/index.js +65 -65
- package/templates/app/src/appUrls.js +19 -19
- package/templates/app/src/components/Alert/Alert.js +134 -134
- package/templates/app/src/components/Alert/Alert.module.css +79 -79
- package/templates/app/src/components/FreezeLayer/FreezeLayer.css +37 -37
- package/templates/app/src/components/FreezeLayer/FreezeLayer.js +84 -84
- package/templates/app/src/components/Sample/Sample.module.css +11 -11
- package/templates/app/src/components/Sample/SampleList.js +61 -61
- package/templates/app/src/components/Slider/Slider.css +41 -41
- package/templates/app/src/components/Slider/Slider.js +55 -55
- package/templates/app/src/containers/AlertContainer/index.js +15 -15
- package/templates/app/src/containers/AppContainer/index.js +96 -96
- package/templates/app/src/containers/AppContainer/index.module.css +27 -27
- package/templates/app/src/containers/CustomMatch/index.js +65 -65
- package/templates/app/src/containers/DevTools/index.js +10 -10
- package/templates/app/src/containers/Header/index.js +67 -67
- package/templates/app/src/containers/Header/index.module.css +43 -43
- package/templates/app/src/containers/Redirect/index.js +63 -63
- package/templates/app/src/containers/Redirector/index.js +47 -47
- package/templates/app/src/containers/SampleListContainer/ListContainer.js +42 -42
- package/templates/app/src/containers/SampleListContainer/ListContainer.module.css +3 -3
- package/templates/app/src/historyChange.js +5 -5
- package/templates/app/src/index.html +10 -10
- package/templates/app/src/index.js +24 -24
- package/templates/app/src/middleware/PromiseMiddleware.js +59 -59
- package/templates/app/src/reducers/alertData.js +11 -11
- package/templates/app/src/reducers/index.js +6 -6
- package/templates/app/src/reducers/samples.js +19 -19
- package/templates/app/src/store/configureStore.dev.js +51 -51
- package/templates/app/src/store/configureStore.js +5 -5
- package/templates/app/src/store/configureStore.prod.js +26 -26
- package/templates/app/src/util/Common.js +5 -5
- package/templates/app/src/util/RequestAPI.js +132 -132
- package/templates/docs/all.html +249 -249
- package/templates/docs/component.html +178 -178
- package/templates/docs/components.html +221 -221
- package/templates/docs/css/b.min.css +6 -6
- package/templates/docs/css/component.css +42 -42
- package/templates/docs/css/componentTest.css +6 -6
- package/templates/docs/css/hopscotch.css +585 -585
- package/templates/docs/css/style.css +1022 -1022
- package/templates/docs/impactReportTemplate.html +154 -154
- package/templates/docs/index.html +1501 -1501
- package/templates/docs/js/active-line.js +72 -72
- package/templates/docs/js/b.min.js +7 -7
- package/templates/docs/js/codemirror.js +9680 -9680
- package/templates/docs/js/designTokens.js +334 -334
- package/templates/docs/js/j.min.js +4 -4
- package/templates/docs/js/javascript.js +874 -874
- package/templates/docs/js/matchbrackets.js +145 -145
- package/lib/plugins/composeCommonPlugin.js +0 -30
- package/lib/postcss-plugins/variableModifier.js +0 -244
- package/result.json +0 -1
- package/unittest/index.html +0 -37
@@ -4,8 +4,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.windowsModification = windowsModification;
|
7
|
+
exports.windowsModificationFile = windowsModificationFile;
|
7
8
|
const isWin = process.platform === 'win32';
|
8
9
|
|
9
10
|
function windowsModification(array) {
|
10
11
|
return isWin ? array && Array.isArray(array) && array.map(r => r.replace(/\//g, '\\')) : array;
|
11
|
-
}
|
12
|
+
}
|
13
|
+
|
14
|
+
function windowsModificationFile(filename) {
|
15
|
+
return isWin ? filename.replace(/\//g, '\\') : filename;
|
16
|
+
} // module.exports = { windowsModification, windowsModificationFile };
|
@@ -0,0 +1,172 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
var _path = _interopRequireDefault(require("path"));
|
4
|
+
|
5
|
+
var _postcss = _interopRequireDefault(require("postcss"));
|
6
|
+
|
7
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
8
|
+
|
9
|
+
const supportedProps = ['margin-top', 'margin-bottom', 'margin-left', 'margin-right', // 'margin',
|
10
|
+
'padding-top', 'padding-bottom', 'padding-left', 'padding-right', // 'padding',
|
11
|
+
'top', 'bottom', 'left', 'right', 'height', 'width', 'min-height', 'min-width', 'max-height', 'max-width'];
|
12
|
+
const renameProps = {
|
13
|
+
'margin-top': {
|
14
|
+
pos: 'mt',
|
15
|
+
neg: 'mt_'
|
16
|
+
},
|
17
|
+
'margin-bottom': {
|
18
|
+
pos: 'mb',
|
19
|
+
neg: 'mb_'
|
20
|
+
},
|
21
|
+
'margin-left': {
|
22
|
+
pos: 'ml',
|
23
|
+
neg: 'ml_'
|
24
|
+
},
|
25
|
+
'margin-right': {
|
26
|
+
pos: 'mr',
|
27
|
+
neg: 'mr_'
|
28
|
+
},
|
29
|
+
margin: {
|
30
|
+
pos: 'm',
|
31
|
+
neg: 'm_'
|
32
|
+
},
|
33
|
+
'padding-top': {
|
34
|
+
pos: 'pt',
|
35
|
+
neg: 'pt_'
|
36
|
+
},
|
37
|
+
'padding-bottom': {
|
38
|
+
pos: 'pb',
|
39
|
+
neg: 'pb_'
|
40
|
+
},
|
41
|
+
'padding-left': {
|
42
|
+
pos: 'pl',
|
43
|
+
neg: 'pl_'
|
44
|
+
},
|
45
|
+
'padding-right': {
|
46
|
+
pos: 'pr',
|
47
|
+
neg: 'pr_'
|
48
|
+
},
|
49
|
+
padding: {
|
50
|
+
pos: 'p',
|
51
|
+
neg: 'p_'
|
52
|
+
},
|
53
|
+
top: {
|
54
|
+
pos: 'post',
|
55
|
+
neg: 'post_'
|
56
|
+
},
|
57
|
+
bottom: {
|
58
|
+
pos: 'posb',
|
59
|
+
neg: 'posb_'
|
60
|
+
},
|
61
|
+
left: {
|
62
|
+
pos: 'posl',
|
63
|
+
neg: 'posl_'
|
64
|
+
},
|
65
|
+
right: {
|
66
|
+
pos: 'posr',
|
67
|
+
neg: 'posr_'
|
68
|
+
},
|
69
|
+
height: {
|
70
|
+
pos: 'h',
|
71
|
+
neg: 'h_'
|
72
|
+
},
|
73
|
+
width: {
|
74
|
+
pos: 'w',
|
75
|
+
neg: 'w_'
|
76
|
+
},
|
77
|
+
'min-height': {
|
78
|
+
pos: 'minh',
|
79
|
+
neg: 'minh_'
|
80
|
+
},
|
81
|
+
'min-width': {
|
82
|
+
pos: 'minw',
|
83
|
+
neg: 'minw_'
|
84
|
+
},
|
85
|
+
'max-height': {
|
86
|
+
pos: 'maxh',
|
87
|
+
neg: 'maxh_'
|
88
|
+
},
|
89
|
+
'max-width': {
|
90
|
+
pos: 'maxw',
|
91
|
+
neg: 'maxw_'
|
92
|
+
}
|
93
|
+
};
|
94
|
+
|
95
|
+
function objToClassName(prop, data) {
|
96
|
+
return renameProps[prop] ? data < 0 ? renameProps[prop].neg ? `${renameProps[prop].neg}${data * -1}` : `undef${data * -1}` : renameProps[prop].pos ? `${renameProps[prop].pos}${data}` : `undef${data}` : `undef${data}`;
|
97
|
+
}
|
98
|
+
|
99
|
+
const commonFilePath = {
|
100
|
+
'margin-left': 'src/common/css/margin.css',
|
101
|
+
'margin-right': 'src/common/css/margin.css',
|
102
|
+
'margin-top': 'src/common/css/margin.css',
|
103
|
+
'margin-bottom': 'src/common/css/margin.css',
|
104
|
+
'padding-left': 'src/common/css/padding.css',
|
105
|
+
'padding-right': 'src/common/css/padding.css',
|
106
|
+
'padding-top': 'src/common/css/padding.css',
|
107
|
+
'padding-bottom': 'src/common/css/padding.css',
|
108
|
+
top: 'src/common/css/position.css',
|
109
|
+
bottom: 'src/common/css/position.css',
|
110
|
+
left: 'src/common/css/position.css',
|
111
|
+
right: 'src/common/css/position.css',
|
112
|
+
height: 'src/common/css/height.css',
|
113
|
+
width: 'src/common/css/width.css',
|
114
|
+
'min-height': 'src/common/css/height.css',
|
115
|
+
'min-width': 'src/common/css/width.css',
|
116
|
+
'max-height': 'src/common/css/height.css',
|
117
|
+
'max-width': 'src/common/css/width.css'
|
118
|
+
}; // const preNames = {
|
119
|
+
// height: 'zd-height-',
|
120
|
+
// 'max-height': 'zd-height-',
|
121
|
+
// 'min-height': 'zd-height-',
|
122
|
+
// width: 'zd-width-',
|
123
|
+
// 'max-width': 'zd-width-',
|
124
|
+
// 'min-width': 'zd-width-',
|
125
|
+
// top: 'zd-position-',
|
126
|
+
// bottom: 'zd-position-',
|
127
|
+
// left: 'zd-position-',
|
128
|
+
// right: 'zd-position-',
|
129
|
+
// 'padding-top': 'zd-padding-',
|
130
|
+
// 'padding-bottom': 'zd-padding-',
|
131
|
+
// 'padding-left': 'zd-padding-',
|
132
|
+
// 'padding-right': 'zd-padding-',
|
133
|
+
// 'margin-top': 'zd-margin-',
|
134
|
+
// 'margin-bottom': 'zd-margin-',
|
135
|
+
// 'margin-left': 'zd-margin-',
|
136
|
+
// 'margin-right': 'zd-margin-'
|
137
|
+
// };
|
138
|
+
|
139
|
+
function allowParent(rule) {
|
140
|
+
return rule.parent.type === 'root' || rule.parent.type === 'atrule' && rule.parent.name === 'media';
|
141
|
+
}
|
142
|
+
|
143
|
+
module.exports = function (source) {
|
144
|
+
const {
|
145
|
+
resourcePath
|
146
|
+
} = this;
|
147
|
+
|
148
|
+
let root = _postcss.default.parse(source);
|
149
|
+
|
150
|
+
root.walkRules(rule => {
|
151
|
+
rule.walkDecls(decl => {
|
152
|
+
if (!allowParent(rule)) {
|
153
|
+
return;
|
154
|
+
}
|
155
|
+
|
156
|
+
if (supportedProps.includes(decl.prop) && /px$/gi.test(decl.value) && !/^--/gi.test(decl.prop) && commonFilePath[decl.prop] && !decl.value.includes('calc') && !/[,\s+]+|(\w+)\.|:|(\d+)%/gi.test(rule.selector)) {
|
157
|
+
let composeString = `from "${_path.default.relative(_path.default.parse(resourcePath).dir, // resourcePath
|
158
|
+
commonFilePath[decl.prop]).replace(/\\/gi, '/')}"`; // n++ < 10 && console.log(composeString);
|
159
|
+
|
160
|
+
if (!composeString.includes('src')) {
|
161
|
+
const cls = objToClassName(decl.prop, parseInt(decl.value));
|
162
|
+
composeString = `${cls} ${composeString}`;
|
163
|
+
decl.value = composeString;
|
164
|
+
decl.prop = 'composes'; // n < 10 && console.log(rule.selector, decl.prop, decl.value);
|
165
|
+
}
|
166
|
+
}
|
167
|
+
});
|
168
|
+
});
|
169
|
+
const output = root.toString(); // console.log(output);
|
170
|
+
|
171
|
+
return output;
|
172
|
+
};
|
@@ -6,25 +6,25 @@ var _fs = _interopRequireDefault(require("fs"));
|
|
6
6
|
|
7
7
|
var _utils = require("../utils");
|
8
8
|
|
9
|
+
var _logger = require("../logger");
|
10
|
+
|
9
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
10
12
|
|
11
|
-
|
13
|
+
const options = (0, _utils.getOptions)();
|
12
14
|
const {
|
13
15
|
cssSelectorZipPath
|
14
16
|
} = options.impactService;
|
15
17
|
|
16
|
-
const zipname = _path.default.parse(cssSelectorZipPath).name; //
|
17
|
-
// TODO:NOTE: need to check about .. path related files creation
|
18
|
+
const zipname = _path.default.parse(cssSelectorZipPath).name; // TODO:NOTE: need to check about .. path related files creation
|
18
19
|
// for now no css files have given form react-cli need to make sure about it.
|
19
20
|
|
20
21
|
|
21
|
-
|
22
|
+
const zippath = _path.default.join(process.cwd(), cssSelectorZipPath);
|
22
23
|
|
23
24
|
if (_fs.default.existsSync(_path.default.join(process.cwd(), cssSelectorZipPath))) {
|
24
25
|
_fs.default.rmSync(zippath);
|
25
26
|
|
26
|
-
|
27
|
-
// console.log('created folder ==> ', dpath);
|
27
|
+
(0, _logger.messageLogger)('zip file deleted', zippath); // fs.rmSync(zippath, {force:true})
|
28
28
|
} // const minicssComment =
|
29
29
|
// '// extracted by mini-css-extract-plugin\n';
|
30
30
|
|
@@ -39,15 +39,15 @@ module.exports = function (source) {
|
|
39
39
|
|
40
40
|
const relativePath = _path.default.relative(rootContext, resourcePath);
|
41
41
|
|
42
|
-
|
42
|
+
const fpath = _path.default.join(rootContext, zipname, relativePath);
|
43
43
|
|
44
|
-
|
44
|
+
const originalpath = _path.default.join(rootContext, relativePath);
|
45
45
|
|
46
46
|
if (relativePath.startsWith('..')) {
|
47
47
|
throw `unexpected path ${relativePath}`;
|
48
48
|
}
|
49
49
|
|
50
|
-
|
50
|
+
const dpath = fpath.slice(0, fpath.lastIndexOf(_path.default.sep));
|
51
51
|
|
52
52
|
if (!_fs.default.existsSync(originalpath)) {
|
53
53
|
throw `originalpath not exixt ${originalpath}`;
|
@@ -16,7 +16,7 @@ var _SingleEntryPlugin = _interopRequireDefault(require("webpack/lib/SingleEntry
|
|
16
16
|
|
17
17
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
18
18
|
|
19
|
-
/* import WebWorkerTemplatePlugin from 'webpack/lib/webworker/WebWorkerTemplatePlugin';
|
19
|
+
/* import WebWorkerTemplatePlugin from 'webpack/lib/webworker/WebWorkerTemplatePlugin';
|
20
20
|
import ExternalsPlugin from 'webpack/lib/ExternalsPlugin'; */
|
21
21
|
const schema = {
|
22
22
|
'type': 'object',
|
@@ -80,14 +80,14 @@ function pitch(request) {
|
|
80
80
|
globalObject: 'self'
|
81
81
|
};
|
82
82
|
workerContext.compiler = this._compilation.createChildCompiler(`worker-loader ${request}`, workerContext.options);
|
83
|
-
/*
|
84
|
-
new WebWorkerTemplatePlugin().apply(workerContext.compiler);
|
85
|
-
|
86
|
-
if (compilerOptions.externals) {
|
87
|
-
new ExternalsPlugin(
|
88
|
-
getExternalsType(compilerOptions),
|
89
|
-
compilerOptions.externals
|
90
|
-
).apply(workerContext.compiler);
|
83
|
+
/*
|
84
|
+
new WebWorkerTemplatePlugin().apply(workerContext.compiler);
|
85
|
+
|
86
|
+
if (compilerOptions.externals) {
|
87
|
+
new ExternalsPlugin(
|
88
|
+
getExternalsType(compilerOptions),
|
89
|
+
compilerOptions.externals
|
90
|
+
).apply(workerContext.compiler);
|
91
91
|
} */
|
92
92
|
|
93
93
|
new _SingleEntryPlugin.default(this.context, `!!${request}`, _path.default.parse(this.resourcePath).name).apply(workerContext.compiler);
|
package/lib/logger.js
ADDED
@@ -0,0 +1,20 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.errorLogger = errorLogger;
|
7
|
+
exports.messageLogger = messageLogger;
|
8
|
+
exports.warnLogger = warnLogger;
|
9
|
+
|
10
|
+
function messageLogger(...args) {
|
11
|
+
console.log(...args);
|
12
|
+
}
|
13
|
+
|
14
|
+
function errorLogger(...args) {
|
15
|
+
console.error(...args);
|
16
|
+
}
|
17
|
+
|
18
|
+
function warnLogger(...args) {
|
19
|
+
console.warn(...args);
|
20
|
+
}
|
@@ -25,6 +25,8 @@ var _webpack = _interopRequireDefault(require("webpack"));
|
|
25
25
|
|
26
26
|
var _plugins = require("../plugins");
|
27
27
|
|
28
|
+
var _CustomAttributePlugin = require("../plugins/CustomAttributePlugin");
|
29
|
+
|
28
30
|
var _RtlCssPlugin = require("../plugins/RtlSplitPlugin/RtlCssPlugin");
|
29
31
|
|
30
32
|
var _VariableConversionCollector = _interopRequireDefault(require("../plugins/VariableConversionCollector"));
|
@@ -42,12 +44,15 @@ const getDevPlugins = (options, publicPath) => {
|
|
42
44
|
tpFolder,
|
43
45
|
folder,
|
44
46
|
instrumentScript,
|
47
|
+
customAttributes,
|
45
48
|
devCssFileBountry,
|
46
49
|
context,
|
47
50
|
hasEFC: prevOptionForEnableEFC,
|
48
51
|
hasShadowDOM,
|
49
52
|
cssVariableReplacementConfig,
|
50
53
|
plugins: pluginObject,
|
54
|
+
patterns,
|
55
|
+
patternsRootDir,
|
51
56
|
exclude,
|
52
57
|
selectorWeightConfig,
|
53
58
|
server: {
|
@@ -86,6 +91,7 @@ const getDevPlugins = (options, publicPath) => {
|
|
86
91
|
NODE_ENV: JSON.stringify(mode === 'dev-no-warn' ? 'production' : 'development')
|
87
92
|
}
|
88
93
|
}), new _miniCssExtractPlugin.default({
|
94
|
+
attributes: customAttributes.cssAttributes,
|
89
95
|
filename: cssLTRFileNameTempalte,
|
90
96
|
// ignoreOrder: true,
|
91
97
|
chunkFilename: cssLTRFileNameTempalte
|
@@ -109,11 +115,11 @@ const getDevPlugins = (options, publicPath) => {
|
|
109
115
|
}
|
110
116
|
|
111
117
|
const i18nManifestFileName = 'i18n-manifest.json';
|
112
|
-
/**
|
113
|
-
* NOTE:
|
114
|
-
* this file name ext .i18n.js added
|
115
|
-
* Because, in service worker they maintain cache as file name based
|
116
|
-
* So, to make differce we added .i18n.js ext.
|
118
|
+
/**
|
119
|
+
* NOTE:
|
120
|
+
* this file name ext .i18n.js added
|
121
|
+
* Because, in service worker they maintain cache as file name based
|
122
|
+
* So, to make differce we added .i18n.js ext.
|
117
123
|
*/
|
118
124
|
|
119
125
|
const i18nFileNameTemplate = 'i18n-chunk/[locale]/[name].i18n.js';
|
@@ -184,6 +190,7 @@ const getDevPlugins = (options, publicPath) => {
|
|
184
190
|
mainChunkName: 'main'
|
185
191
|
}));
|
186
192
|
instrumentScript && pluginsArr.push(new _plugins.ScriptInstrumentPlugin());
|
193
|
+
customAttributes.enable && pluginsArr.push(new _CustomAttributePlugin.CustomAttributePlugin(customAttributes));
|
187
194
|
hasShadowDOM && pluginsArr.push(new _plugins.ShadowDOMSupportPlugin());
|
188
195
|
|
189
196
|
if (devCssFileBountry) {
|
@@ -194,16 +201,24 @@ const getDevPlugins = (options, publicPath) => {
|
|
194
201
|
|
195
202
|
if (pluginObject.cssVariableReplacement) {
|
196
203
|
pluginsArr.push(new _VariableConversionCollector.default({
|
197
|
-
cssVariableReplacementConfig
|
204
|
+
cssVariableReplacementConfig,
|
205
|
+
patterns,
|
206
|
+
patternsRootDir
|
198
207
|
}));
|
199
208
|
}
|
200
209
|
|
201
210
|
if (pluginObject.selectorWeight) {
|
202
211
|
pluginsArr.push(new _SelectorPlugin.default({
|
203
212
|
selectorWeightConfig,
|
204
|
-
exclude: exclude.selectorWeight
|
213
|
+
exclude: exclude.selectorWeight,
|
214
|
+
patterns,
|
215
|
+
patternsRootDir
|
205
216
|
}));
|
206
|
-
}
|
217
|
+
} // if (pluginObject.minifier) {
|
218
|
+
// // console.log('minifier active');
|
219
|
+
// pluginsArr.push(new MinifierPlugin());
|
220
|
+
// }
|
221
|
+
|
207
222
|
|
208
223
|
return pluginsArr.filter(Boolean);
|
209
224
|
};
|
@@ -29,6 +29,8 @@ var _SelectorPlugin = _interopRequireDefault(require("../plugins/SelectorPlugin"
|
|
29
29
|
|
30
30
|
var _plugins = require("../plugins");
|
31
31
|
|
32
|
+
var _CustomAttributePlugin = require("../plugins/CustomAttributePlugin");
|
33
|
+
|
32
34
|
var _RtlCssPlugin = require("../plugins/RtlSplitPlugin/RtlCssPlugin");
|
33
35
|
|
34
36
|
var _configHtmlWebpackPlugins = require("./configHtmlWebpackPlugins");
|
@@ -45,12 +47,15 @@ const getProdPlugins = (options, publicPath = '') => {
|
|
45
47
|
bundleAnalyze,
|
46
48
|
optimize,
|
47
49
|
publicPaths,
|
50
|
+
patterns,
|
51
|
+
patternsRootDir,
|
48
52
|
hasEFC: prevOptionForEnableEFC,
|
49
53
|
enableSMapHook,
|
50
54
|
tpFolder,
|
51
55
|
folder,
|
52
56
|
outputFolder,
|
53
57
|
context,
|
58
|
+
exclude,
|
54
59
|
enableSMap,
|
55
60
|
server: {
|
56
61
|
mode
|
@@ -63,6 +68,7 @@ const getProdPlugins = (options, publicPath = '') => {
|
|
63
68
|
resourceHints,
|
64
69
|
serviceWorker,
|
65
70
|
htmlTemplate,
|
71
|
+
customAttributes,
|
66
72
|
tpHashMapping,
|
67
73
|
cdnMapping,
|
68
74
|
crossorigin
|
@@ -102,7 +108,7 @@ const getProdPlugins = (options, publicPath = '') => {
|
|
102
108
|
// ignoreOrder: true,
|
103
109
|
filename: cssLTRFileNameTempalte,
|
104
110
|
chunkFilename: cssLTRFileNameTempalte
|
105
|
-
}), new _plugins.ResourceHintsPlugin(), new _plugins.
|
111
|
+
}), new _plugins.ResourceHintsPlugin(), new _plugins.MinifyPlugin()];
|
106
112
|
|
107
113
|
if (enableRTLSplit) {
|
108
114
|
pluginsArr.push(new _RtlCssPlugin.RtlCssPlugin({
|
@@ -116,11 +122,11 @@ const getProdPlugins = (options, publicPath = '') => {
|
|
116
122
|
}
|
117
123
|
|
118
124
|
const i18nManifestFileName = 'i18n-manifest.json';
|
119
|
-
/**
|
120
|
-
* NOTE:
|
121
|
-
* this file name ext .i18n.js added
|
122
|
-
* Because, in service worker they maintain cache as file name based
|
123
|
-
* So, to make differce we added .i18n.js ext.
|
125
|
+
/**
|
126
|
+
* NOTE:
|
127
|
+
* this file name ext .i18n.js added
|
128
|
+
* Because, in service worker they maintain cache as file name based
|
129
|
+
* So, to make differce we added .i18n.js ext.
|
124
130
|
*/
|
125
131
|
|
126
132
|
const i18nFileNameTemplate = 'i18n-chunk/[locale]/[name].[chunkhash].i18n.js';
|
@@ -268,17 +274,23 @@ const getProdPlugins = (options, publicPath = '') => {
|
|
268
274
|
|
269
275
|
if (pluginObject.cssVariableReplacement) {
|
270
276
|
pluginsArr.push(new _VariableConversionCollector.default({
|
271
|
-
cssVariableReplacementConfig
|
277
|
+
cssVariableReplacementConfig,
|
278
|
+
patterns,
|
279
|
+
patternsRootDir
|
272
280
|
}));
|
273
281
|
}
|
274
282
|
|
275
283
|
if (pluginObject.selectorWeight) {
|
276
284
|
pluginsArr.push(new _SelectorPlugin.default({
|
277
|
-
selectorWeightConfig
|
285
|
+
selectorWeightConfig,
|
286
|
+
exclude: exclude.selectorWeight,
|
287
|
+
patterns,
|
288
|
+
patternsRootDir
|
278
289
|
}));
|
279
290
|
} // plugins.push(new VariableConversionCollector({}));
|
280
291
|
|
281
292
|
|
293
|
+
customAttributes.enable && pluginsArr.push(new _CustomAttributePlugin.CustomAttributePlugin(customAttributes));
|
282
294
|
return pluginsArr;
|
283
295
|
};
|
284
296
|
|
@@ -0,0 +1,82 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.CustomAttributePlugin = void 0;
|
7
|
+
|
8
|
+
var _Template = _interopRequireDefault(require("webpack/lib/Template"));
|
9
|
+
|
10
|
+
var _htmlWebpackInjectAttributesPlugin = _interopRequireDefault(require("html-webpack-inject-attributes-plugin"));
|
11
|
+
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
13
|
+
|
14
|
+
/* eslint-disable no-use-before-define */
|
15
|
+
class CustomAttributePlugin {
|
16
|
+
constructor(options) {
|
17
|
+
this.options = {
|
18
|
+
attributes: options.attributes,
|
19
|
+
useHTMLAttribute: options.attributes && !options.jsAttributes && !options.cssAttributes && !options.i18nAttributes,
|
20
|
+
jsAttributes: options.jsAttributes || options.attributes || {},
|
21
|
+
cssAttributes: options.cssAttributes || options.attributes || {},
|
22
|
+
i18nAttributes: options.i18nAttributes || options.attributes || {}
|
23
|
+
};
|
24
|
+
}
|
25
|
+
|
26
|
+
addCustomAttributeToDynamicScriptTags(mainTemplate) {
|
27
|
+
const {
|
28
|
+
jsAttributes,
|
29
|
+
cssAttributes,
|
30
|
+
i18nAttributes
|
31
|
+
} = this.options; // NOTE: To add custom Attributes to js Script tags
|
32
|
+
|
33
|
+
mainTemplate.hooks.jsonpScript.tap('CustomAttributePlugin', source => {
|
34
|
+
const str = attributeSetTemplate(jsAttributes, 'script');
|
35
|
+
return _Template.default.asString([source, ...str]);
|
36
|
+
}); // NOTE: To add custom Attributes to css link tags
|
37
|
+
|
38
|
+
mainTemplate.hooks.requireEnsure.tap('CustomAttributePlugin', source => {
|
39
|
+
const str = attributeSetTemplate(cssAttributes, 'linkTag');
|
40
|
+
const replacedStr = source.replace('head.appendChild(linkTag);', `${str.join('')}head.appendChild(linkTag);`); // console.log({ s: source, r: replacedStr });
|
41
|
+
|
42
|
+
return replacedStr;
|
43
|
+
}); // NOTE: To add custom Attributes to i18n split js Script tags
|
44
|
+
|
45
|
+
mainTemplate.hooks.requireEnsure.tap('CustomAttributePlugin', source => {
|
46
|
+
const str = attributeSetTemplate(i18nAttributes, 'scriptTag');
|
47
|
+
const replacedStr = source.replace('document.body.appendChild(scriptTag);', `${str.join('')}document.body.appendChild(scriptTag);`); // console.log({ s: source, r: replacedStr });
|
48
|
+
|
49
|
+
return replacedStr;
|
50
|
+
});
|
51
|
+
}
|
52
|
+
|
53
|
+
apply(compiler) {
|
54
|
+
// NOTE: we not using this, Reason currently this option is only need for EFC,
|
55
|
+
// So it do not needed.
|
56
|
+
const {
|
57
|
+
attributes,
|
58
|
+
useHTMLAttribute
|
59
|
+
} = this.options;
|
60
|
+
useHTMLAttribute && new _htmlWebpackInjectAttributesPlugin.default(attributes).apply(compiler);
|
61
|
+
compiler.hooks.thisCompilation.tap({
|
62
|
+
name: 'CustomAttributePlugin',
|
63
|
+
stage: 1,
|
64
|
+
fn: compilation => {
|
65
|
+
this.addCustomAttributeToDynamicScriptTags(compilation.mainTemplate);
|
66
|
+
}
|
67
|
+
});
|
68
|
+
}
|
69
|
+
|
70
|
+
}
|
71
|
+
|
72
|
+
exports.CustomAttributePlugin = CustomAttributePlugin;
|
73
|
+
|
74
|
+
function attributeSetTemplate(jsAttributes, variableName) {
|
75
|
+
let str = [];
|
76
|
+
Object.keys(jsAttributes).forEach(key => {
|
77
|
+
const val = jsAttributes[key];
|
78
|
+
str.push(`${variableName}.setAttribute(${JSON.stringify(key)}, ${JSON.stringify(val)});`);
|
79
|
+
}); // console.log({ str });
|
80
|
+
|
81
|
+
return str;
|
82
|
+
}
|
@@ -0,0 +1,35 @@
|
|
1
|
+
# CustomAttributePlugin
|
2
|
+
In this plugin we added all dynamic chunks tags (like js script tags , css script tags, i18n split script tags) to extra custom attribute
|
3
|
+
|
4
|
+
## Options
|
5
|
+
|
6
|
+
```json
|
7
|
+
{
|
8
|
+
"name": "some",
|
9
|
+
"react-cli": {
|
10
|
+
"app": {
|
11
|
+
"customAttributes": {// this is the all options
|
12
|
+
"enable": false,
|
13
|
+
"attributes": null,
|
14
|
+
"jsAttributes": null,
|
15
|
+
"cssAttributes": null,
|
16
|
+
"i18nAttributes": null
|
17
|
+
}
|
18
|
+
}
|
19
|
+
}
|
20
|
+
```
|
21
|
+
|
22
|
+
### enable [Boolean]
|
23
|
+
this decides is this plugin or feature needs to be enabled of not.
|
24
|
+
|
25
|
+
|
26
|
+
### attributes [Object]
|
27
|
+
It was object of key value pairs Example Given Option {"data-app-name":"myapp"}
|
28
|
+
Then all dynamically (js script tags , css script tags, i18n split script tags) added tags via webpack
|
29
|
+
|
30
|
+
### jsAttributes [Object]
|
31
|
+
same as [attributes] but only for js script tags
|
32
|
+
### cssAttributes [Object]
|
33
|
+
same as [attributes] but only for css script tags
|
34
|
+
### i18nAttributes [Object]
|
35
|
+
same as [attributes] but only for i18n split script tags
|
package/lib/plugins/EFCPlugin.js
CHANGED
@@ -19,6 +19,8 @@ var _replaceCssDirTemplate = require("./RtlSplitPlugin/replaceCssDirTemplate");
|
|
19
19
|
|
20
20
|
var _EFCTemplatePlugin = _interopRequireDefault(require("./EFCTemplatePlugin"));
|
21
21
|
|
22
|
+
var _logger = require("../logger");
|
23
|
+
|
22
24
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
23
25
|
|
24
26
|
// import { getShortI18nAssets } from './I18nSplitPlugin/utils/hashUtils';
|
@@ -85,18 +87,18 @@ class EFCPlugin {
|
|
85
87
|
getI18nAssetsStr(entryPoint, compilation) {
|
86
88
|
if (!chunkSplitEnable) {
|
87
89
|
let i18nAsstes = {};
|
88
|
-
|
90
|
+
const i18nFiles = Object.keys(compilation.assets).filter(assert => assert.indexOf(`i18n${_path.default.sep}`) !== -1); //hook for i18n url contains i18n/ may cause problem
|
89
91
|
|
90
92
|
i18nAsstes = i18nFiles.reduce((res, i18nFilePath) => {
|
91
|
-
|
92
|
-
|
93
|
+
const fileName = i18nFilePath.replace(`i18n${_path.default.sep}`, '');
|
94
|
+
const splittedFileName = fileName.split('.');
|
93
95
|
res[splittedFileName[0]] = i18nFilePath;
|
94
96
|
return res;
|
95
97
|
}, {});
|
96
98
|
return `[${JSON.stringify(i18nAsstes)}[lang]]`;
|
97
99
|
}
|
98
100
|
|
99
|
-
|
101
|
+
const initalI18nAssets = entryPoint.chunks.filter(chunk => _I18nKeysIdentifer.default.isChunkHasI18n(chunk)).map(chunk => (0, _getI18nFileUrlPathTemplate.getI18nFileUrlPathTemplate)(compilation, chunk, this.i18nFileNameTemplate, '@locale@'));
|
100
102
|
return `${JSON.stringify(initalI18nAssets)}.map(urlpath => urlpath.replace(/@locale@/g, lang))`;
|
101
103
|
}
|
102
104
|
|
@@ -205,8 +207,7 @@ class EFCPlugin {
|
|
205
207
|
apply(compiler) {
|
206
208
|
if (!createSDkFile) {
|
207
209
|
return;
|
208
|
-
}
|
209
|
-
|
210
|
+
}
|
210
211
|
|
211
212
|
if (this.templateFilePath) {
|
212
213
|
new _EFCTemplatePlugin.default({
|
@@ -230,9 +231,8 @@ class EFCPlugin {
|
|
230
231
|
}
|
231
232
|
|
232
233
|
const source = new _webpackSources.RawSource(this.createFileContent(compilation));
|
233
|
-
compilation.assets[outputFile] = source;
|
234
|
-
|
235
|
-
console.log('The EFC embedded code was created successfully..!!!');
|
234
|
+
compilation.assets[outputFile] = source;
|
235
|
+
(0, _logger.messageLogger)('The EFC embedded code was created successfully..!!!');
|
236
236
|
});
|
237
237
|
}
|
238
238
|
|
package/lib/plugins/EFCPlugin.md
CHANGED
@@ -1,6 +1,6 @@
|
|
1
|
-
# EFC Plugin
|
2
|
-
|
3
|
-
In EFC plugin we are create sdk file for efc related purpose
|
4
|
-
|
5
|
-
|
6
|
-
# document will be soon
|
1
|
+
# EFC Plugin
|
2
|
+
|
3
|
+
In EFC plugin we are create sdk file for efc related purpose
|
4
|
+
|
5
|
+
|
6
|
+
# document will be soon
|