@zohodesk/react-cli 1.0.2-exp.4 → 1.0.3-beta.1
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 +1189 -1165
- package/bin/cli.js +483 -483
- 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/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 +0 -6
- package/lib/configs/webpack.docs.config.js +0 -4
- package/lib/configs/webpack.impact.config.js +0 -4
- package/lib/configs/webpack.prod.config.js +0 -6
- package/lib/loaderUtils/configsAssetsLoaders.js +33 -33
- package/lib/loaderUtils/getCSSLoaders.js +47 -81
- package/lib/loaderUtils/windowsModification.js +1 -6
- 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 +13 -18
- package/lib/pluginUtils/getProdPlugins.js +12 -16
- 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/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 +36 -53
- package/lib/plugins/ServiceWorkerPlugin.js +9 -9
- package/lib/plugins/TPHashMappingPlugin.js +4 -4
- package/lib/plugins/{MinifyPlugin.js → UglifyCSSPlugin.js} +3 -3
- package/lib/plugins/VariableConversionCollector.js +84 -98
- package/lib/plugins/composeCommonPlugin.js +30 -0
- package/lib/plugins/index.js +7 -7
- 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 +14 -5
- 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 +20 -3
- package/lib/postcss-plugins/variableModifier.js +24 -58
- package/lib/schemas/index.js +11 -35
- 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 +14 -43
- package/lib/utils/resultSchema.json +73 -73
- package/npm-shrinkwrap.json +14407 -0
- package/npm8.md +9 -9
- package/package.json +121 -122
- 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/loaderUtils/tests/windowsModification.test.js +0 -10
- package/lib/loaders/composeLoader.js +0 -175
- package/lib/plugins/utils/classHandling.js +0 -20
- package/lib/plugins/utils/fileHandling.js +0 -107
- package/lib/plugins/utils/tests/fileHandling.test.js +0 -30
- package/lib/postcss-plugins/EmptyPlugin.js +0 -8
@@ -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,14 +44,13 @@ 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,
|
51
|
-
patterns,
|
52
|
-
patternsRootDir,
|
53
54
|
exclude,
|
54
55
|
selectorWeightConfig,
|
55
56
|
server: {
|
@@ -88,6 +89,7 @@ const getDevPlugins = (options, publicPath) => {
|
|
88
89
|
NODE_ENV: JSON.stringify(mode === 'dev-no-warn' ? 'production' : 'development')
|
89
90
|
}
|
90
91
|
}), new _miniCssExtractPlugin.default({
|
92
|
+
attributes: customAttributes.cssAttributes,
|
91
93
|
filename: cssLTRFileNameTempalte,
|
92
94
|
// ignoreOrder: true,
|
93
95
|
chunkFilename: cssLTRFileNameTempalte
|
@@ -111,11 +113,11 @@ const getDevPlugins = (options, publicPath) => {
|
|
111
113
|
}
|
112
114
|
|
113
115
|
const i18nManifestFileName = 'i18n-manifest.json';
|
114
|
-
/**
|
115
|
-
* NOTE:
|
116
|
-
* this file name ext .i18n.js added
|
117
|
-
* Because, in service worker they maintain cache as file name based
|
118
|
-
* So, to make differce we added .i18n.js ext.
|
116
|
+
/**
|
117
|
+
* NOTE:
|
118
|
+
* this file name ext .i18n.js added
|
119
|
+
* Because, in service worker they maintain cache as file name based
|
120
|
+
* So, to make differce we added .i18n.js ext.
|
119
121
|
*/
|
120
122
|
|
121
123
|
const i18nFileNameTemplate = 'i18n-chunk/[locale]/[name].i18n.js';
|
@@ -186,6 +188,7 @@ const getDevPlugins = (options, publicPath) => {
|
|
186
188
|
mainChunkName: 'main'
|
187
189
|
}));
|
188
190
|
instrumentScript && pluginsArr.push(new _plugins.ScriptInstrumentPlugin());
|
191
|
+
customAttributes.enable && pluginsArr.push(new _CustomAttributePlugin.CustomAttributePlugin(customAttributes));
|
189
192
|
hasShadowDOM && pluginsArr.push(new _plugins.ShadowDOMSupportPlugin());
|
190
193
|
|
191
194
|
if (devCssFileBountry) {
|
@@ -196,24 +199,16 @@ const getDevPlugins = (options, publicPath) => {
|
|
196
199
|
|
197
200
|
if (pluginObject.cssVariableReplacement) {
|
198
201
|
pluginsArr.push(new _VariableConversionCollector.default({
|
199
|
-
cssVariableReplacementConfig
|
200
|
-
patterns,
|
201
|
-
patternsRootDir
|
202
|
+
cssVariableReplacementConfig
|
202
203
|
}));
|
203
204
|
}
|
204
205
|
|
205
206
|
if (pluginObject.selectorWeight) {
|
206
207
|
pluginsArr.push(new _SelectorPlugin.default({
|
207
208
|
selectorWeightConfig,
|
208
|
-
exclude: exclude.selectorWeight
|
209
|
-
patterns,
|
210
|
-
patternsRootDir
|
209
|
+
exclude: exclude.selectorWeight
|
211
210
|
}));
|
212
|
-
}
|
213
|
-
// // console.log('minifier active');
|
214
|
-
// pluginsArr.push(new MinifierPlugin());
|
215
|
-
// }
|
216
|
-
|
211
|
+
}
|
217
212
|
|
218
213
|
return pluginsArr.filter(Boolean);
|
219
214
|
};
|
@@ -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,15 +47,12 @@ const getProdPlugins = (options, publicPath = '') => {
|
|
45
47
|
bundleAnalyze,
|
46
48
|
optimize,
|
47
49
|
publicPaths,
|
48
|
-
patterns,
|
49
|
-
patternsRootDir,
|
50
50
|
hasEFC: prevOptionForEnableEFC,
|
51
51
|
enableSMapHook,
|
52
52
|
tpFolder,
|
53
53
|
folder,
|
54
54
|
outputFolder,
|
55
55
|
context,
|
56
|
-
exclude,
|
57
56
|
enableSMap,
|
58
57
|
server: {
|
59
58
|
mode
|
@@ -66,6 +65,7 @@ const getProdPlugins = (options, publicPath = '') => {
|
|
66
65
|
resourceHints,
|
67
66
|
serviceWorker,
|
68
67
|
htmlTemplate,
|
68
|
+
customAttributes,
|
69
69
|
tpHashMapping,
|
70
70
|
cdnMapping,
|
71
71
|
crossorigin
|
@@ -105,7 +105,7 @@ const getProdPlugins = (options, publicPath = '') => {
|
|
105
105
|
// ignoreOrder: true,
|
106
106
|
filename: cssLTRFileNameTempalte,
|
107
107
|
chunkFilename: cssLTRFileNameTempalte
|
108
|
-
}), new _plugins.ResourceHintsPlugin(), new _plugins.
|
108
|
+
}), new _plugins.ResourceHintsPlugin(), new _plugins.UglifyCSSPlugin()];
|
109
109
|
|
110
110
|
if (enableRTLSplit) {
|
111
111
|
pluginsArr.push(new _RtlCssPlugin.RtlCssPlugin({
|
@@ -119,11 +119,11 @@ const getProdPlugins = (options, publicPath = '') => {
|
|
119
119
|
}
|
120
120
|
|
121
121
|
const i18nManifestFileName = 'i18n-manifest.json';
|
122
|
-
/**
|
123
|
-
* NOTE:
|
124
|
-
* this file name ext .i18n.js added
|
125
|
-
* Because, in service worker they maintain cache as file name based
|
126
|
-
* So, to make differce we added .i18n.js ext.
|
122
|
+
/**
|
123
|
+
* NOTE:
|
124
|
+
* this file name ext .i18n.js added
|
125
|
+
* Because, in service worker they maintain cache as file name based
|
126
|
+
* So, to make differce we added .i18n.js ext.
|
127
127
|
*/
|
128
128
|
|
129
129
|
const i18nFileNameTemplate = 'i18n-chunk/[locale]/[name].[chunkhash].i18n.js';
|
@@ -271,22 +271,18 @@ const getProdPlugins = (options, publicPath = '') => {
|
|
271
271
|
|
272
272
|
if (pluginObject.cssVariableReplacement) {
|
273
273
|
pluginsArr.push(new _VariableConversionCollector.default({
|
274
|
-
cssVariableReplacementConfig
|
275
|
-
patterns,
|
276
|
-
patternsRootDir
|
274
|
+
cssVariableReplacementConfig
|
277
275
|
}));
|
278
276
|
}
|
279
277
|
|
280
278
|
if (pluginObject.selectorWeight) {
|
281
279
|
pluginsArr.push(new _SelectorPlugin.default({
|
282
|
-
selectorWeightConfig
|
283
|
-
exclude: exclude.selectorWeight,
|
284
|
-
patterns,
|
285
|
-
patternsRootDir
|
280
|
+
selectorWeightConfig
|
286
281
|
}));
|
287
282
|
} // plugins.push(new VariableConversionCollector({}));
|
288
283
|
|
289
284
|
|
285
|
+
customAttributes.enable && pluginsArr.push(new _CustomAttributePlugin.CustomAttributePlugin(customAttributes));
|
290
286
|
return pluginsArr;
|
291
287
|
};
|
292
288
|
|
@@ -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
|
@@ -19,6 +19,8 @@ var _I18nKeysIdentifer = _interopRequireDefault(require("./I18nSplitPlugin/I18nK
|
|
19
19
|
|
20
20
|
var _replaceCssDirTemplate = require("./RtlSplitPlugin/replaceCssDirTemplate");
|
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';
|
@@ -40,9 +42,7 @@ const {
|
|
40
42
|
|
41
43
|
class EFCTemplatePlugin {
|
42
44
|
constructor(options = {}) {
|
43
|
-
|
44
|
-
this.templateFilePath = _path.default.join(process.cwd(), options.templateFilePath); // console.log(' templateFilePath ', this.templateFilePath);
|
45
|
-
|
45
|
+
this.templateFilePath = _path.default.join(process.cwd(), options.templateFilePath);
|
46
46
|
this.i18nFileNameTemplate = options.i18nFileNameTemplate;
|
47
47
|
this.publicPath = options.publicPath; // NOTE: this logic may be needed for i18n splited file name with contenthash cases
|
48
48
|
// this.i18nManifestFileName = options.i18nManifestFileName;
|
@@ -68,18 +68,18 @@ class EFCTemplatePlugin {
|
|
68
68
|
// NOTE: we have used lang variable inside
|
69
69
|
if (!chunkSplitEnable) {
|
70
70
|
let i18nAsstes = {};
|
71
|
-
|
71
|
+
const i18nFiles = Object.keys(compilation.assets).filter(assert => assert.indexOf(`i18n${_path.default.sep}`) !== -1); //hook for i18n url contains i18n/ may cause problem
|
72
72
|
|
73
73
|
i18nAsstes = i18nFiles.reduce((res, i18nFilePath) => {
|
74
|
-
|
75
|
-
|
74
|
+
const fileName = i18nFilePath.replace(`i18n${_path.default.sep}`, '');
|
75
|
+
const splittedFileName = fileName.split('.');
|
76
76
|
res[splittedFileName[0]] = i18nFilePath;
|
77
77
|
return res;
|
78
78
|
}, {});
|
79
79
|
return `[${JSON.stringify(i18nAsstes)}[lang]]`;
|
80
80
|
}
|
81
81
|
|
82
|
-
|
82
|
+
const initalI18nAssets = entryPoint.chunks.filter(chunk => _I18nKeysIdentifer.default.isChunkHasI18n(chunk)).map(chunk => (0, _getI18nFileUrlPathTemplate.getI18nFileUrlPathTemplate)(compilation, chunk, this.i18nFileNameTemplate, '@locale@'));
|
83
83
|
return `${JSON.stringify(initalI18nAssets)}.map(urlpath => urlpath.replace(/@locale@/g, lang))`;
|
84
84
|
}
|
85
85
|
|
@@ -102,7 +102,7 @@ class EFCTemplatePlugin {
|
|
102
102
|
|
103
103
|
const initalI18nAssets = this.getI18nAssetsStr(entryPoint, compilation, '' // i18nJsPath
|
104
104
|
);
|
105
|
-
|
105
|
+
const templateStr = (0, _fs.readFileSync)(this.templateFilePath).toString();
|
106
106
|
return templateStr.replace('((\'getInitalAssets\'))', `function getInitalAssets(assetsType, lang) {
|
107
107
|
if (assetsType === "js") {
|
108
108
|
return ${JSON.stringify(initialJsFiles)}
|
@@ -139,10 +139,8 @@ class EFCTemplatePlugin {
|
|
139
139
|
}
|
140
140
|
|
141
141
|
const source = new _webpackSources.RawSource(this.templateReplacer(entryPoint, compilation));
|
142
|
-
compilation.assets[outputFile] = source;
|
143
|
-
|
144
|
-
|
145
|
-
console.log('The EFC embedded code was created successfully..!!!');
|
142
|
+
compilation.assets[outputFile] = source;
|
143
|
+
(0, _logger.messageLogger)('The EFC embedded code was created successfully..!!!');
|
146
144
|
});
|
147
145
|
}
|
148
146
|
|
@@ -22,7 +22,7 @@ var _getI18nFileUrlPathTemplate = require("./I18nSplitPlugin/utils/getI18nFileUr
|
|
22
22
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
23
23
|
|
24
24
|
let i18nObj = null;
|
25
|
-
|
25
|
+
const options = (0, _utils.getOptions)();
|
26
26
|
|
27
27
|
function newAssign(target, data) {
|
28
28
|
return Object.assign({}, target, data);
|
@@ -43,7 +43,7 @@ class I18NInjectIntoIndexPlugin {
|
|
43
43
|
}
|
44
44
|
|
45
45
|
getI18nFileUrlPath(chunk, compilation) {
|
46
|
-
|
46
|
+
const urlpath = (0, _getI18nFileUrlPathTemplate.getI18nFileUrlPathTemplate)(compilation, chunk, this.i18nFileNameTemplate, this.templateLabel);
|
47
47
|
return (0, _urlConcat.urlConcat)(this.publicPath, urlpath);
|
48
48
|
}
|
49
49
|
|
@@ -81,7 +81,6 @@ class I18NInjectIntoIndexPlugin {
|
|
81
81
|
withI18nSpitHandling(compiler) {
|
82
82
|
compiler.hooks.make.tap('I18NInjectIntoIndexPlugin', compilation => {
|
83
83
|
// let cdns = Object.keys(this.publicPaths);
|
84
|
-
// console.log('compilation.assets', Object.keys(compilation.assets).filter(a => a.includes('i18n')));
|
85
84
|
if (!(0, _hashUtils.hasContentHash)(this.i18nFileNameTemplate)) {
|
86
85
|
this.injectI18nURLsToHTML(compilation);
|
87
86
|
return;
|
@@ -91,7 +90,7 @@ class I18NInjectIntoIndexPlugin {
|
|
91
90
|
// Manipulate the content
|
92
91
|
const i18nManifest = this.getI18nManifest(compilation);
|
93
92
|
const entryPoint = compilation.entrypoints.get(this.entryPointName);
|
94
|
-
|
93
|
+
const i18nAssets = (0, _hashUtils.getShortI18nAssets)(entryPoint.chunks, i18nManifest, this.publicPath);
|
95
94
|
data.html = data.html.replace(new RegExp('<!--I18nInfoToServer(.*?)I18nInfoToServer-->', 'g'), (match, arg) => match.replace(arg, JSON.stringify(i18nAssets))); // Tell webpack to move on
|
96
95
|
|
97
96
|
cb(null, data);
|
@@ -111,15 +110,15 @@ class I18NInjectIntoIndexPlugin {
|
|
111
110
|
compiler.hooks.emit.tap('I18NInjectIntoIndexPlugin', compilation => {
|
112
111
|
// let cdns = Object.keys(this.publicPaths);
|
113
112
|
if (i18nObj === null) {
|
114
|
-
|
113
|
+
const i18nFiles = Object.keys(compilation.assets).filter(assert => assert.indexOf(`i18n${_path.default.sep}`) !== -1); //hook for i18n url contains i18n/ may cause problem
|
115
114
|
|
116
115
|
i18nObj = i18nFiles.reduce((res, next) => {
|
117
|
-
|
118
|
-
|
119
|
-
/* if (this.isDevelopment) {
|
120
|
-
res[splittedFileName[0]] = `${this.publicPath}/i18n/${fileName}`;
|
121
|
-
} else {
|
122
|
-
res[splittedFileName[0]] = fileName;
|
116
|
+
const fileName = next.replace(`i18n${_path.default.sep}`, '');
|
117
|
+
const splittedFileName = fileName.split('.');
|
118
|
+
/* if (this.isDevelopment) {
|
119
|
+
res[splittedFileName[0]] = `${this.publicPath}/i18n/${fileName}`;
|
120
|
+
} else {
|
121
|
+
res[splittedFileName[0]] = fileName;
|
123
122
|
} */
|
124
123
|
|
125
124
|
res[splittedFileName[0]] = `${this.publicPath}/i18n/${fileName}`;
|
@@ -127,10 +126,10 @@ class I18NInjectIntoIndexPlugin {
|
|
127
126
|
}, {});
|
128
127
|
}
|
129
128
|
|
130
|
-
|
129
|
+
const [indexFile] = Object.keys(compilation.assets).filter(filename => /\.html$/g.test(filename));
|
131
130
|
|
132
131
|
if (indexFile) {
|
133
|
-
|
132
|
+
const source = compilation.assets[indexFile].source();
|
134
133
|
compilation.assets[indexFile] = new _webpackSources.RawSource(source.replace(new RegExp('<!--I18nInfoToServer(.*)I18nInfoToServer-->', 'g'), (match, arg) => match.replace(arg, JSON.stringify(i18nObj))));
|
135
134
|
}
|
136
135
|
});
|
@@ -24,10 +24,9 @@ class I18nDebugPlugin {
|
|
24
24
|
compiler.hooks.normalModuleFactory.tap(pluginName, factory => {
|
25
25
|
if (!this.compilationParams || this.compilationParams.normalModuleFactory === factory) {
|
26
26
|
return;
|
27
|
-
}
|
27
|
+
}
|
28
28
|
|
29
|
-
|
30
|
-
let handler = parser => {
|
29
|
+
const handler = parser => {
|
31
30
|
parser.hooks.program.tap(pluginName, (ast, commmets) => {
|
32
31
|
const {
|
33
32
|
module
|