| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104 |
- "use strict";
- var __importDefault = (this && this.__importDefault) || function (mod) {
- return (mod && mod.__esModule) ? mod : { "default": mod };
- };
- Object.defineProperty(exports, "__esModule", { value: true });
- exports.renderTemplate = void 0;
- /* eslint-disable @typescript-eslint/require-await */
- const fs_1 = require("fs");
- const path_1 = __importDefault(require("path"));
- const htmlEscape = (str) => str
- .replace(/&/g, "&")
- .replace(/"/g, """)
- .replace(/'/g, "'")
- .replace(/</g, "<")
- .replace(/>/g, ">");
- const buildHtmlTemplate = (title, script, nodesData, style) => `
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8" />
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
- <meta http-equiv="X-UA-Compatible" content="ie=edge" />
- <title>${htmlEscape(title)}</title>
- <style>
- ${style}
- </style>
- </head>
- <body>
- <main></main>
- <script>
- /*<!--*/
- ${script}
- /*-->*/
- </script>
- <script>
- /*<!--*/
- const data = ${nodesData};
- const run = () => {
- const width = window.innerWidth;
- const height = window.innerHeight;
- const chartNode = document.querySelector("main");
- drawChart.default(chartNode, data, width, height);
- };
- window.addEventListener('resize', run);
- document.addEventListener('DOMContentLoaded', run);
- /*-->*/
- </script>
- </body>
- </html>
- `;
- const buildHtml = (template) => async ({ title, data }) => {
- const [script, style] = await Promise.all([
- fs_1.promises.readFile(path_1.default.join(__dirname, "..", "lib", `${template}.js`), "utf8"),
- fs_1.promises.readFile(path_1.default.join(__dirname, "..", "lib", `${template}.css`), "utf8"),
- ]);
- return buildHtmlTemplate(title, script, JSON.stringify(data), style);
- };
- const outputRawData = (data) => JSON.stringify(data, null, 2);
- const outputPlainTextList = (data) => {
- var _a;
- const bundles = {};
- for (const meta of Object.values(data.nodeMetas)) {
- for (const [bundleId, uid] of Object.entries(meta.moduleParts)) {
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
- const { metaUid: mainUid, ...lengths } = data.nodeParts[uid];
- bundles[bundleId] = (_a = bundles[bundleId]) !== null && _a !== void 0 ? _a : [];
- bundles[bundleId].push([meta.id, lengths]);
- }
- }
- const bundlesEntries = Object.entries(bundles).sort((e1, e2) => e1[0].localeCompare(e2[0]));
- let output = "";
- const IDENT = " ";
- for (const [bundleId, files] of bundlesEntries) {
- output += bundleId + ":\n";
- files.sort((e1, e2) => e1[0].localeCompare(e2[0]));
- for (const [file, lengths] of files) {
- output += IDENT + file + ":\n";
- output += IDENT + IDENT + `rendered: ${String(lengths.renderedLength)}\n`;
- if (data.options.gzip) {
- output += IDENT + IDENT + `gzip: ${String(lengths.gzipLength)}\n`;
- }
- if (data.options.brotli) {
- output += IDENT + IDENT + `brotli: ${String(lengths.brotliLength)}\n`;
- }
- }
- }
- return output;
- };
- const TEMPLATE_TYPE_RENDERED = {
- network: buildHtml("network"),
- sunburst: buildHtml("sunburst"),
- treemap: buildHtml("treemap"),
- "raw-data": async ({ data }) => outputRawData(data),
- list: async ({ data }) => outputPlainTextList(data),
- };
- const renderTemplate = (templateType, options) => {
- return TEMPLATE_TYPE_RENDERED[templateType](options);
- };
- exports.renderTemplate = renderTemplate;
|