@zohodesk/react-cli 1.1.6 → 1.1.8-exp.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (134) hide show
  1. package/.eslintignore +7 -7
  2. package/.eslintrc.js +180 -180
  3. package/.prettierrc +6 -6
  4. package/Changelog.md +1019 -1019
  5. package/README.md +1293 -1244
  6. package/bin/cli.js +497 -497
  7. package/docs/ComposeMinification.md +13 -13
  8. package/docs/CustomChunks.md +29 -26
  9. package/docs/DevServerPort.md +39 -39
  10. package/docs/DevStart.md +18 -18
  11. package/docs/HoverActive.md +12 -12
  12. package/docs/InstallNode.md +28 -28
  13. package/docs/MarkdownParser.md +18 -0
  14. package/docs/ReactLive.md +13 -13
  15. package/docs/SelectorWeight.md +8 -8
  16. package/docs/TODOS.md +10 -10
  17. package/docs/ValueReplacer.md +60 -60
  18. package/docs/VariableConversion.md +729 -729
  19. package/docs/patternFiltering.md +56 -56
  20. package/docs/warnings_while_install.txt +35 -35
  21. package/files/eslintrc.js +62 -62
  22. package/files/prettierrc.js +3 -3
  23. package/lib/common/splitChunks.js +65 -45
  24. package/lib/common/testPattern.js +9 -9
  25. package/lib/configs/webpack.css.umd.config.js +4 -4
  26. package/lib/configs/webpack.dev.config.js +24 -3
  27. package/lib/configs/webpack.docs.config.js +22 -3
  28. package/lib/configs/webpack.impact.config.js +4 -2
  29. package/lib/configs/webpack.prod.config.js +6 -3
  30. package/lib/deprecationLogger.js +41 -0
  31. package/lib/loaderUtils/configsAssetsLoaders.js +33 -33
  32. package/lib/loaderUtils/getCSSLoaders.js +77 -56
  33. package/lib/loaders/__test__/markdownLoader.spec.js +145 -0
  34. package/lib/loaders/docsLoader.js +3 -0
  35. package/lib/loaders/markdownLoader.js +71 -0
  36. package/lib/loaders/workerLoader.js +9 -9
  37. package/lib/pluginUtils/getDevPlugins.js +8 -7
  38. package/lib/pluginUtils/getProdPlugins.js +6 -6
  39. package/lib/plugins/CustomAttributePlugin.md +35 -35
  40. package/lib/plugins/EFCPlugin.md +6 -6
  41. package/lib/plugins/I18NInjectIntoIndexPlugin.js +4 -4
  42. package/lib/plugins/I18nSplitPlugin/I18nDownlodLogic.js +38 -38
  43. package/lib/plugins/I18nSplitPlugin/I18nFilesEmitter.js +30 -30
  44. package/lib/plugins/I18nSplitPlugin/I18nKeysIdentifer.js +8 -8
  45. package/lib/plugins/I18nSplitPlugin/I18nSplit.md +95 -95
  46. package/lib/plugins/I18nSplitPlugin/README.md +25 -25
  47. package/lib/plugins/I18nSplitPlugin/index.js +57 -57
  48. package/lib/plugins/ResourceHintsPlugin.js +30 -20
  49. package/lib/plugins/RtlSplitPlugin/RtlCssPlugin.js +6 -6
  50. package/lib/plugins/RtlSplitPlugin/RtrSplit.md +30 -30
  51. package/lib/plugins/SelectorPlugin.js +29 -29
  52. package/lib/plugins/ServiceWorkerPlugin.js +9 -9
  53. package/lib/plugins/TPHashMappingPlugin.js +4 -4
  54. package/lib/plugins/VariableConversionCollector.js +59 -59
  55. package/lib/plugins/utils/fileHandling.js +35 -42
  56. package/lib/plugins/variableConvertorUtils.js +9 -9
  57. package/lib/postcss-plugins/RTLSplitPlugin.js +10 -10
  58. package/lib/postcss-plugins/__test__/test1Input.css +38 -38
  59. package/lib/postcss-plugins/__test__/test1Output.css +38 -38
  60. package/lib/postcss-plugins/hoverActivePlugin.js +3 -3
  61. package/lib/schemas/index.js +23 -36
  62. package/lib/sh/pre-commit.sh +34 -34
  63. package/lib/sh/reportPublish.sh +45 -45
  64. package/lib/utils/buildstats.html +148 -148
  65. package/lib/utils/cssClassNameGenerate.js +13 -13
  66. package/lib/utils/deprecationSupport.js +144 -0
  67. package/lib/utils/getOptions.js +18 -78
  68. package/lib/utils/resultSchema.json +73 -73
  69. package/npm-shrinkwrap.json +33393 -33393
  70. package/npm8.md +9 -9
  71. package/package.json +123 -122
  72. package/postpublish.js +8 -8
  73. package/result.json +1 -0
  74. package/templates/app/.eslintrc.js +140 -140
  75. package/templates/app/README.md +12 -12
  76. package/templates/app/app/index.html +24 -24
  77. package/templates/app/app/properties/ApplicationResources_en_US.properties +1 -1
  78. package/templates/app/app/properties/i18nkeys.json +3 -3
  79. package/templates/app/docs/all.html +69 -69
  80. package/templates/app/mockapi/index.js +18 -18
  81. package/templates/app/package.json +37 -37
  82. package/templates/app/src/actions/SampleActions/index.js +37 -37
  83. package/templates/app/src/actions/index.js +65 -65
  84. package/templates/app/src/appUrls.js +19 -19
  85. package/templates/app/src/components/Alert/Alert.js +134 -134
  86. package/templates/app/src/components/Alert/Alert.module.css +79 -79
  87. package/templates/app/src/components/FreezeLayer/FreezeLayer.css +37 -37
  88. package/templates/app/src/components/FreezeLayer/FreezeLayer.js +84 -84
  89. package/templates/app/src/components/Sample/Sample.module.css +11 -11
  90. package/templates/app/src/components/Sample/SampleList.js +61 -61
  91. package/templates/app/src/components/Slider/Slider.css +41 -41
  92. package/templates/app/src/components/Slider/Slider.js +55 -55
  93. package/templates/app/src/containers/AlertContainer/index.js +15 -15
  94. package/templates/app/src/containers/AppContainer/index.js +96 -96
  95. package/templates/app/src/containers/AppContainer/index.module.css +27 -27
  96. package/templates/app/src/containers/CustomMatch/index.js +65 -65
  97. package/templates/app/src/containers/DevTools/index.js +10 -10
  98. package/templates/app/src/containers/Header/index.js +67 -67
  99. package/templates/app/src/containers/Header/index.module.css +43 -43
  100. package/templates/app/src/containers/Redirect/index.js +63 -63
  101. package/templates/app/src/containers/Redirector/index.js +47 -47
  102. package/templates/app/src/containers/SampleListContainer/ListContainer.js +42 -42
  103. package/templates/app/src/containers/SampleListContainer/ListContainer.module.css +3 -3
  104. package/templates/app/src/historyChange.js +5 -5
  105. package/templates/app/src/index.html +10 -10
  106. package/templates/app/src/index.js +24 -24
  107. package/templates/app/src/middleware/PromiseMiddleware.js +59 -59
  108. package/templates/app/src/reducers/alertData.js +11 -11
  109. package/templates/app/src/reducers/index.js +6 -6
  110. package/templates/app/src/reducers/samples.js +19 -19
  111. package/templates/app/src/store/configureStore.dev.js +51 -51
  112. package/templates/app/src/store/configureStore.js +5 -5
  113. package/templates/app/src/store/configureStore.prod.js +26 -26
  114. package/templates/app/src/util/Common.js +5 -5
  115. package/templates/app/src/util/RequestAPI.js +132 -132
  116. package/templates/docs/all.html +250 -249
  117. package/templates/docs/component.html +179 -178
  118. package/templates/docs/components.html +222 -221
  119. package/templates/docs/css/b.min.css +6 -6
  120. package/templates/docs/css/component.css +42 -42
  121. package/templates/docs/css/componentTest.css +6 -6
  122. package/templates/docs/css/hopscotch.css +585 -585
  123. package/templates/docs/css/markdown.css +202 -0
  124. package/templates/docs/css/style.css +1022 -1022
  125. package/templates/docs/impactReportTemplate.html +154 -154
  126. package/templates/docs/index.html +1502 -1501
  127. package/templates/docs/js/active-line.js +72 -72
  128. package/templates/docs/js/b.min.js +7 -7
  129. package/templates/docs/js/codemirror.js +9680 -9680
  130. package/templates/docs/js/designTokens.js +334 -334
  131. package/templates/docs/js/j.min.js +4 -4
  132. package/templates/docs/js/javascript.js +874 -874
  133. package/templates/docs/js/matchbrackets.js +145 -145
  134. package/unittest/index.html +37 -0
package/templates/docs/all.html CHANGED
@@ -1,249 +1,250 @@
1
- <!DOCTYPE html>
2
- <html dir="ltr">
3
- <head>
4
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
5
- <link rel="stylesheet" href="./css/b.min.css">
6
- <style>
7
- body {
8
- position: relative;
9
- }
10
- ul.nav-pills {
11
- top: 20px;
12
- position: fixed;
13
- }
14
- p{
15
- font-size: 18px;
16
- }
17
- .container{
18
- width:100%;
19
- background-color: #473425;
20
- }
21
- .source,.html{
22
- cursor:pointer;
23
- margin:10px;
24
- color:blue;
25
- font-size:15px;
26
- }
27
- #componentInfo{
28
- background:white;
29
- }
30
- .component{
31
- padding:30px 15px;
32
- border-bottom: 2px solid #dddbda;
33
- }
34
- </style>
35
- <script src="./js/j.min.js"></script>
36
- <script src="./js/b.min.js"></script>
37
- </head>
38
- <body data-spy="scroll" data-target="#myScrollspy" data-offset="20">
39
-
40
- <div class="container">
41
- <div class="row">
42
- <nav class="col-sm-2" id="myScrollspy">
43
-
44
-
45
-
46
- <ul class="nav nav-pills nav-stacked" id="componentMenu">
47
-
48
- </ul>
49
-
50
- </nav>
51
- <div class="col-sm-10" id="componentInfo">
52
-
53
- </div>
54
- </div>
55
- </div>
56
-
57
-
58
-
59
-
60
- <script src="/docs/js/vendor.js" ></script>
61
- <script src="/docs/js/main.js" ></script>
62
-
63
- <script>
64
- function toggle(id, type) {
65
- if (type == 'source') {
66
- document.getElementById(id + '_html').style.display = 'none';
67
- } else {
68
- document.getElementById(id + '_source').style.display = 'none';
69
- }
70
- var x = document.getElementById(id + '_' + type);
71
- if (x.style.display === 'none') {
72
- x.style.display = 'block';
73
- } else {
74
- x.style.display = 'none';
75
- }
76
- }
77
- function process(str) {
78
- var div = document.createElement('div');
79
- div.innerHTML = str.trim();
80
-
81
- return format(div, 0).innerHTML;
82
- }
83
-
84
- function format(node, level) {
85
- var indentBefore = new Array(level++ + 1).join(' '),
86
- indentAfter = new Array(level - 1).join(' '),
87
- textNode;
88
-
89
- for (var i = 0; i < node.children.length; i++) {
90
- textNode = document.createTextNode('\n' + indentBefore);
91
- node.insertBefore(textNode, node.children[i]);
92
-
93
- format(node.children[i], level);
94
-
95
- if (node.lastElementChild == node.children[i]) {
96
- textNode = document.createTextNode('\n' + indentAfter);
97
- node.appendChild(textNode);
98
- }
99
- }
100
-
101
- return node;
102
- }
103
- var test = 'test';
104
- var ReactDOM = Component.ReactDOM;
105
- var React = Component.React;
106
- var renderToStaticMarkup = Component.renderToStaticMarkup;
107
-
108
- // class RenderComponent extends React.Component {
109
- // constructor(props) {
110
- // super(props);
111
- // }
112
- // render() {
113
- // var { Components } = this.props;
114
- //
115
- // return (
116
- // <div>
117
- // {Object.keys(Components).map(ComponentName => {
118
- // if (
119
- // ComponentName == 'React' ||
120
- // ComponentName == 'ReactDOM' ||
121
- // ComponentName.indexOf('__') == -1
122
- // ) {
123
- // return 'test';
124
- // }
125
- //
126
- // var Component = Components[ComponentName];
127
- // console.dir(Component);
128
- //
129
- // return (
130
- // <div>
131
- // <div><Component /></div>
132
- // <div>{ComponentName}</div>
133
- // </div>
134
- // );
135
- // })}
136
- // </div>
137
- // );
138
- // }
139
- // }
140
-
141
- var baseComponent = {};
142
- var baseComponentState = {};
143
- Object.keys(Component).forEach(c => {
144
- var componentObj = Component[c];
145
- if (c.indexOf('__') != -1) {
146
- if (baseComponentState[c.split('__')[0]]) {
147
- baseComponentState[c.split('__')[0]].push(c);
148
- } else {
149
- baseComponentState[c.split('__')[0]] = [c];
150
- }
151
- } else if (
152
- componentObj.docs &&
153
- componentObj.docs.external &&
154
- (componentObj.docs.componentGroup == 'Atom' ||
155
- componentObj.docs.componentGroup == 'Molecule' ||
156
- componentObj.docs.componentGroup == 'Organism')
157
- ) {
158
- baseComponent[c] = componentObj;
159
- }
160
- });
161
- console.log(baseComponent);
162
- console.log(baseComponentState);
163
- var str = Object.keys(baseComponent)
164
- .sort()
165
- .reduce((result, componentKey) => {
166
- return `${result}<li><a href="#${componentKey}" class="menuItem">${componentKey}</a></li>`;
167
- }, '');
168
-
169
- var getComponentState = componentKey => {
170
- var result = '';
171
- baseComponentState[componentKey].forEach(ckey => {
172
- result += `<div><span onClick="toggle('${ckey}','source')" class="source">Source</span><span onClick="toggle('${ckey}',
173
- 'html')" class="html">html</span><pre id="${ckey +
174
- '_source'}" style="display:none"></pre><pre id="${ckey +
175
- '_html'}" style="display:none"></pre><div id="${ckey}"></div></div>`;
176
- setTimeout(() => {
177
- ReactDOM.render(
178
- React.createElement(Component[ckey]),
179
- document.getElementById(ckey)
180
- );
181
- document.getElementById(ckey + '_source').innerText =
182
- Component[ckey].docs.source;
183
- document.getElementById(ckey + '_html').innerText = process(
184
- renderToStaticMarkup(React.createElement(Component[ckey]))
185
- );
186
- }, 100);
187
- });
188
- return result;
189
- };
190
- var componentInfo = Object.keys(baseComponent)
191
- .sort()
192
- .reduce((result, componentKey) => {
193
- return `${result}<div id="${componentKey}" class="component">
194
- <h1>${componentKey}</h1>
195
- <p>
196
- ${baseComponent[componentKey].docs.description || 'No description'}
197
- </p>
198
- <h4>PropTypes</h4>
199
- <table class="table table-striped">
200
- <tr><th>PropsName</th><th>type</th><th>isRequired</th></th>
201
- ${Object.keys(baseComponent[componentKey].propTypes).sort()
202
- .map(pKey => {
203
- var pObj = baseComponent[componentKey].propTypes[pKey];
204
- return `<tr>
205
- <td>
206
- ${pKey}
207
- </td>
208
-
209
- <td>
210
-
211
- ${pObj.hookType}
212
-
213
- </td><td>
214
-
215
- ${pObj.isRequired ? '' : 'true'}
216
-
217
- </td></tr>`;
218
- })
219
- .join('')}
220
- </table>
221
- <h4>State</h4>
222
- ${getComponentState(componentKey)}
223
- ${baseComponent[componentKey].docs.additionDescription ? `<h4>More Information about component</h4><p>${baseComponent[componentKey].docs.additionDescription}</p>`:""}
224
-
225
- </div>`;
226
- }, '');
227
-
228
- document.getElementById('componentMenu').innerHTML = str;
229
- document.getElementById('componentInfo').innerHTML = componentInfo;
230
- // var html = Object.keys(Component).reduce((res, cName) => {
231
- // return `${res} <div><div id="${cName}"></div><div>${cName}</div></div>`;
232
- // });
233
- // document.getElementById('react').innerHTML = html;
234
- // Object.keys(Component).forEach(cName => {
235
- // if (cName == 'React' || cName == 'ReactDOM') {
236
- // return;
237
- // }
238
- // var C = Component[cName];
239
- // try {
240
- // ReactDOM.render(<C />, document.getElementById(cName));
241
- // } catch (e) {
242
- // console.log('Error render', cName);
243
- // }
244
- // });
245
- </script>
246
-
247
-
248
- </body>
249
- </html>
1
+ <!DOCTYPE html>
2
+ <html dir="ltr">
3
+ <head>
4
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
5
+ <link rel="stylesheet" href="./css/markdown.css">
6
+ <link rel="stylesheet" href="./css/b.min.css">
7
+ <style>
8
+ body {
9
+ position: relative;
10
+ }
11
+ ul.nav-pills {
12
+ top: 20px;
13
+ position: fixed;
14
+ }
15
+ p{
16
+ font-size: 18px;
17
+ }
18
+ .container{
19
+ width:100%;
20
+ background-color: #473425;
21
+ }
22
+ .source,.html{
23
+ cursor:pointer;
24
+ margin:10px;
25
+ color:blue;
26
+ font-size:15px;
27
+ }
28
+ #componentInfo{
29
+ background:white;
30
+ }
31
+ .component{
32
+ padding:30px 15px;
33
+ border-bottom: 2px solid #dddbda;
34
+ }
35
+ </style>
36
+ <script src="./js/j.min.js"></script>
37
+ <script src="./js/b.min.js"></script>
38
+ </head>
39
+ <body data-spy="scroll" data-target="#myScrollspy" data-offset="20">
40
+
41
+ <div class="container">
42
+ <div class="row">
43
+ <nav class="col-sm-2" id="myScrollspy">
44
+
45
+
46
+
47
+ <ul class="nav nav-pills nav-stacked" id="componentMenu">
48
+
49
+ </ul>
50
+
51
+ </nav>
52
+ <div class="col-sm-10" id="componentInfo">
53
+
54
+ </div>
55
+ </div>
56
+ </div>
57
+
58
+
59
+
60
+
61
+ <script src="/docs/js/vendor.js" ></script>
62
+ <script src="/docs/js/main.js" ></script>
63
+
64
+ <script>
65
+ function toggle(id, type) {
66
+ if (type == 'source') {
67
+ document.getElementById(id + '_html').style.display = 'none';
68
+ } else {
69
+ document.getElementById(id + '_source').style.display = 'none';
70
+ }
71
+ var x = document.getElementById(id + '_' + type);
72
+ if (x.style.display === 'none') {
73
+ x.style.display = 'block';
74
+ } else {
75
+ x.style.display = 'none';
76
+ }
77
+ }
78
+ function process(str) {
79
+ var div = document.createElement('div');
80
+ div.innerHTML = str.trim();
81
+
82
+ return format(div, 0).innerHTML;
83
+ }
84
+
85
+ function format(node, level) {
86
+ var indentBefore = new Array(level++ + 1).join(' '),
87
+ indentAfter = new Array(level - 1).join(' '),
88
+ textNode;
89
+
90
+ for (var i = 0; i < node.children.length; i++) {
91
+ textNode = document.createTextNode('\n' + indentBefore);
92
+ node.insertBefore(textNode, node.children[i]);
93
+
94
+ format(node.children[i], level);
95
+
96
+ if (node.lastElementChild == node.children[i]) {
97
+ textNode = document.createTextNode('\n' + indentAfter);
98
+ node.appendChild(textNode);
99
+ }
100
+ }
101
+
102
+ return node;
103
+ }
104
+ var test = 'test';
105
+ var ReactDOM = Component.ReactDOM;
106
+ var React = Component.React;
107
+ var renderToStaticMarkup = Component.renderToStaticMarkup;
108
+
109
+ // class RenderComponent extends React.Component {
110
+ // constructor(props) {
111
+ // super(props);
112
+ // }
113
+ // render() {
114
+ // var { Components } = this.props;
115
+ //
116
+ // return (
117
+ // <div>
118
+ // {Object.keys(Components).map(ComponentName => {
119
+ // if (
120
+ // ComponentName == 'React' ||
121
+ // ComponentName == 'ReactDOM' ||
122
+ // ComponentName.indexOf('__') == -1
123
+ // ) {
124
+ // return 'test';
125
+ // }
126
+ //
127
+ // var Component = Components[ComponentName];
128
+ // console.dir(Component);
129
+ //
130
+ // return (
131
+ // <div>
132
+ // <div><Component /></div>
133
+ // <div>{ComponentName}</div>
134
+ // </div>
135
+ // );
136
+ // })}
137
+ // </div>
138
+ // );
139
+ // }
140
+ // }
141
+
142
+ var baseComponent = {};
143
+ var baseComponentState = {};
144
+ Object.keys(Component).forEach(c => {
145
+ var componentObj = Component[c];
146
+ if (c.indexOf('__') != -1) {
147
+ if (baseComponentState[c.split('__')[0]]) {
148
+ baseComponentState[c.split('__')[0]].push(c);
149
+ } else {
150
+ baseComponentState[c.split('__')[0]] = [c];
151
+ }
152
+ } else if (
153
+ componentObj.docs &&
154
+ componentObj.docs.external &&
155
+ (componentObj.docs.componentGroup == 'Atom' ||
156
+ componentObj.docs.componentGroup == 'Molecule' ||
157
+ componentObj.docs.componentGroup == 'Organism')
158
+ ) {
159
+ baseComponent[c] = componentObj;
160
+ }
161
+ });
162
+ console.log(baseComponent);
163
+ console.log(baseComponentState);
164
+ var str = Object.keys(baseComponent)
165
+ .sort()
166
+ .reduce((result, componentKey) => {
167
+ return `${result}<li><a href="#${componentKey}" class="menuItem">${componentKey}</a></li>`;
168
+ }, '');
169
+
170
+ var getComponentState = componentKey => {
171
+ var result = '';
172
+ baseComponentState[componentKey].forEach(ckey => {
173
+ result += `<div><span onClick="toggle('${ckey}','source')" class="source">Source</span><span onClick="toggle('${ckey}',
174
+ 'html')" class="html">html</span><pre id="${ckey +
175
+ '_source'}" style="display:none"></pre><pre id="${ckey +
176
+ '_html'}" style="display:none"></pre><div id="${ckey}"></div></div>`;
177
+ setTimeout(() => {
178
+ ReactDOM.render(
179
+ React.createElement(Component[ckey]),
180
+ document.getElementById(ckey)
181
+ );
182
+ document.getElementById(ckey + '_source').innerText =
183
+ Component[ckey].docs.source;
184
+ document.getElementById(ckey + '_html').innerText = process(
185
+ renderToStaticMarkup(React.createElement(Component[ckey]))
186
+ );
187
+ }, 100);
188
+ });
189
+ return result;
190
+ };
191
+ var componentInfo = Object.keys(baseComponent)
192
+ .sort()
193
+ .reduce((result, componentKey) => {
194
+ return `${result}<div id="${componentKey}" class="component">
195
+ <h1>${componentKey}</h1>
196
+ <p>
197
+ ${baseComponent[componentKey].docs.description || 'No description'}
198
+ </p>
199
+ <h4>PropTypes</h4>
200
+ <table class="table table-striped">
201
+ <tr><th>PropsName</th><th>type</th><th>isRequired</th></th>
202
+ ${Object.keys(baseComponent[componentKey].propTypes).sort()
203
+ .map(pKey => {
204
+ var pObj = baseComponent[componentKey].propTypes[pKey];
205
+ return `<tr>
206
+ <td>
207
+ ${pKey}
208
+ </td>
209
+
210
+ <td>
211
+
212
+ ${pObj.hookType}
213
+
214
+ </td><td>
215
+
216
+ ${pObj.isRequired ? '' : 'true'}
217
+
218
+ </td></tr>`;
219
+ })
220
+ .join('')}
221
+ </table>
222
+ <h4>State</h4>
223
+ ${getComponentState(componentKey)}
224
+ ${baseComponent[componentKey].docs.additionDescription ? `<h4>More Information about component</h4><p>${baseComponent[componentKey].docs.additionDescription}</p>`:""}
225
+
226
+ </div>`;
227
+ }, '');
228
+
229
+ document.getElementById('componentMenu').innerHTML = str;
230
+ document.getElementById('componentInfo').innerHTML = componentInfo;
231
+ // var html = Object.keys(Component).reduce((res, cName) => {
232
+ // return `${res} <div><div id="${cName}"></div><div>${cName}</div></div>`;
233
+ // });
234
+ // document.getElementById('react').innerHTML = html;
235
+ // Object.keys(Component).forEach(cName => {
236
+ // if (cName == 'React' || cName == 'ReactDOM') {
237
+ // return;
238
+ // }
239
+ // var C = Component[cName];
240
+ // try {
241
+ // ReactDOM.render(<C />, document.getElementById(cName));
242
+ // } catch (e) {
243
+ // console.log('Error render', cName);
244
+ // }
245
+ // });
246
+ </script>
247
+
248
+
249
+ </body>
250
+ </html>