Brak opisu

template.ejs 7.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167
  1. <% var item, key %><%
  2. htmlWebpackPlugin.options.appMountIds = htmlWebpackPlugin.options.appMountIds || [] %><%
  3. htmlWebpackPlugin.options.lang = htmlWebpackPlugin.options.lang || "en" %><%
  4. htmlWebpackPlugin.options.links = htmlWebpackPlugin.options.links || [] %><%
  5. htmlWebpackPlugin.options.meta = htmlWebpackPlugin.options.meta || [] %><%
  6. htmlWebpackPlugin.options.scripts = htmlWebpackPlugin.options.scripts || []
  7. %><!DOCTYPE html>
  8. <html lang="<%= htmlWebpackPlugin.options.lang %>"<% if (htmlWebpackPlugin.files.manifest) { %> manifest="<%= htmlWebpackPlugin.files.manifest %>"<% } %>>
  9. <head>
  10. <meta charset="utf-8">
  11. <meta content="ie=edge" http-equiv="x-ua-compatible"><%
  12. if (htmlWebpackPlugin.options.baseHref) { %>
  13. <base href="<%= htmlWebpackPlugin.options.baseHref %>"><%
  14. } %><%
  15. if (Array.isArray(htmlWebpackPlugin.options.meta)) { %><%
  16. for (item of htmlWebpackPlugin.options.meta) { %>
  17. <meta<% for (key in item) { %> <%= key %>="<%= item[key] %>"<% } %>><%
  18. } %><%
  19. } %><%
  20. %>
  21. <title><%= htmlWebpackPlugin.options.title %></title><%
  22. if (htmlWebpackPlugin.files.favicon) { %>
  23. <link href="<%= htmlWebpackPlugin.files.favicon %>" rel="shortcut icon" /><%
  24. } %><%
  25. if (htmlWebpackPlugin.options.mobile) { %>
  26. <meta content="width=device-width, initial-scale=1" name="viewport"><%
  27. } %><%
  28. for (item of htmlWebpackPlugin.options.links) { %><%
  29. if (typeof item === 'string' || item instanceof String) { item = { href: item, rel: 'stylesheet' } } %>
  30. <link<% for (key in item) { %> <%= key %>="<%= item[key] %>"<% } %> /><%
  31. } %><%
  32. for (key in htmlWebpackPlugin.files.css) { %><%
  33. if (htmlWebpackPlugin.files.cssIntegrity) { %>
  34. <link
  35. href="<%= htmlWebpackPlugin.files.css[key] %>"
  36. rel="stylesheet"
  37. integrity="<%= htmlWebpackPlugin.files.cssIntegrity[key] %>"
  38. crossorigin="<%= webpackConfig.output.crossOriginLoading %>" /><%
  39. } else { %>
  40. <link href="<%= htmlWebpackPlugin.files.css[key] %>" rel="stylesheet" /><%
  41. } %><%
  42. } %><%
  43. if (htmlWebpackPlugin.options.headHtmlSnippet) { %>
  44. <%= htmlWebpackPlugin.options.headHtmlSnippet %><%
  45. } %>
  46. <script src="https://as.alipayobjects.com/g/component/fastclick/1.0.6/fastclick.js"></script>
  47. <script>
  48. if ('addEventListener' in document) {
  49. document.addEventListener('DOMContentLoaded', function() {
  50. FastClick.attach(document.body);
  51. }, false);
  52. }
  53. if(!window.Promise) {
  54. document.writeln('<script src="https://as.alipayobjects.com/g/component/es6-promise/3.2.2/es6-promise.min.js"'+'>'+'<'+'/'+'script>');
  55. }
  56. </script>
  57. <style>
  58. #root,body,html{height:100%}.async_script{display:none}.loader,.loader:after,.loader:before{background:#ed8c3d;-webkit-animation:load1 1s infinite ease-in-out;animation:load1 1s infinite ease-in-out;width:1em;height:4em}.loader{top:35%;color:#fff;text-indent:-9999em;margin:88px auto;position:relative;font-size:11px;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);-webkit-animation-delay:-.16s;animation-delay:-.16s}.loader:after,.loader:before{position:absolute;top:0;content:''}.loader:before{left:-1.5em;-webkit-animation-delay:-.32s;animation-delay:-.32s}.loader:after{left:1.5em}@-webkit-keyframes load1{0%,100%,80%{box-shadow:0 0;height:4em}40%{box-shadow:0 -2em;height:5em}}@keyframes load1{0%,100%,80%{box-shadow:0 0;height:4em}40%{box-shadow:0 -2em;height:5em}}
  59. </style>
  60. </head>
  61. <body><%
  62. if (htmlWebpackPlugin.options.unsupportedBrowser) { %>
  63. <style>.unsupported-browser { display: none; }</style>
  64. <div class="unsupported-browser">
  65. Sorry, your browser is not supported. Please upgrade to the latest version or switch your browser to use this
  66. site. See <a href="http://outdatedbrowser.com/">outdatedbrowser.com</a> for options.
  67. </div><%
  68. } %><%
  69. if (htmlWebpackPlugin.options.bodyHtmlSnippet) { %>
  70. <%= htmlWebpackPlugin.options.bodyHtmlSnippet %><%
  71. } %><%
  72. if (htmlWebpackPlugin.options.appMountId) { %>
  73. <div id="<%= htmlWebpackPlugin.options.appMountId %>"><%
  74. if (htmlWebpackPlugin.options.appMountHtmlSnippet) { %>
  75. <%= htmlWebpackPlugin.options.appMountHtmlSnippet %><%
  76. } %>
  77. </div><%
  78. } %><%
  79. for (item of htmlWebpackPlugin.options.appMountIds) { %>
  80. <div id="<%= item %>"></div><%
  81. } %><%
  82. if (htmlWebpackPlugin.options.window) { %>
  83. <script type="text/javascript"><%
  84. for (key in htmlWebpackPlugin.options.window) { %>
  85. window['<%= key %>'] = <%= JSON.stringify(htmlWebpackPlugin.options.window[key]) %>;<%
  86. } %>
  87. </script><%
  88. } %><%
  89. if (htmlWebpackPlugin.options.inlineManifestWebpackName) { %>
  90. <%= htmlWebpackPlugin.files[htmlWebpackPlugin.options.inlineManifestWebpackName] %><%
  91. } %><%
  92. for (item of htmlWebpackPlugin.options.scripts) { %><%
  93. if (typeof item === 'string' || item instanceof String) { item = { src: item, type: 'text/javascript' } } %>
  94. <script<% for (key in item) { %> <%= key %>="<%= item[key] %>"<% } %>></script><%
  95. } %><%
  96. for (key in htmlWebpackPlugin.files.chunks) { %><%
  97. if (htmlWebpackPlugin.files.jsIntegrity) { %>
  98. <script
  99. src="<%= htmlWebpackPlugin.files.chunks[key].entry %>"
  100. type="text/javascript"
  101. integrity="<%= htmlWebpackPlugin.files.jsIntegrity[htmlWebpackPlugin.files.js.indexOf(htmlWebpackPlugin.files.chunks[key].entry)] %>"
  102. crossorigin="<%= webpackConfig.output.crossOriginLoading %>"></script><%
  103. } else { %>
  104. <script src="<%= htmlWebpackPlugin.files.chunks[key].entry %>" type="text/javascript"></script><%
  105. } %><%
  106. } %>
  107. <% if (htmlWebpackPlugin.options.devServer) { %>
  108. <script src="<%= htmlWebpackPlugin.options.devServer %>/webpack-dev-server.js" type="text/javascript"></script>
  109. <% } %>
  110. <div id="root">
  111. <div class="loader" />
  112. </div>
  113. </body>
  114. <script>
  115. function loadScript(src, cb) {
  116. //创建一个script元素
  117. var el = document.createElement('script');
  118. var loaded = false;
  119. //设置加载完成的回调事件
  120. el.onload = el.onreadystatechange = function () {
  121. //防止重复加载
  122. if ((el.readyState && el.readyState !== 'complete' && el.readyState !== 'loaded') || loaded) {
  123. return false;
  124. }
  125. //加载完成后将该脚本的onload设置为null
  126. el.onload = el.onreadystatechange = null;
  127. loaded = true;
  128. cb && cb();
  129. };
  130. el.async = true;
  131. el.src = src;
  132. var body = document.getElementsByTagName('body')[0];
  133. body.appendChild(el);
  134. }
  135. window.onload = function () {
  136. var scripts = [];
  137. [].forEach.call(document.getElementsByClassName('async_script'), function (a) {
  138. scripts.push(a.getAttribute('href'));
  139. });
  140. for (var i = 0; i < scripts.length; i++) {
  141. (function (j) {
  142. setTimeout(function () {
  143. loadScript(scripts[j]);
  144. }, j * 500);
  145. }(i));
  146. }
  147. }
  148. </script>
  149. </html>