@zohodesk/react-cli 0.0.1-exp.175.1 → 0.0.1-exp.176.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/README.md +1025 -1028
- package/bin/cli.js +482 -482
- package/cert/Tsicsezwild-22-23.crt +37 -37
- package/cert/Tsicsezwild-22-23.key +27 -27
- package/docs/CustomChunks.md +26 -26
- package/docs/DevStart.md +18 -18
- package/docs/HoverActive.md +12 -12
- package/docs/InstallNode.md +28 -28
- package/docs/SelectorWeight.md +6 -0
- package/docs/TODOS.md +10 -10
- package/docs/ValueReplacer.md +60 -60
- package/docs/VariableConversion.md +719 -678
- package/docs/warnings_while_install.txt +35 -35
- package/files/eslintrc.js +62 -62
- package/files/prettierrc.js +3 -3
- package/lib/babel/cmjs-plugins-presets.js +4 -0
- package/lib/babel/es-plugins-presets.js +4 -0
- package/lib/common/getEntries.js +10 -0
- package/lib/common/getPublicPathConfig.js +6 -0
- package/lib/common/index.js +5 -0
- package/lib/common/splitChunks.js +13 -2
- package/lib/common/sslcertUpdater.js +17 -6
- package/lib/common/templateParameters.js +2 -0
- package/lib/common/testPattern.js +21 -10
- package/lib/common/valueReplacer.js +15 -0
- package/lib/configs/jest.config.js +9 -0
- package/lib/configs/libAlias.js +2 -4
- package/lib/configs/webpack.component.umd.config.js +5 -0
- package/lib/configs/webpack.css.umd.config.js +13 -5
- package/lib/configs/webpack.dev.config.js +36 -2
- package/lib/configs/webpack.docs.config.js +21 -1
- package/lib/configs/webpack.impact.config.js +19 -1
- package/lib/configs/webpack.prod.config.js +37 -3
- package/lib/hooks/docsProptypeHook.js +7 -3
- package/lib/jest/commitedFilesResult.js +45 -3
- package/lib/jest/coverageCollector.js +11 -0
- package/lib/jest/jsonMaker.js +6 -0
- package/lib/jest/preProcessors/cssPreprocessor.js +8 -0
- package/lib/jest/preProcessors/jsPreprocessor.js +2 -0
- package/lib/jest/preProcessors/otherFilesPreprocessor.js +3 -0
- package/lib/jest/result.js +22 -0
- package/lib/jest/run.js +17 -6
- package/lib/jest/setup.js +57 -5
- package/lib/loaderUtils/configsAssetsLoaders.js +44 -34
- package/lib/loaderUtils/getCSSLoaders.js +35 -20
- package/lib/loaderUtils/getDevJsLoaders.js +8 -0
- package/lib/loaderUtils/index.js +3 -0
- package/lib/loaderUtils/windowsModification.js +11 -0
- package/lib/loaders/docsLoader.js +7 -0
- package/lib/loaders/docsPropsLoader.js +7 -3
- package/lib/loaders/fileBountryLoader.js +2 -0
- package/lib/loaders/fileLoader.js +22 -11
- package/lib/loaders/scriptInstrumentLoader.js +13 -5
- package/lib/loaders/selectorMappingLoader.js +25 -7
- package/lib/loaders/workerLoader.js +29 -13
- package/lib/middlewares/HMRMiddleware.js +26 -13
- package/lib/middlewares/SSTMiddleware.js +3 -0
- package/lib/pluginUtils/configHtmlWebpackPlugins.js +9 -3
- package/lib/pluginUtils/getDevPlugins.js +68 -22
- package/lib/pluginUtils/getDocsPlugins.js +10 -1
- package/lib/pluginUtils/getLibraryImactPlugins.js +5 -4
- package/lib/pluginUtils/getLibraryPlugins.js +5 -0
- package/lib/pluginUtils/getProdPlugins.js +77 -28
- package/lib/pluginUtils/getServerPlugins.js +5 -0
- package/lib/pluginUtils/getUMDCSSPlugins.js +7 -0
- package/lib/pluginUtils/getUMDComponentPlugins.js +7 -0
- package/lib/pluginUtils/index.js +8 -0
- package/lib/plugins/CdnChangePlugin.js +14 -0
- package/lib/plugins/CleanupStatsPlugin.js +5 -0
- package/lib/plugins/EFCPlugin.js +34 -23
- package/lib/plugins/EFCPlugin.md +6 -6
- package/lib/plugins/EFCTemplatePlugin.js +32 -23
- package/lib/plugins/I18NInjectIntoIndexPlugin.js +38 -12
- package/lib/plugins/I18nSplitPlugin/I18nDebugPlugin.js +17 -12
- package/lib/plugins/I18nSplitPlugin/I18nDependency.js +10 -4
- package/lib/plugins/I18nSplitPlugin/I18nDownlodLogic.js +77 -46
- package/lib/plugins/I18nSplitPlugin/I18nFilesEmitter.js +59 -44
- package/lib/plugins/I18nSplitPlugin/I18nKeysIdentifer.js +30 -21
- package/lib/plugins/I18nSplitPlugin/I18nSplit.md +95 -95
- package/lib/plugins/I18nSplitPlugin/README.md +25 -25
- package/lib/plugins/I18nSplitPlugin/index.js +80 -70
- package/lib/plugins/I18nSplitPlugin/utils/collectI18nKeys.js +12 -2
- package/lib/plugins/I18nSplitPlugin/utils/getI18nFileUrlPathTemplate.js +1 -0
- package/lib/plugins/I18nSplitPlugin/utils/getI18nKeysFormModules.js +5 -0
- package/lib/plugins/I18nSplitPlugin/utils/hashUtils.js +6 -0
- package/lib/plugins/I18nSplitPlugin/utils/index.js +4 -0
- package/lib/plugins/I18nSplitPlugin/utils/propertiesUtils.js +20 -2
- package/lib/plugins/ManifestPlugin.js +17 -0
- package/lib/plugins/ModuleStatsPlugin.js +23 -0
- package/lib/plugins/OptimizeJSPlugin.js +7 -0
- package/lib/plugins/PublicPathCallbackPlugin.js +10 -0
- package/lib/plugins/PublicPathChangePlugin.js +36 -4
- package/lib/plugins/ReportGeneratePlugin.js +30 -4
- package/lib/plugins/RequireVariablePublicPlugin.js +6 -0
- package/lib/plugins/ResourceHintsPlugin.js +27 -20
- package/lib/plugins/RtlSplitPlugin/OverwriteCssPathForRTL.js +17 -12
- package/lib/plugins/RtlSplitPlugin/RtlCssPlugin.js +22 -15
- package/lib/plugins/RtlSplitPlugin/RtrSplit.md +30 -30
- package/lib/plugins/RtlSplitPlugin/replaceCssDirTemplate.js +5 -2
- package/lib/plugins/ScriptInstrumentPlugin.js +7 -0
- package/lib/plugins/SelectorPlugin.js +97 -0
- package/lib/plugins/ServiceWorkerPlugin.js +29 -13
- package/lib/plugins/ShadowDOMSupportPlugin.js +40 -3
- package/lib/plugins/SourceMapHookPlugin.js +9 -0
- package/lib/plugins/TPHashMappingPlugin.js +19 -5
- package/lib/plugins/UglifyCSSPlugin.js +9 -0
- package/lib/plugins/UnusedFilesFindPlugin.js +35 -2
- package/lib/plugins/VariableConversionCollector.js +322 -0
- package/lib/plugins/composeCommonPlugin.js +30 -0
- package/lib/plugins/index.js +19 -0
- package/lib/plugins/libraryImpactPlugin.js +32 -0
- package/lib/plugins/webpackwatchrunplugin.js +5 -0
- package/lib/postcss-plugins/ExcludePlugin.js +4 -0
- package/lib/postcss-plugins/RTLSplitPlugin.js +37 -24
- package/lib/postcss-plugins/ValueReplacer.js +6 -9
- package/lib/postcss-plugins/__test__/hoverActivePlugin.spec.js +3 -0
- package/lib/postcss-plugins/__test__/test1Input.css +38 -38
- package/lib/postcss-plugins/__test__/test1Output.css +38 -38
- package/lib/postcss-plugins/hoverActivePlugin.js +69 -33
- package/lib/postcss-plugins/variableModificationPlugin/ErrorHandler.js +42 -13
- package/lib/postcss-plugins/variableModificationPlugin/index.js +216 -141
- package/lib/postcss-plugins/variableModifier.js +20 -13
- package/lib/schemas/index.js +23 -4
- package/lib/servers/clusterHubServer.js +10 -0
- package/lib/servers/devBuild.js +24 -13
- package/lib/servers/docsServer.js +2 -0
- package/lib/servers/docsServerCore.js +21 -0
- package/lib/servers/getCliPath.js +9 -0
- package/lib/servers/helpServer.js +5 -0
- package/lib/servers/httpsOptions.js +4 -0
- package/lib/servers/impactServer.js +34 -2
- package/lib/servers/mockserver.js +9 -0
- package/lib/servers/nowatchserver.js +34 -12
- package/lib/servers/scrServer.js +20 -13
- package/lib/servers/server.js +35 -7
- package/lib/servers/ssServer.js +16 -0
- package/lib/sh/pre-commit.sh +34 -34
- package/lib/sh/reportPublish.sh +45 -45
- package/lib/templates/CoverageScriptTemplate.js +14 -0
- package/lib/templates/WMSTemplate.js +12 -6
- package/lib/utils/babelPresets.js +2 -0
- package/lib/utils/buildstats.html +148 -148
- package/lib/utils/clean.js +8 -2
- package/lib/utils/copy.js +6 -0
- package/lib/utils/copyTimezones.js +8 -0
- package/lib/utils/createEventStream.js +4 -0
- package/lib/utils/cssClassNameGenerate.js +19 -3
- package/lib/utils/cssURLReplacer.js +25 -0
- package/lib/utils/dependencyPostPublish.js +9 -0
- package/lib/utils/fileUtils.js +26 -0
- package/lib/utils/folderIterator.js +10 -0
- package/lib/utils/getComponents.js +21 -0
- package/lib/utils/getCurrentBranch.js +5 -0
- package/lib/utils/getDependenciesImpactList.js +21 -0
- package/lib/utils/getHash.js +7 -0
- package/lib/utils/getIp.js +2 -0
- package/lib/utils/getOptions.js +39 -14
- package/lib/utils/getServerURL.js +7 -0
- package/lib/utils/index.js +47 -2
- package/lib/utils/init.js +1 -0
- package/lib/utils/initPreCommitHook.js +29 -6
- package/lib/utils/jsonHelper.js +19 -2
- package/lib/utils/libraryImpactConfig.js +2 -0
- package/lib/utils/lint/addScripts.js +5 -2
- package/lib/utils/lint/checkExistingConfig.js +12 -3
- package/lib/utils/lint/copyConfigs.js +3 -0
- package/lib/utils/lint/index.js +9 -0
- package/lib/utils/lint/lintScripts.js +1 -0
- package/lib/utils/lint/lintSetup.js +4 -3
- package/lib/utils/lint/lintStagedPreCommitHook.js +1 -0
- package/lib/utils/lint/question.js +7 -0
- package/lib/utils/lintReporter.js +20 -0
- package/lib/utils/mailSender.js +7 -0
- package/lib/utils/pullOrigin.js +4 -0
- package/lib/utils/reinstallDependencies.js +28 -0
- package/lib/utils/removeAttributes.js +7 -0
- package/lib/utils/repoClone.js +27 -2
- package/lib/utils/request.js +12 -0
- package/lib/utils/resultSchema.json +73 -73
- package/lib/utils/rtl.js +16 -4
- package/lib/utils/setEnvVariables.js +2 -0
- package/lib/utils/ssTestHack.js +10 -0
- package/lib/utils/switchBranch.js +4 -0
- package/lib/utils/urlConcat.js +4 -0
- package/lib/utils/useExitCleanup.js +10 -9
- package/npm8.md +9 -9
- package/package.json +146 -146
- package/postpublish.js +6 -6
- 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
@@ -4,14 +4,18 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.default = void 0;
|
7
|
+
|
7
8
|
const {
|
8
9
|
Template
|
9
10
|
} = require('webpack');
|
11
|
+
|
10
12
|
const pluginName = 'RequireVariablePublicPlugin';
|
13
|
+
|
11
14
|
class RequireVariablePublicPlugin {
|
12
15
|
constructor(options) {
|
13
16
|
this.requireFuncName = options.requireFuncName;
|
14
17
|
}
|
18
|
+
|
15
19
|
apply(compiler) {
|
16
20
|
compiler.hooks.thisCompilation.tap(pluginName, ({
|
17
21
|
mainTemplate
|
@@ -19,6 +23,8 @@ class RequireVariablePublicPlugin {
|
|
19
23
|
mainTemplate.hooks.requireExtensions.tap(pluginName, source => Template.asString([source, '', `window[${JSON.stringify(this.requireFuncName)}] = ${mainTemplate.requireFn};`]));
|
20
24
|
});
|
21
25
|
}
|
26
|
+
|
22
27
|
}
|
28
|
+
|
23
29
|
var _default = RequireVariablePublicPlugin;
|
24
30
|
exports.default = _default;
|
@@ -4,10 +4,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.default = void 0;
|
7
|
+
|
7
8
|
const {
|
8
9
|
Template
|
9
10
|
} = require('webpack');
|
11
|
+
|
10
12
|
const pluginName = 'prefetch-preload-chunk-plugin';
|
13
|
+
|
11
14
|
class ResourceHintsPlugin {
|
12
15
|
apply(compiler) {
|
13
16
|
compiler.hooks.thisCompilation.tap(pluginName, ({
|
@@ -17,44 +20,48 @@ class ResourceHintsPlugin {
|
|
17
20
|
const idNameMap = chunk.getChunkMaps().name;
|
18
21
|
const nameIdMap = {};
|
19
22
|
let needsMap = false;
|
23
|
+
|
20
24
|
for (const key in idNameMap) {
|
21
25
|
if (Object.prototype.hasOwnProperty.call(idNameMap, key)) {
|
22
26
|
const value = idNameMap[key];
|
23
27
|
nameIdMap[value] = key;
|
28
|
+
|
24
29
|
if (key !== value) {
|
25
30
|
needsMap = true;
|
26
31
|
}
|
27
32
|
}
|
28
33
|
}
|
34
|
+
|
29
35
|
return Template.asString([source, '', `${mainTemplate.requireFn}.getChunkId = function getChunkId(chunkId) {`, Template.indent((needsMap ? [`chunkId = ${JSON.stringify(nameIdMap)}[chunkId]||chunkId;`] : []).concat(['return chunkId;'])), '}', `// Prefetch a chunk (${pluginName})`, `${mainTemplate.requireFn}.pfc = function prefetchChunk(chunkId) {`, Template.indent([`chunkId = ${mainTemplate.requireFn}.getChunkId(chunkId)`, `${mainTemplate.requireFn}.e(chunkId);`]), '};',
|
30
|
-
/*
|
31
|
-
(needsMap
|
32
|
-
? [`chunkId = ${JSON.stringify(nameIdMap)}[chunkId]||chunkId;`]
|
33
|
-
: []
|
34
|
-
).concat([
|
35
|
-
'var promises = [];',
|
36
|
-
'if(installedChunks[chunkId] === undefined) {',
|
37
|
-
Template.indent([
|
38
|
-
'installedChunks[chunkId] = null;',
|
39
|
-
/* mainTemplate.hooks.linkPrefetch.call('', chunk, hash),
|
36
|
+
/*
|
37
|
+
(needsMap
|
38
|
+
? [`chunkId = ${JSON.stringify(nameIdMap)}[chunkId]||chunkId;`]
|
39
|
+
: []
|
40
|
+
).concat([
|
41
|
+
'var promises = [];',
|
42
|
+
'if(installedChunks[chunkId] === undefined) {',
|
43
|
+
Template.indent([
|
44
|
+
'installedChunks[chunkId] = null;',
|
45
|
+
/* mainTemplate.hooks.linkPrefetch.call('', chunk, hash),
|
40
46
|
'document.head.appendChild(link);', */
|
41
|
-
/*
|
42
|
-
mainTemplate.hooks.requireEnsure.call('', chunk, hash)
|
43
|
-
]),
|
44
|
-
'}'
|
45
|
-
])
|
46
|
-
),
|
47
|
-
'}',
|
48
|
-
*/
|
49
|
-
`// Preload a chunk (${pluginName})`, `${mainTemplate.requireFn}.plc = function preloadChunk(chunkId) {`, Template.indent([`chunkId = ${mainTemplate.requireFn}.getChunkId(chunkId)`, 'if(installedChunks[chunkId] === undefined) {', Template.indent(['installedChunks[chunkId] = null;', mainTemplate.hooks.linkPreload.call('', chunk, hash), 'document.head.appendChild(link);', `${mainTemplate.requireFn}.e(chunkId);`
|
50
47
|
|
51
|
-
|
48
|
+
/*
|
49
|
+
mainTemplate.hooks.requireEnsure.call('', chunk, hash)
|
50
|
+
]),
|
51
|
+
'}'
|
52
|
+
])
|
53
|
+
),
|
54
|
+
'}',
|
55
|
+
*/
|
56
|
+
`// Preload a chunk (${pluginName})`, `${mainTemplate.requireFn}.plc = function preloadChunk(chunkId) {`, Template.indent([`chunkId = ${mainTemplate.requireFn}.getChunkId(chunkId)`, '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];',
|
52
57
|
// mainTemplate.hooks.jsonpScript.call('', chunk, hash),
|
53
58
|
// 'head.appendChild(script);'
|
54
59
|
]), '}']), '};']);
|
55
60
|
});
|
56
61
|
});
|
57
62
|
}
|
63
|
+
|
58
64
|
}
|
65
|
+
|
59
66
|
var _default = ResourceHintsPlugin;
|
60
67
|
exports.default = _default;
|
@@ -4,17 +4,18 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.default = void 0;
|
7
|
+
|
7
8
|
var _htmlWebpackPlugin = _interopRequireDefault(require("html-webpack-plugin"));
|
9
|
+
|
8
10
|
var _replaceCssDirTemplate = require("./replaceCssDirTemplate");
|
9
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
10
|
-
// const HtmlWebpackPlugin = require('html-webpack-plugin');
|
11
11
|
|
12
|
-
|
13
|
-
// const pluginName = 'rtl-css-transform-webpack-plugin';
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
14
13
|
|
14
|
+
// const HtmlWebpackPlugin = require('html-webpack-plugin');
|
15
|
+
const pluginName = 'OverwriteCssPathForRTL'; // const pluginName = 'rtl-css-transform-webpack-plugin';
|
15
16
|
// if we choose file name as style.ltr.css and style.rtl.css it will be easy for html template
|
16
|
-
|
17
17
|
// this plugin code copy from https://github.com/nicolashemonic/rtl-css-transform-webpack-plugin
|
18
|
+
|
18
19
|
class OverwriteCssPathForRTL {
|
19
20
|
constructor(options = {
|
20
21
|
dirVarName: 'document.dir'
|
@@ -22,6 +23,7 @@ class OverwriteCssPathForRTL {
|
|
22
23
|
this.dirVarName = options.dirVarName || 'document.dir';
|
23
24
|
this.templateLabel = options.templateLabel || '{{--dir}}';
|
24
25
|
}
|
26
|
+
|
25
27
|
overwriteCssPathinHTML(compilation) {
|
26
28
|
_htmlWebpackPlugin.default.getHooks(compilation).beforeAssetTagGeneration.tapAsync(pluginName, (data, cb) => {
|
27
29
|
let {
|
@@ -34,27 +36,26 @@ class OverwriteCssPathForRTL {
|
|
34
36
|
}));
|
35
37
|
});
|
36
38
|
}
|
39
|
+
|
37
40
|
overwriteCssPathinRequireEnsure(compilation) {
|
38
41
|
// NOTE: if you goig to change an thing here you may check with EFCPlugin, ServiceWorkerPlugin
|
39
42
|
const {
|
40
43
|
mainTemplate
|
41
|
-
} = compilation;
|
42
|
-
// TODO: must verify when we move to webpack5 ay be we need to change this
|
44
|
+
} = compilation; // TODO: must verify when we move to webpack5 ay be we need to change this
|
43
45
|
// TODO it's may not be perfect solution, but it will work
|
44
46
|
// mainTemplate.hooks.assetPath.tap(pluginName, (path, data) => {
|
47
|
+
|
45
48
|
mainTemplate.hooks.assetPath.tap(pluginName, filePath => {
|
46
49
|
if (!filePath.endsWith('.css"')) {
|
47
50
|
return filePath;
|
48
51
|
}
|
49
|
-
const ENDS = '.ltr.css"';
|
50
|
-
// if we need total differend temlate for file name it will be too hard
|
51
|
-
const templateText = `"+(${this.dirVarName} === "rtl" ? ".rtl": ".ltr")+".css"`;
|
52
52
|
|
53
|
-
|
53
|
+
const ENDS = '.ltr.css"'; // if we need total differend temlate for file name it will be too hard
|
54
|
+
|
55
|
+
const templateText = `"+(${this.dirVarName} === "rtl" ? ".rtl": ".ltr")+".css"`; // const templateText = `"+(${this.dirVarName} === "rtl" ? ".rtl": "")+".css"`;
|
54
56
|
// NOTE:
|
55
57
|
// we don't use rtlFilename as full replace because it may increace runtime chunk file size
|
56
58
|
// they replace [chunkhash] with object full chunk hash so it may dub
|
57
|
-
|
58
59
|
// const templateText = `(${this.dirVarName} === "rtl" ? ${JSON.stringify(this.rtlFilename)}: ${filePath})`;
|
59
60
|
// const templateText = '."+(document.dir === "rtl" ? ".rtl": "")+".css"';
|
60
61
|
// File path going to be like below
|
@@ -62,14 +63,18 @@ class OverwriteCssPathForRTL {
|
|
62
63
|
// '"style.css"' ==>> `"style."+(document.dir === "rtl" ? ".rtl": "")+".css"`
|
63
64
|
// replace like this
|
64
65
|
// '.ltr.css"' ==>> `."+(document.dir === "rtl" ? ".rtl": ".ltr")+".css"`
|
66
|
+
|
65
67
|
return filePath.replace(ENDS, templateText);
|
66
68
|
});
|
67
69
|
}
|
70
|
+
|
68
71
|
apply(compiler) {
|
69
72
|
compiler.hooks.thisCompilation.tap(pluginName, compilation => {
|
70
73
|
this.overwriteCssPathinHTML(compilation);
|
71
74
|
this.overwriteCssPathinRequireEnsure(compilation);
|
72
75
|
});
|
73
76
|
}
|
77
|
+
|
74
78
|
}
|
79
|
+
|
75
80
|
exports.default = OverwriteCssPathForRTL;
|
@@ -4,28 +4,32 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.RtlCssPlugin = void 0;
|
7
|
+
|
7
8
|
var _path = _interopRequireDefault(require("path"));
|
9
|
+
|
8
10
|
var _webpackSources = require("webpack-sources");
|
11
|
+
|
9
12
|
var _OverwriteCssPathForRTL = _interopRequireDefault(require("./OverwriteCssPathForRTL"));
|
13
|
+
|
10
14
|
var _RTLSplitPlugin = require("../../postcss-plugins/RTLSplitPlugin");
|
15
|
+
|
11
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
12
|
-
// import HtmlWebpackPlugin from 'html-webpack-plugin';
|
13
17
|
|
18
|
+
// import HtmlWebpackPlugin from 'html-webpack-plugin';
|
14
19
|
// import rtlcss from 'rtlcss';
|
20
|
+
const pluginName = 'RtlCssPlugin'; // const pluginName = 'rtl-css-transform-webpack-plugin';
|
21
|
+
|
22
|
+
const isCss = filename => _path.default.extname(filename) === '.css'; // this plugin code copy from https://github.com/nicolashemonic/rtl-css-transform-webpack-plugin
|
15
23
|
|
16
|
-
const pluginName = 'RtlCssPlugin';
|
17
|
-
// const pluginName = 'rtl-css-transform-webpack-plugin';
|
18
|
-
const isCss = filename => _path.default.extname(filename) === '.css';
|
19
24
|
|
20
|
-
// this plugin code copy from https://github.com/nicolashemonic/rtl-css-transform-webpack-plugin
|
21
25
|
class RtlCssPlugin {
|
22
26
|
constructor(options = {}) {
|
23
|
-
/**
|
24
|
-
* @typedef {Object} Options
|
25
|
-
* @property {String} filename [not used]
|
26
|
-
* @property {String} dirVarName
|
27
|
-
* @property {Boolean} sourcemap
|
28
|
-
* @property {Object} config
|
27
|
+
/**
|
28
|
+
* @typedef {Object} Options
|
29
|
+
* @property {String} filename [not used]
|
30
|
+
* @property {String} dirVarName
|
31
|
+
* @property {Boolean} sourcemap
|
32
|
+
* @property {Object} config
|
29
33
|
*/
|
30
34
|
this.options = {
|
31
35
|
filename: options.filename || '[name].rtl.css',
|
@@ -39,16 +43,17 @@ class RtlCssPlugin {
|
|
39
43
|
disableMiniFiySelector: options.disableMiniFiySelector
|
40
44
|
};
|
41
45
|
}
|
46
|
+
|
42
47
|
apply(compiler) {
|
43
48
|
new _OverwriteCssPathForRTL.default({
|
44
49
|
templateLabel: this.templateLabel,
|
45
50
|
dirVarName: this.dirVarName
|
46
|
-
}).apply(compiler);
|
47
|
-
// const { filename, sourcemap, config } = this.options;
|
51
|
+
}).apply(compiler); // const { filename, sourcemap, config } = this.options;
|
48
52
|
// const { devtool } = compiler.options;
|
49
53
|
// const postcssOptions = {
|
50
54
|
// map: (sourcemap === undefined && !!devtool) || !!sourcemap
|
51
55
|
// };
|
56
|
+
|
52
57
|
compiler.hooks.compilation.tap(pluginName, compilation => {
|
53
58
|
compilation.hooks.optimizeChunkAssets.tapAsync(pluginName, (chunks, callback) => {
|
54
59
|
chunks.forEach(chunk => {
|
@@ -58,10 +63,10 @@ class RtlCssPlugin {
|
|
58
63
|
const {
|
59
64
|
ltr,
|
60
65
|
rtl
|
61
|
-
} = (0, _RTLSplitPlugin.separateRtlAndLtr)(sourceStr, this.rtlSplitOptions);
|
62
|
-
// const result = rtlcss
|
66
|
+
} = (0, _RTLSplitPlugin.separateRtlAndLtr)(sourceStr, this.rtlSplitOptions); // const result = rtlcss
|
63
67
|
// .configure(config)
|
64
68
|
// .process(asset.source(), postcssOptions);
|
69
|
+
|
65
70
|
const assetFilename = chunkFilename.replace('.ltr.', '.rtl.');
|
66
71
|
compilation.assets[chunkFilename] = new _webpackSources.RawSource(ltr);
|
67
72
|
compilation.assets[assetFilename] = new _webpackSources.RawSource(rtl);
|
@@ -71,5 +76,7 @@ class RtlCssPlugin {
|
|
71
76
|
});
|
72
77
|
});
|
73
78
|
}
|
79
|
+
|
74
80
|
}
|
81
|
+
|
75
82
|
exports.RtlCssPlugin = RtlCssPlugin;
|
@@ -1,30 +1,30 @@
|
|
1
|
-
# RTL Split
|
2
|
-
|
3
|
-
we are doing in build time generating rtl related css code by using @zohodesk/postcss-rt npm.
|
4
|
-
It was automated, That postcss plugin create rtl reacted css and put them into same file, with css selector [dir=rtl] and ltr realted css with [dir=ltr].
|
5
|
-
Here is problem mostly no one need rtl and ltr related css at the same time in browser,
|
6
|
-
we are try to split them by [dir] and load which type of css is needed.
|
7
|
-
For this purpose we created RTL Split Plugin
|
8
|
-
|
9
|
-
|
10
|
-
# To Try it out rtl-ltr split
|
11
|
-
### how to use this feature?
|
12
|
-
|
13
|
-
to use this feature use have give the below oprtions
|
14
|
-
`package.json`
|
15
|
-
```json
|
16
|
-
{
|
17
|
-
/// ...some things
|
18
|
-
"react-cli": {
|
19
|
-
// ...some things
|
20
|
-
"css": {
|
21
|
-
"enableRTLSplit": true,
|
22
|
-
"templateLabel": "{{--dir}}",// this is for html template css file path dir template
|
23
|
-
"disableMiniFiySelector": false,
|
24
|
-
"dirVarName": "document.dir" // this will be used for download css based on dir
|
25
|
-
},
|
26
|
-
// ...some things
|
27
|
-
}
|
28
|
-
}
|
29
|
-
```
|
30
|
-
|
1
|
+
# RTL Split
|
2
|
+
|
3
|
+
we are doing in build time generating rtl related css code by using @zohodesk/postcss-rt npm.
|
4
|
+
It was automated, That postcss plugin create rtl reacted css and put them into same file, with css selector [dir=rtl] and ltr realted css with [dir=ltr].
|
5
|
+
Here is problem mostly no one need rtl and ltr related css at the same time in browser,
|
6
|
+
we are try to split them by [dir] and load which type of css is needed.
|
7
|
+
For this purpose we created RTL Split Plugin
|
8
|
+
|
9
|
+
|
10
|
+
# To Try it out rtl-ltr split
|
11
|
+
### how to use this feature?
|
12
|
+
|
13
|
+
to use this feature use have give the below oprtions
|
14
|
+
`package.json`
|
15
|
+
```json
|
16
|
+
{
|
17
|
+
/// ...some things
|
18
|
+
"react-cli": {
|
19
|
+
// ...some things
|
20
|
+
"css": {
|
21
|
+
"enableRTLSplit": true,
|
22
|
+
"templateLabel": "{{--dir}}",// this is for html template css file path dir template
|
23
|
+
"disableMiniFiySelector": false,
|
24
|
+
"dirVarName": "document.dir" // this will be used for download css based on dir
|
25
|
+
},
|
26
|
+
// ...some things
|
27
|
+
}
|
28
|
+
}
|
29
|
+
```
|
30
|
+
|
@@ -6,18 +6,21 @@ Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
exports.replaceCssDirTemplate = replaceCssDirTemplate;
|
7
7
|
exports.replaceCssDirTemplateMapper = replaceCssDirTemplateMapper;
|
8
8
|
exports.strFunctionTempalteToReplaceCssDir = void 0;
|
9
|
+
|
9
10
|
function replaceCssDirTemplate(filePath, cssDirTemplate) {
|
10
|
-
return filePath.endsWith('.ltr.css') ?
|
11
|
-
// ? cssPath.replace('.ltr.css', '.{{--dir}}.css')
|
11
|
+
return filePath.endsWith('.ltr.css') ? // ? cssPath.replace('.ltr.css', '.{{--dir}}.css')
|
12
12
|
filePath.replace('.ltr.css', `.${cssDirTemplate}.css`) : filePath;
|
13
13
|
}
|
14
|
+
|
14
15
|
function replaceCssDirTemplateMapper(assets, cssDirTemplate) {
|
15
16
|
return assets.map(filePath => replaceCssDirTemplate(filePath, cssDirTemplate));
|
16
17
|
}
|
18
|
+
|
17
19
|
const strFunctionTempalteToReplaceCssDir = cssDirTemplate => `function replaceCssDirTemplate(filePath, cssDirTemplate) {
|
18
20
|
return filePath.endsWith(".ltr.css")
|
19
21
|
? // ? cssPath.replace('.ltr.css', '.{{--dir}}.css')
|
20
22
|
filePath.replace(".ltr.css", ".${cssDirTemplate}.css")
|
21
23
|
: filePath;
|
22
24
|
}`;
|
25
|
+
|
23
26
|
exports.strFunctionTempalteToReplaceCssDir = strFunctionTempalteToReplaceCssDir;
|
@@ -4,10 +4,15 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.default = void 0;
|
7
|
+
|
7
8
|
var _fs = _interopRequireDefault(require("fs"));
|
9
|
+
|
8
10
|
var _path = _interopRequireDefault(require("path"));
|
11
|
+
|
9
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
13
|
+
|
10
14
|
let coverageScript = _fs.default.readFileSync(_path.default.resolve(__dirname, '..', 'templates', 'CoverageScriptTemplate.js')).toString();
|
15
|
+
|
11
16
|
class ScriptInstrumentPlugin {
|
12
17
|
apply(compiler) {
|
13
18
|
compiler.hooks.emit.tapAsync('ScriptInstrumentPlugin', (compilation, callback) => {
|
@@ -25,5 +30,7 @@ class ScriptInstrumentPlugin {
|
|
25
30
|
callback();
|
26
31
|
});
|
27
32
|
}
|
33
|
+
|
28
34
|
}
|
35
|
+
|
29
36
|
exports.default = ScriptInstrumentPlugin;
|
@@ -0,0 +1,97 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.default = void 0;
|
7
|
+
|
8
|
+
var _postcss = _interopRequireDefault(require("postcss"));
|
9
|
+
|
10
|
+
var _fs = _interopRequireDefault(require("fs"));
|
11
|
+
|
12
|
+
var _webpackSources = require("webpack-sources");
|
13
|
+
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
15
|
+
|
16
|
+
const path = require('path');
|
17
|
+
|
18
|
+
const isCss = filename => path.extname(filename) === '.css';
|
19
|
+
|
20
|
+
function rootConvertor(rootOriginal, defaultSelector, data, chunkFilename, excludeStrings) {
|
21
|
+
rootOriginal.walkRules((rule, index) => {
|
22
|
+
const prevNode = rootOriginal.nodes[index - 1];
|
23
|
+
|
24
|
+
if (index !== 0 && prevNode.type && prevNode.type === 'comment' && prevNode.text.toLowerCase() === 'updateselector:ignore') {
|
25
|
+
return;
|
26
|
+
}
|
27
|
+
|
28
|
+
if (rule.parent && rule.parent.type === 'atrule') {
|
29
|
+
if (rule.parent.name !== 'media') {
|
30
|
+
return;
|
31
|
+
}
|
32
|
+
}
|
33
|
+
|
34
|
+
if (excludeStrings.includes(rule.selector)) {
|
35
|
+
return;
|
36
|
+
}
|
37
|
+
|
38
|
+
let ruleArr = rule.selector.split(',');
|
39
|
+
ruleArr.forEach((rule, index) => {
|
40
|
+
if (rule.includes(']')) {
|
41
|
+
if (rule.slice(rule.lastIndexOf(']') + 2).trim() === '') {
|
42
|
+
return;
|
43
|
+
} // console.log(
|
44
|
+
// rule.slice(rule.lastIndexOf(']') + 2).trim(),
|
45
|
+
// rule.slice(rule.lastIndexOf(']') + 2).trim() !== ''
|
46
|
+
// );
|
47
|
+
|
48
|
+
|
49
|
+
ruleArr[index] = `${rule.slice(0, rule.lastIndexOf(']') + 1).trim()} ${defaultSelector}${rule.slice(rule.lastIndexOf(']') + 2).trim()}`; // console.log(ruleArr[index]);
|
50
|
+
|
51
|
+
return;
|
52
|
+
}
|
53
|
+
|
54
|
+
ruleArr[index] = data[chunkFilename] ? `${data[chunkFilename].defaultSelector}${rule}` : `${defaultSelector}${rule}`;
|
55
|
+
});
|
56
|
+
rule.selector = ruleArr.join(',\n'); // console.log(`${rule.selector} converted`);
|
57
|
+
});
|
58
|
+
return rootOriginal;
|
59
|
+
}
|
60
|
+
|
61
|
+
class SelectorPlugin {
|
62
|
+
constructor(options = {}) {
|
63
|
+
this.optimize = options.optimize;
|
64
|
+
this.selectorWeightConfig = options.selectorWeightConfig;
|
65
|
+
}
|
66
|
+
|
67
|
+
apply(compiler) {
|
68
|
+
const {
|
69
|
+
defaultSelector,
|
70
|
+
customFileDetails,
|
71
|
+
excludeStrings
|
72
|
+
} = this.selectorWeightConfig;
|
73
|
+
|
74
|
+
const rawdata = _fs.default.readFileSync(customFileDetails);
|
75
|
+
|
76
|
+
const data = JSON.parse(rawdata);
|
77
|
+
compiler.hooks.compilation.tap('selector-weight-rewrite', compilation => {
|
78
|
+
compilation.hooks.optimizeChunkAssets.tapAsync('selector-weight-rewrite', (chunks, callback) => {
|
79
|
+
chunks.forEach(chunk => {
|
80
|
+
chunk.files.filter(isCss).forEach(chunkFilename => {
|
81
|
+
const asset = compilation.assets[chunkFilename];
|
82
|
+
const sourceStr = asset.source();
|
83
|
+
|
84
|
+
const rootOriginal = _postcss.default.parse(sourceStr);
|
85
|
+
|
86
|
+
compilation.assets[chunkFilename] = new _webpackSources.RawSource(rootConvertor(rootOriginal, defaultSelector, data, chunkFilename, excludeStrings).toString());
|
87
|
+
});
|
88
|
+
});
|
89
|
+
callback();
|
90
|
+
});
|
91
|
+
});
|
92
|
+
}
|
93
|
+
|
94
|
+
}
|
95
|
+
|
96
|
+
var _default = SelectorPlugin;
|
97
|
+
exports.default = _default;
|
@@ -4,13 +4,21 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.default = void 0;
|
7
|
+
|
7
8
|
var _fs = _interopRequireDefault(require("fs"));
|
9
|
+
|
8
10
|
var _path = _interopRequireDefault(require("path"));
|
11
|
+
|
9
12
|
var _getI18nFileUrlPathTemplate = require("./I18nSplitPlugin/utils/getI18nFileUrlPathTemplate");
|
13
|
+
|
10
14
|
var _utils = require("../utils");
|
15
|
+
|
11
16
|
var _I18nKeysIdentifer = _interopRequireDefault(require("./I18nSplitPlugin/I18nKeysIdentifer"));
|
17
|
+
|
12
18
|
var _replaceCssDirTemplate = require("./RtlSplitPlugin/replaceCssDirTemplate");
|
19
|
+
|
13
20
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
21
|
+
|
14
22
|
const {
|
15
23
|
css: {
|
16
24
|
enableRTLSplit
|
@@ -19,35 +27,36 @@ const {
|
|
19
27
|
chunkSplitEnable
|
20
28
|
}
|
21
29
|
} = (0, _utils.getOptions)();
|
30
|
+
|
22
31
|
class ServiceWorkerPlugin {
|
23
32
|
constructor(options) {
|
24
33
|
this.i18nFileNameTemplate = options.i18nFileNameTemplate;
|
25
34
|
this.fileName = options.fileName;
|
26
35
|
this.serviceWorkerPath = options.filePath;
|
27
36
|
this.writePath = options.exitPath;
|
28
|
-
this.replaceText = options.replaceText;
|
29
|
-
// this.publicPaths = options.publicPaths;
|
37
|
+
this.replaceText = options.replaceText; // this.publicPaths = options.publicPaths;
|
30
38
|
}
|
31
39
|
|
32
40
|
isInitialChunk(chunk) {
|
33
41
|
if ('canBeInitial' in chunk) {
|
34
42
|
return chunk.canBeInitial();
|
35
43
|
}
|
44
|
+
|
36
45
|
return chunk.isInitial();
|
37
46
|
}
|
47
|
+
|
38
48
|
apply(compiler) {
|
39
49
|
compiler.hooks.emit.tap('ServiceWorkerPlugin', compilation => {
|
40
50
|
_fs.default.readFile(this.serviceWorkerPath, 'utf-8', (err, data) => {
|
41
51
|
if (err) {
|
42
52
|
throw new Error(err);
|
43
53
|
} else {
|
44
|
-
/* const extractedChunks = compilation.chunks.filter(chunk => {
|
45
|
-
if ('canBeInitial' in chunk) {
|
46
|
-
return chunk.canBeInitial();
|
47
|
-
}
|
48
|
-
return chunk.isInitial();
|
54
|
+
/* const extractedChunks = compilation.chunks.filter(chunk => {
|
55
|
+
if ('canBeInitial' in chunk) {
|
56
|
+
return chunk.canBeInitial();
|
57
|
+
}
|
58
|
+
return chunk.isInitial();
|
49
59
|
}); */
|
50
|
-
|
51
60
|
// let [js, css, , , i18nPublicPath] = this.publicPaths;
|
52
61
|
// let initialChunkUrls = [];
|
53
62
|
let allChunkUrls = [];
|
@@ -55,37 +64,44 @@ class ServiceWorkerPlugin {
|
|
55
64
|
let entrypoint = compilation.entrypoints.get('main');
|
56
65
|
let initialChunkUrls = entrypoint.getFiles();
|
57
66
|
const cssDirTemplate = '@dir@';
|
58
|
-
/**
|
59
|
-
* NOTE:
|
60
|
-
* if chunkSplitEnable is false means,
|
61
|
-
* serviceWorker will get i18n files path for html
|
67
|
+
/**
|
68
|
+
* NOTE:
|
69
|
+
* if chunkSplitEnable is false means,
|
70
|
+
* serviceWorker will get i18n files path for html
|
62
71
|
*/
|
72
|
+
|
63
73
|
let initalI18nAssets = chunkSplitEnable ? entrypoint.chunks.filter(chunk => _I18nKeysIdentifer.default.isChunkHasI18n(chunk)).map(chunk => (0, _getI18nFileUrlPathTemplate.getI18nFileUrlPathTemplate)(compilation, chunk, this.i18nFileNameTemplate, '@locale@')) : [];
|
64
74
|
chunkSplitEnable && compilation.chunks.filter(c => !this.isInitialChunk(c)).filter(chunk => _I18nKeysIdentifer.default.isChunkHasI18n(chunk)).forEach(chunk => {
|
65
75
|
// let isInitial = this.isInitialChunk(chunk);
|
66
76
|
allChunkUrls = allChunkUrls.concat(chunk.files);
|
67
77
|
allI18nAssets.push((0, _getI18nFileUrlPathTemplate.getI18nFileUrlPathTemplate)(compilation, chunk, this.i18nFileNameTemplate, '@locale@'));
|
68
78
|
});
|
69
|
-
|
70
79
|
/** Removing source map files from getting added */
|
80
|
+
|
71
81
|
initialChunkUrls = initialChunkUrls.filter(fileName => !fileName.endsWith('.map'));
|
72
82
|
allChunkUrls = allChunkUrls.filter(fileName => !fileName.endsWith('.map'));
|
83
|
+
|
73
84
|
if (enableRTLSplit) {
|
74
85
|
initialChunkUrls = (0, _replaceCssDirTemplate.replaceCssDirTemplateMapper)(initialChunkUrls, cssDirTemplate);
|
75
86
|
allChunkUrls = (0, _replaceCssDirTemplate.replaceCssDirTemplateMapper)(allChunkUrls, cssDirTemplate);
|
76
87
|
}
|
88
|
+
|
77
89
|
let mod = data.replace(this.replaceText, `
|
78
90
|
self.assets = ${JSON.stringify(initialChunkUrls.concat(initalI18nAssets))};
|
79
91
|
self.allChunks = ${JSON.stringify(allChunkUrls.concat(allI18nAssets))};`);
|
92
|
+
|
80
93
|
if (!_fs.default.existsSync(this.writePath)) {
|
81
94
|
_fs.default.mkdirSync(this.writePath, {
|
82
95
|
recursive: true
|
83
96
|
});
|
84
97
|
}
|
98
|
+
|
85
99
|
_fs.default.writeFileSync(_path.default.join(this.writePath, this.fileName), mod);
|
86
100
|
}
|
87
101
|
});
|
88
102
|
});
|
89
103
|
}
|
104
|
+
|
90
105
|
}
|
106
|
+
|
91
107
|
exports.default = ServiceWorkerPlugin;
|