webpack-bundle-analyzer 4.1.0 → 4.2.0

package/CHANGELOG.md

@@ -14,6 +14,15 @@ _Note: Gaps between patch versions are faulty, broken or test releases._
 
 <!-- Add changelog entries for new changes under this section -->
 
+## 4.2.0
+
+ * **Improvement**
+   * A  number of improvements to reduce the number of dependencies ([#391](https://github.com/webpack-contrib/webpack-bundle-analyzer/pull/391), [#396](https://github.com/webpack-contrib/webpack-bundle-analyzer/pull/396), [#397](https://github.com/webpack-contrib/webpack-bundle-analyzer/pull/397))
+
+ * **Bug Fix**
+   * Prevent crashes for bundles generated from webpack array configs. ([#394](https://github.com/webpack-contrib/webpack-bundle-analyzer/pull/394) by [@ctavan](https://github.com/ctavan))
+   * Fix `non-asset` assets causing analyze failure. ([#385](https://github.com/webpack-contrib/webpack-bundle-analyzer/issues/385) by [@ZKHelloworld](https://github.com/ZKHelloworld))
+
 ## 4.1.0
 
  * **Improvement**

package/lib/BundleAnalyzerPlugin.js

@@ -1,8 +1,8 @@
 "use strict";
 
-const path = require('path');
+const fs = require('fs');
 
-const mkdir = require('mkdirp');
+const path = require('path');
 
 const {
   bold
@@ -90,7 +90,9 @@ class BundleAnalyzerPlugin {
 
   async generateStatsFile(stats) {
     const statsFilepath = path.resolve(this.compiler.outputPath, this.opts.statsFilename);
-    mkdir.sync(path.dirname(statsFilepath));
+    await fs.promises.mkdir(path.dirname(statsFilepath), {
+      recursive: true
+    });
 
     try {
       await writeStats(stats, statsFilepath);

package/lib/analyzer.js

@@ -42,7 +42,7 @@ function getViewerData(bundleStats, bundleDir, opts) {
     // leave the 1st one as that is considered the 'root' asset.
 
     for (let i = 1; i < children.length; i++) {
-      bundleStats.children[i].assets.forEach(asset => {
+      children[i].assets.forEach(asset => {
         asset.isChild = true;
         bundleStats.assets.push(asset);
       });
@@ -58,9 +58,14 @@ function getViewerData(bundleStats, bundleDir, opts) {
   } // Picking only `*.js or *.mjs` assets from bundle that has non-empty `chunks` array
 
 
-  bundleStats.assets = _.filter(bundleStats.assets, asset => {
-    // Removing query part from filename (yes, somebody uses it for some reason and Webpack supports it)
+  bundleStats.assets = bundleStats.assets.filter(asset => {
+    // Filter out non 'asset' type asset if type is provided (Webpack 5 add a type to indicate asset types)
+    if (asset.type && asset.type !== 'asset') {
+      return false;
+    } // Removing query part from filename (yes, somebody uses it for some reason and Webpack supports it)
     // See #22
+
+
     asset.name = asset.name.replace(FILENAME_QUERY_REGEXP, '');
     return FILENAME_EXTENSIONS.test(asset.name) && !_.isEmpty(asset.chunks) && isAssetIncluded(asset.name);
   }); // Trying to parse bundle assets and get real module sizes if `bundleDir` is provided
@@ -85,8 +90,7 @@ function getViewerData(bundleStats, bundleDir, opts) {
       }
 
       bundlesSources[statAsset.name] = _.pick(bundleInfo, 'src', 'runtimeSrc');
-
-      _.assign(parsedModules, bundleInfo.modules);
+      Object.assign(parsedModules, bundleInfo.modules);
     }
 
     if (_.isEmpty(bundlesSources)) {
@@ -96,7 +100,7 @@ function getViewerData(bundleStats, bundleDir, opts) {
     }
   }
 
-  const assets = _.transform(bundleStats.assets, (result, statAsset) => {
+  const assets = bundleStats.assets.reduce((result, statAsset) => {
     // If asset is a childAsset, then calculate appropriate bundle modules by looking through stats.children
     const assetBundles = statAsset.isChild ? getChildAssetBundles(bundleStats, statAsset.name) : bundleStats;
     const modules = assetBundles ? getBundleModules(assetBundles) : [];
@@ -149,22 +153,20 @@ function getViewerData(bundleStats, bundleDir, opts) {
 
     asset.modules = assetModules;
     asset.tree = createModulesTree(asset.modules);
+    return result;
   }, {});
-
-  return _.transform(assets, (result, asset, filename) => {
-    result.push({
-      label: filename,
-      isAsset: true,
-      // Not using `asset.size` here provided by Webpack because it can be very confusing when `UglifyJsPlugin` is used.
-      // In this case all module sizes from stats file will represent unminified module sizes, but `asset.size` will
-      // be the size of minified bundle.
-      // Using `asset.size` only if current asset doesn't contain any modules (resulting size equals 0)
-      statSize: asset.tree.size || asset.size,
-      parsedSize: asset.parsedSize,
-      gzipSize: asset.gzipSize,
-      groups: _.invokeMap(asset.tree.children, 'toChartData')
-    });
-  }, []);
+  return Object.entries(assets).map(([filename, asset]) => ({
+    label: filename,
+    isAsset: true,
+    // Not using `asset.size` here provided by Webpack because it can be very confusing when `UglifyJsPlugin` is used.
+    // In this case all module sizes from stats file will represent unminified module sizes, but `asset.size` will
+    // be the size of minified bundle.
+    // Using `asset.size` only if current asset doesn't contain any modules (resulting size equals 0)
+    statSize: asset.tree.size || asset.size,
+    parsedSize: asset.parsedSize,
+    gzipSize: asset.gzipSize,
+    groups: _.invokeMap(asset.tree.children, 'toChartData')
+  }));
 }
 
 function readStatsFromFile(filename) {
@@ -172,7 +174,7 @@ function readStatsFromFile(filename) {
 }
 
 function getChildAssetBundles(bundleStats, assetName) {
-  return _.find(bundleStats.children, c => _(c.assetsByChunkName).values().flatten().includes(assetName));
+  return (bundleStats.children || []).find(c => _(c.assetsByChunkName).values().flatten().includes(assetName));
 }
 
 function getBundleModules(bundleStats) {
@@ -182,7 +184,7 @@ function getBundleModules(bundleStats) {
 
 function assetHasModule(statAsset, statModule) {
   // Checking if this module is the part of asset chunks
-  return _.some(statModule.chunks, moduleChunk => _.includes(statAsset.chunks, moduleChunk));
+  return statModule.chunks.some(moduleChunk => statAsset.chunks.includes(moduleChunk));
 }
 
 function isEntryModule(statModule) {
@@ -195,9 +197,7 @@ function isRuntimeModule(statModule) {
 
 function createModulesTree(modules) {
   const root = new Folder('.');
-
-  _.each(modules, module => root.addModule(module));
-
+  modules.forEach(module => root.addModule(module));
   root.mergeNestedFolders();
   return root;
 }

package/lib/bin/analyzer.js

@@ -6,8 +6,6 @@ const {
   dirname
 } = require('path');
 
-const _ = require('lodash');
-
 const commander = require('commander');
 
 const {
@@ -113,7 +111,7 @@ function showHelp(error) {
 }
 
 function br(str) {
-  return `\n${_.repeat(' ', 28)}${str}`;
+  return `\n${' '.repeat(28)}${str}`;
 }
 
 function array() {

package/lib/parseUtils.js

@@ -112,7 +112,7 @@ function parseBundle(bundlePath) {
       // features (e.g. `umd` library output) can wrap modules list into additional IIFE.
 
 
-      _.each(args, arg => c(arg, state));
+      args.forEach(arg => c(arg, state));
     }
 
   });
@@ -136,8 +136,7 @@ function parseBundle(bundlePath) {
 
 
 function getBundleRuntime(content, modulesLocations) {
-  const sortedLocations = _(modulesLocations).values().sortBy('start');
-
+  const sortedLocations = Object.values(modulesLocations || {}).sort((a, b) => a.start - b.start);
   let result = '';
   let lastIndex = 0;
 
@@ -177,11 +176,11 @@ function isSimpleModulesList(node) {
 }
 
 function isModulesHash(node) {
-  return node.type === 'ObjectExpression' && _(node.properties).map('value').every(isModuleWrapper);
+  return node.type === 'ObjectExpression' && node.properties.map(node => node.value).every(isModuleWrapper);
 }
 
 function isModulesArray(node) {
-  return node.type === 'ArrayExpression' && _.every(node.elements, elem => // Some of array items may be skipped because there is no module with such id
+  return node.type === 'ArrayExpression' && node.elements.every(elem => // Some of array items may be skipped because there is no module with such id
   !elem || isModuleWrapper(elem));
 }
 
@@ -213,7 +212,7 @@ function isNumericId(node) {
 
 function isChunkIds(node) {
   // Array of numeric or string ids. Chunk IDs are strings when NamedChunksPlugin is used
-  return node.type === 'ArrayExpression' && _.every(node.elements, isModuleId);
+  return node.type === 'ArrayExpression' && node.elements.every(isModuleId);
 }
 
 function isAsyncChunkPushExpression(node) {
@@ -241,9 +240,10 @@ function getModulesLocations(node) {
   if (node.type === 'ObjectExpression') {
     // Modules hash
     const modulesNodes = node.properties;
-    return _.transform(modulesNodes, (result, moduleNode) => {
+    return modulesNodes.reduce((result, moduleNode) => {
       const moduleId = moduleNode.key.name || moduleNode.key.value;
       result[moduleId] = getModuleLocation(moduleNode.value);
+      return result;
     }, {});
   }
 
@@ -256,9 +256,12 @@ function getModulesLocations(node) {
     0;
     const modulesNodes = isOptimizedArray ? // The modules reside in the `concat()` function call arguments
     node.arguments[0].elements : node.elements;
-    return _.transform(modulesNodes, (result, moduleNode, i) => {
-      if (!moduleNode) return;
-      result[i + minId] = getModuleLocation(moduleNode);
+    return modulesNodes.reduce((result, moduleNode, i) => {
+      if (moduleNode) {
+        result[i + minId] = getModuleLocation(moduleNode);
+      }
+
+      return result;
     }, {});
   }
 

package/lib/template.js

@@ -0,0 +1,73 @@
+"use strict";
+
+/* eslint-disable max-len */
+const path = require('path');
+
+const fs = require('fs');
+
+const _ = require('lodash');
+
+const projectRoot = path.resolve(__dirname, '..');
+const assetsRoot = path.join(projectRoot, 'public');
+exports.renderViewer = renderViewer;
+/**
+ * Escapes `<` characters in JSON to safely use it in `<script>` tag.
+ */
+
+function escapeJson(json) {
+  return JSON.stringify(json).replace(/</gu, '\\u003c');
+}
+
+function getAssetContent(filename) {
+  const assetPath = path.join(assetsRoot, filename);
+
+  if (!assetPath.startsWith(assetsRoot)) {
+    throw new Error(`"${filename}" is outside of the assets root`);
+  }
+
+  return fs.readFileSync(assetPath, 'utf8');
+}
+
+function html(strings, ...values) {
+  return strings.map((string, index) => `${string}${values[index] || ''}`).join('');
+}
+
+function getScript(filename, mode) {
+  if (mode === 'static') {
+    return `<!-- ${_.escape(filename)} -->
+<script>${getAssetContent(filename)}</script>`;
+  } else {
+    return `<script src="${_.escape(filename)}"></script>`;
+  }
+}
+
+function renderViewer({
+  title,
+  enableWebSocket,
+  chartData,
+  defaultSizes,
+  mode
+} = {}) {
+  return html`<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1"/>
+    <title>${_.escape(title)}</title>
+    <link rel="shortcut icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAABrVBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////+O1foceMD///+J0/qK1Pr7/v8Xdr/9///W8P4UdL7L7P0Scr2r4Pyj3vwad8D5/f/2/f+55f3E6f34+/2H0/ojfMKpzOd0rNgQcb3F3O/j9f7c8v6g3Pz0/P/w+v/q+P7n9v6T1/uQ1vuE0vqLut/y+v+Z2fvt+f+15Pzv9fuc2/vR7v2V2Pvd6/bg9P7I6/285/2y4/yp3/zp8vk8i8kqgMT7/P31+fyv4vxGkcz6/P6/6P3j7vfS5PNnpNUxhcbO7f7F6v3O4vHK3/DA2u631Ouy0eqXweKJud5wqthfoNMMbLvY8f73+v2dxeR8sNtTmdDx9/zX6PSjyeaCtd1YnNGX2PuQveCGt95Nls42h8dLlM3F4vBtAAAAM3RSTlMAAyOx0/sKBvik8opWGBMOAe3l1snDm2E9LSb06eHcu5JpHbarfHZCN9CBb08zzkdNS0kYaptYAAAFV0lEQVRYw92X51/aYBDHHS2O2qqttVbrqNq9m+TJIAYIShBkWwqIiCgoWvfeq7Z2/s29hyQNyUcR7LveGwVyXy6XH8/9rqxglLfUPLxVduUor3h0rfp2TYvpivk37929TkG037hffoX0+peVtZQc1589rigVUdXS/ABSAyEmGIO/1XfvldSK8vs3OqB6u3m0nxmIrvgB0dj7rr7Y9IbuF68hnfFaiHA/sxqm0wciIG43P60qKv9WXWc1RXGh/mFESFABTSBi0sNAKzqet17eCtOb3kZIDwxEEU0oAIJGYxNBDhBND29e0rtXXbcpuPmED9IhEAAQ/AXEaF8EPmnrrKsv0LvWR3fg5sWDNAFZOgAgaKvZDogHNU9MFwnnYROkc56RD5CjAbQX9Ow4g7upCsvYu55aSI/Nj0H1akgKQEUM94dwK65hYRmFU9MIcH/fqJYOZYcnuJSU/waKDgTOEVaVKhwrTRP5XzgSpAITYzom7UvkhFX5VutmxeNnWDjjswTKTyfgluNDGbUpWissXhF3s7mlSml+czWkg3D0l1nNjGNjz3myOQOa1KM/jOS6ebdbAVTCi4gljHSFrviza7tOgRWcS0MOUX9zdNgag5w7rRqA44Lzw0hr1WqES36dFliSJFlh2rXIae3FFcDDgKdxrUIDePr8jGcSClV1u7A9xeN0ModY/pHMxmR1EzRh8TJiwqsHmKW0l4FCEZI+jHio+JdPPE9qwQtTRxku2D8sIeRL2LnxWSllANCQGOIiqVHAz2ye2JR0DcH+HoxDkaADLjgxjKQ+AwCX/g0+DNgdG0ukYCONAe+dbc2IAc6fwt1ARoDSezNHxV2Cmzwv3O6lDMV55edBGwGK9n1+x2F8EDfAGCxug8MhpsMEcTEAWf3rx2vZhe/LAmtIn/6apE6PN0ULKgywD9mmdxbmFl3OvD5AS5fW5zLbv/YHmcsBTjf/afDz3MaZTVCfAP9z6/Bw6ycv8EUBWJIn9zYcoAWWlW9+OzO3vkTy8H+RANLmdrpOuYWdZYEXpo+TlCJrW5EARb7fF+bWdqf3hhyZI1nWJQHgznErZhbjoEsWqi8dQNoE294aldzFurwSABL2XXMf9+H1VQGke9exw5P/AnA5Pv5ngMul7LOvO922iwACu8WkCwLCafvM4CeWPxfA8lNHcWZSoi8EwMAIciKX2Z4SWCMAa3snCZ/G4EA8D6CMLNFsGQhkkz/gQNEBbPCbWsxGUpYVu3z8IyNAknwJkfPMEhLyrdi5RTyUVACkw4GSFRNWJNEW+fgPGwHD8/JxnRuLabN4CGNRkAE23na2+VmEAUmrYymSGjMAYqH84YUIyzgzs3XC7gNgH36Vcc4zKY9o9fgPBXUAiHHwVboBHGLiX6Zcjp1f2wu4tvzZKo0ecPnDtQYDQvJXaBeNzce45Fp28ZQLrEZVuFqgBwOalArKXnW1UzlnSusQKJqKYNuz4tOnI6sZG4zanpemv+7ySU2jbA9h6uhcgpfy6G2PahirDZ6zvq6zDduMVFTKvzw8wgyEdelwY9in3XkEPs3osJuwRQ4qTkfzifndg9Gfc4pdsu82+tTnHZTBa2EAMrqr2t43pguc8tNm7JQVQ2S0ukj2d22dhXYP0/veWtwKrCkNoNimAN5+Xr/oLrxswKbVJjteWrX7eR63o4j9q0GxnaBdWgGA5VStpanIjQmEhV0/nVt5VOFUvix6awJhPcAaTEShgrG+iGyvb5a0Ndb1YGHFPEwoqAinoaykaID1o1pdPNu7XsnCKQ3R+hwWIIhGvORcJUBYXe3Xa3vq/mF/N9V13ugufMkfXn+KHsRD0B8AAAAASUVORK5CYII=" type="image/x-icon" />
+
+    <script>
+      window.enableWebSocket = ${escapeJson(enableWebSocket)};
+    </script>
+    ${getScript('viewer.js', mode)}
+  </head>
+
+  <body>
+    <div id="app"></div>
+    <script>
+      window.chartData = ${escapeJson(chartData)};
+      window.defaultSizes = ${escapeJson(defaultSizes)};
+    </script>
+  </body>
+</html>`;
+}

package/lib/tree/BaseFolder.js

@@ -69,8 +69,7 @@ class BaseFolder extends _Node.default {
 
   walk(walker, state = {}, deep = true) {
     let stopped = false;
-
-    _lodash.default.each(this.children, child => {
+    Object.values(this.children).forEach(child => {
       if (deep && child.walk) {
         state = child.walk(walker, state, stop);
       } else {
@@ -79,7 +78,6 @@ class BaseFolder extends _Node.default {
 
       if (stopped) return false;
     });
-
     return state;
 
     function stop(finalState) {

package/lib/tree/ConcatenatedModule.js

@@ -26,7 +26,7 @@ class ConcatenatedModule extends _Module.default {
   }
 
   fillContentModules() {
-    _lodash.default.each(this.data.modules, moduleData => this.addContentModule(moduleData));
+    this.data.modules.forEach(moduleData => this.addContentModule(moduleData));
   }
 
   addContentModule(moduleData) {
@@ -38,8 +38,7 @@ class ConcatenatedModule extends _Module.default {
 
     const [folders, fileName] = [pathParts.slice(0, -1), _lodash.default.last(pathParts)];
     let currentFolder = this;
-
-    _lodash.default.each(folders, folderName => {
+    folders.forEach(folderName => {
       let childFolder = currentFolder.getChild(folderName);
 
       if (!childFolder) {
@@ -48,7 +47,6 @@ class ConcatenatedModule extends _Module.default {
 
       currentFolder = childFolder;
     });
-
     const module = new _ContentModule.default(fileName, moduleData, this);
     currentFolder.addChildModule(module);
   }

package/lib/tree/Folder.js

@@ -41,8 +41,7 @@ class Folder extends _BaseFolder.default {
 
     const [folders, fileName] = [pathParts.slice(0, -1), _lodash.default.last(pathParts)];
     let currentFolder = this;
-
-    _lodash.default.each(folders, folderName => {
+    folders.forEach(folderName => {
       let childNode = currentFolder.getChild(folderName);
 
       if ( // Folder is not created yet
@@ -56,7 +55,6 @@ class Folder extends _BaseFolder.default {
 
       currentFolder = childNode;
     });
-
     const ModuleConstructor = moduleData.modules ? _ConcatenatedModule.default : _Module.default;
     const module = new ModuleConstructor(fileName, moduleData, this);
     currentFolder.addChildModule(module);

package/lib/utils.js

@@ -1,7 +1,8 @@
 "use strict";
 
 const {
-  inspect
+  inspect,
+  types
 } = require('util');
 
 const _ = require('lodash');
@@ -17,11 +18,11 @@ function createAssetsFilter(excludePatterns) {
       pattern = new RegExp(pattern, 'u');
     }
 
-    if (_.isRegExp(pattern)) {
+    if (types.isRegExp(pattern)) {
       return asset => pattern.test(asset);
     }
 
-    if (!_.isFunction(pattern)) {
+    if (typeof pattern !== 'function') {
       throw new TypeError(`Pattern should be either string, RegExp or a function, but "${inspect(pattern, {
         depth: 0
       })}" got.`);
@@ -31,7 +32,7 @@ function createAssetsFilter(excludePatterns) {
   }).value();
 
   if (excludeFunctions.length) {
-    return asset => _.every(excludeFunctions, fn => fn(asset) !== true);
+    return asset => excludeFunctions.every(fn => fn(asset) !== true);
   } else {
     return () => true;
   }

package/lib/viewer.js

@@ -12,10 +12,6 @@ const _ = require('lodash');
 
 const express = require('express');
 
-const ejs = require('ejs');
-
-const mkdir = require('mkdirp');
-
 const {
   bold
 } = require('chalk');
@@ -28,8 +24,11 @@ const {
   open
 } = require('./utils');
 
+const {
+  renderViewer
+} = require('./template');
+
 const projectRoot = path.resolve(__dirname, '..');
-const assetsRoot = path.join(projectRoot, 'public');
 
 function resolveTitle(reportTitle) {
   if (typeof reportTitle === 'function') {
@@ -64,27 +63,20 @@ async function startServer(bundleStats, opts) {
   };
   let chartData = getChartData(analyzerOpts, bundleStats, bundleDir);
   if (!chartData) return;
-  const app = express(); // Explicitly using our `ejs` dependency to render templates
-  // Fixes #17
-
-  app.engine('ejs', require('ejs').renderFile);
-  app.set('view engine', 'ejs');
-  app.set('views', `${projectRoot}/views`);
+  const app = express();
   app.use(express.static(`${projectRoot}/public`));
-  app.use('/', (req, res) => {
-    res.render('viewer', {
+  app.get('/', (req, res) => {
+    res.writeHead(200, {
+      'Content-Type': 'text/html'
+    });
+    const html = renderViewer({
       mode: 'server',
       title: resolveTitle(reportTitle),
-
-      get chartData() {
-        return chartData;
-      },
-
+      chartData,
       defaultSizes,
-      enableWebSocket: true,
-      // Helpers
-      escapeJson
+      enableWebSocket: true
     });
+    return res.end(html);
   });
   const server = http.createServer(app);
   await new Promise(resolve => {
@@ -144,39 +136,23 @@ async function generateReport(bundleStats, opts) {
     excludeAssets
   }, bundleStats, bundleDir);
   if (!chartData) return;
-  await new Promise((resolve, reject) => {
-    ejs.renderFile(`${projectRoot}/views/viewer.ejs`, {
-      mode: 'static',
-      title: resolveTitle(reportTitle),
-      chartData,
-      defaultSizes,
-      enableWebSocket: false,
-      // Helpers
-      assetContent: getAssetContent,
-      escapeJson
-    }, (err, reportHtml) => {
-      try {
-        if (err) {
-          logger.error(err);
-          reject(err);
-          return;
-        }
-
-        const reportFilepath = path.resolve(bundleDir || process.cwd(), reportFilename);
-        mkdir.sync(path.dirname(reportFilepath));
-        fs.writeFileSync(reportFilepath, reportHtml);
-        logger.info(`${bold('Webpack Bundle Analyzer')} saved report to ${bold(reportFilepath)}`);
-
-        if (openBrowser) {
-          open(`file://${reportFilepath}`, logger);
-        }
-
-        resolve();
-      } catch (e) {
-        reject(e);
-      }
-    });
+  const reportHtml = renderViewer({
+    mode: 'static',
+    title: resolveTitle(reportTitle),
+    chartData,
+    defaultSizes,
+    enableWebSocket: false
+  });
+  const reportFilepath = path.resolve(bundleDir || process.cwd(), reportFilename);
+  fs.mkdirSync(path.dirname(reportFilepath), {
+    recursive: true
   });
+  fs.writeFileSync(reportFilepath, reportHtml);
+  logger.info(`${bold('Webpack Bundle Analyzer')} saved report to ${bold(reportFilepath)}`);
+
+  if (openBrowser) {
+    open(`file://${reportFilepath}`, logger);
+  }
 }
 
 async function generateJSONReport(bundleStats, opts) {
@@ -191,29 +167,13 @@ async function generateJSONReport(bundleStats, opts) {
     excludeAssets
   }, bundleStats, bundleDir);
   if (!chartData) return;
-  mkdir.sync(path.dirname(reportFilename));
-  fs.writeFileSync(reportFilename, JSON.stringify(chartData));
+  await fs.promises.mkdir(path.dirname(reportFilename), {
+    recursive: true
+  });
+  await fs.promises.writeFile(reportFilename, JSON.stringify(chartData));
   logger.info(`${bold('Webpack Bundle Analyzer')} saved JSON report to ${bold(reportFilename)}`);
 }
 
-function getAssetContent(filename) {
-  const assetPath = path.join(assetsRoot, filename);
-
-  if (!assetPath.startsWith(assetsRoot)) {
-    throw new Error(`"${filename}" is outside of the assets root`);
-  }
-
-  return fs.readFileSync(assetPath, 'utf8');
-}
-/**
- * Escapes `<` characters in JSON to safely use it in `<script>` tag.
- */
-
-
-function escapeJson(json) {
-  return JSON.stringify(json).replace(/</gu, '\\u003c');
-}
-
 function getChartData(analyzerOpts, ...args) {
   let chartData;
   const {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webpack-bundle-analyzer",
-  "version": "4.1.0",
+  "version": "4.2.0",
   "description": "Webpack plugin and CLI utility that represents bundle content as convenient interactive zoomable treemap",
   "author": "Yury Grunin <grunin.ya@ya.ru>",
   "license": "MIT",
@@ -30,20 +30,17 @@
   "files": [
     "public",
     "lib",
-    "src",
-    "views"
+    "src"
   ],
   "dependencies": {
     "acorn": "^8.0.4",
     "acorn-walk": "^8.0.0",
     "chalk": "^4.1.0",
     "commander": "^6.2.0",
-    "ejs": "^3.1.5",
     "express": "^4.17.1",
     "filesize": "^6.1.0",
-    "gzip-size": "^5.1.1",
+    "gzip-size": "^6.0.0",
     "lodash": "^4.17.20",
-    "mkdirp": "^1.0.4",
     "opener": "^1.5.2",
     "ws": "^7.3.1"
   },

package/src/BundleAnalyzerPlugin.js

@@ -1,5 +1,5 @@
+const fs = require('fs');
 const path = require('path');
-const mkdir = require('mkdirp');
 const {bold} = require('chalk');
 
 const Logger = require('./Logger');
@@ -80,7 +80,7 @@ class BundleAnalyzerPlugin {
 
   async generateStatsFile(stats) {
     const statsFilepath = path.resolve(this.compiler.outputPath, this.opts.statsFilename);
-    mkdir.sync(path.dirname(statsFilepath));
+    await fs.promises.mkdir(path.dirname(statsFilepath), {recursive: true});
 
     try {
       await writeStats(stats, statsFilepath);

package/src/analyzer.js

@@ -32,7 +32,7 @@ function getViewerData(bundleStats, bundleDir, opts) {
     // Sometimes if there are additional child chunks produced add them as child assets,
     // leave the 1st one as that is considered the 'root' asset.
     for (let i = 1; i < children.length; i++) {
-      bundleStats.children[i].assets.forEach((asset) => {
+      children[i].assets.forEach((asset) => {
         asset.isChild = true;
         bundleStats.assets.push(asset);
       });
@@ -48,7 +48,12 @@ function getViewerData(bundleStats, bundleDir, opts) {
   }
 
   // Picking only `*.js or *.mjs` assets from bundle that has non-empty `chunks` array
-  bundleStats.assets = _.filter(bundleStats.assets, asset => {
+  bundleStats.assets = bundleStats.assets.filter(asset => {
+    // Filter out non 'asset' type asset if type is provided (Webpack 5 add a type to indicate asset types)
+    if (asset.type && asset.type !== 'asset') {
+      return false;
+    }
+
     // Removing query part from filename (yes, somebody uses it for some reason and Webpack supports it)
     // See #22
     asset.name = asset.name.replace(FILENAME_QUERY_REGEXP, '');
@@ -77,7 +82,7 @@ function getViewerData(bundleStats, bundleDir, opts) {
       }
 
       bundlesSources[statAsset.name] = _.pick(bundleInfo, 'src', 'runtimeSrc');
-      _.assign(parsedModules, bundleInfo.modules);
+      Object.assign(parsedModules, bundleInfo.modules);
     }
 
     if (_.isEmpty(bundlesSources)) {
@@ -87,7 +92,7 @@ function getViewerData(bundleStats, bundleDir, opts) {
     }
   }
 
-  const assets = _.transform(bundleStats.assets, (result, statAsset) => {
+  const assets = bundleStats.assets.reduce((result, statAsset) => {
     // If asset is a childAsset, then calculate appropriate bundle modules by looking through stats.children
     const assetBundles = statAsset.isChild ? getChildAssetBundles(bundleStats, statAsset.name) : bundleStats;
     const modules = assetBundles ? getBundleModules(assetBundles) : [];
@@ -139,22 +144,21 @@ function getViewerData(bundleStats, bundleDir, opts) {
 
     asset.modules = assetModules;
     asset.tree = createModulesTree(asset.modules);
+    return result;
   }, {});
 
-  return _.transform(assets, (result, asset, filename) => {
-    result.push({
-      label: filename,
-      isAsset: true,
-      // Not using `asset.size` here provided by Webpack because it can be very confusing when `UglifyJsPlugin` is used.
-      // In this case all module sizes from stats file will represent unminified module sizes, but `asset.size` will
-      // be the size of minified bundle.
-      // Using `asset.size` only if current asset doesn't contain any modules (resulting size equals 0)
-      statSize: asset.tree.size || asset.size,
-      parsedSize: asset.parsedSize,
-      gzipSize: asset.gzipSize,
-      groups: _.invokeMap(asset.tree.children, 'toChartData')
-    });
-  }, []);
+  return Object.entries(assets).map(([filename, asset]) => ({
+    label: filename,
+    isAsset: true,
+    // Not using `asset.size` here provided by Webpack because it can be very confusing when `UglifyJsPlugin` is used.
+    // In this case all module sizes from stats file will represent unminified module sizes, but `asset.size` will
+    // be the size of minified bundle.
+    // Using `asset.size` only if current asset doesn't contain any modules (resulting size equals 0)
+    statSize: asset.tree.size || asset.size,
+    parsedSize: asset.parsedSize,
+    gzipSize: asset.gzipSize,
+    groups: _.invokeMap(asset.tree.children, 'toChartData')
+  }));
 }
 
 function readStatsFromFile(filename) {
@@ -164,7 +168,7 @@ function readStatsFromFile(filename) {
 }
 
 function getChildAssetBundles(bundleStats, assetName) {
-  return _.find(bundleStats.children, (c) =>
+  return (bundleStats.children || []).find((c) =>
     _(c.assetsByChunkName)
       .values()
       .flatten()
@@ -186,8 +190,8 @@ function getBundleModules(bundleStats) {
 
 function assetHasModule(statAsset, statModule) {
   // Checking if this module is the part of asset chunks
-  return _.some(statModule.chunks, moduleChunk =>
-    _.includes(statAsset.chunks, moduleChunk)
+  return statModule.chunks.some(moduleChunk =>
+    statAsset.chunks.includes(moduleChunk)
   );
 }
 
@@ -202,7 +206,7 @@ function isRuntimeModule(statModule) {
 function createModulesTree(modules) {
   const root = new Folder('.');
 
-  _.each(modules, module => root.addModule(module));
+  modules.forEach(module => root.addModule(module));
   root.mergeNestedFolders();
 
   return root;

package/src/bin/analyzer.js

@@ -2,7 +2,6 @@
 
 const {resolve, dirname} = require('path');
 
-const _ = require('lodash');
 const commander = require('commander');
 const {magenta} = require('chalk');
 
@@ -157,7 +156,7 @@ function showHelp(error) {
 }
 
 function br(str) {
-  return `\n${_.repeat(' ', 28)}${str}`;
+  return `\n${' '.repeat(28)}${str}`;
 }
 
 function array() {

package/src/parseUtils.js

@@ -135,7 +135,7 @@ function parseBundle(bundlePath) {
 
         // Walking into arguments because some of plugins (e.g. `DedupePlugin`) or some Webpack
         // features (e.g. `umd` library output) can wrap modules list into additional IIFE.
-        _.each(args, arg => c(arg, state));
+        args.forEach(arg => c(arg, state));
       }
     }
   );
@@ -161,9 +161,8 @@ function parseBundle(bundlePath) {
  * Returns bundle source except modules
  */
 function getBundleRuntime(content, modulesLocations) {
-  const sortedLocations = _(modulesLocations)
-    .values()
-    .sortBy('start');
+  const sortedLocations = Object.values(modulesLocations || {})
+    .sort((a, b) => a.start - b.start);
 
   let result = '';
   let lastIndex = 0;
@@ -214,8 +213,8 @@ function isSimpleModulesList(node) {
 function isModulesHash(node) {
   return (
     node.type === 'ObjectExpression' &&
-    _(node.properties)
-      .map('value')
+    node.properties
+      .map(node => node.value)
       .every(isModuleWrapper)
   );
 }
@@ -223,7 +222,7 @@ function isModulesHash(node) {
 function isModulesArray(node) {
   return (
     node.type === 'ArrayExpression' &&
-    _.every(node.elements, elem =>
+    node.elements.every(elem =>
       // Some of array items may be skipped because there is no module with such id
       !elem ||
       isModuleWrapper(elem)
@@ -276,7 +275,7 @@ function isChunkIds(node) {
   // Array of numeric or string ids. Chunk IDs are strings when NamedChunksPlugin is used
   return (
     node.type === 'ArrayExpression' &&
-    _.every(node.elements, isModuleId)
+    node.elements.every(isModuleId)
   );
 }
 
@@ -321,10 +320,11 @@ function getModulesLocations(node) {
     // Modules hash
     const modulesNodes = node.properties;
 
-    return _.transform(modulesNodes, (result, moduleNode) => {
+    return modulesNodes.reduce((result, moduleNode) => {
       const moduleId = moduleNode.key.name || moduleNode.key.value;
 
       result[moduleId] = getModuleLocation(moduleNode.value);
+      return result;
     }, {});
   }
 
@@ -342,9 +342,11 @@ function getModulesLocations(node) {
       node.arguments[0].elements :
       node.elements;
 
-    return _.transform(modulesNodes, (result, moduleNode, i) => {
-      if (!moduleNode) return;
-      result[i + minId] = getModuleLocation(moduleNode);
+    return modulesNodes.reduce((result, moduleNode, i) => {
+      if (moduleNode) {
+        result[i + minId] = getModuleLocation(moduleNode);
+      }
+      return result;
     }, {});
   }
 

package/{views/viewer.ejs → src/template.js}

@@ -1,22 +1,65 @@
-<!DOCTYPE html>
+/* eslint-disable max-len */
+const path = require('path');
+const fs = require('fs');
+
+const _ = require('lodash');
+
+const projectRoot = path.resolve(__dirname, '..');
+const assetsRoot = path.join(projectRoot, 'public');
+
+exports.renderViewer = renderViewer;
+
+/**
+ * Escapes `<` characters in JSON to safely use it in `<script>` tag.
+ */
+function escapeJson(json) {
+  return JSON.stringify(json).replace(/</gu, '\\u003c');
+}
+
+function getAssetContent(filename) {
+  const assetPath = path.join(assetsRoot, filename);
+
+  if (!assetPath.startsWith(assetsRoot)) {
+    throw new Error(`"${filename}" is outside of the assets root`);
+  }
+
+  return fs.readFileSync(assetPath, 'utf8');
+}
+
+function html(strings, ...values) {
+  return strings.map((string, index) => `${string}${values[index] || ''}`).join('');
+}
+
+function getScript(filename, mode) {
+  if (mode === 'static') {
+    return `<!-- ${_.escape(filename)} -->
+<script>${getAssetContent(filename)}</script>`;
+  } else {
+    return `<script src="${_.escape(filename)}"></script>`;
+  }
+}
+
+function renderViewer({title, enableWebSocket, chartData, defaultSizes, mode} = {}) {
+  return html`<!DOCTYPE html>
 <html>
   <head>
     <meta charset="UTF-8"/>
     <meta name="viewport" content="width=device-width, initial-scale=1"/>
-    <title><%= title %></title>
+    <title>${_.escape(title)}</title>
     <link rel="shortcut icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAABrVBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////+O1foceMD///+J0/qK1Pr7/v8Xdr/9///W8P4UdL7L7P0Scr2r4Pyj3vwad8D5/f/2/f+55f3E6f34+/2H0/ojfMKpzOd0rNgQcb3F3O/j9f7c8v6g3Pz0/P/w+v/q+P7n9v6T1/uQ1vuE0vqLut/y+v+Z2fvt+f+15Pzv9fuc2/vR7v2V2Pvd6/bg9P7I6/285/2y4/yp3/zp8vk8i8kqgMT7/P31+fyv4vxGkcz6/P6/6P3j7vfS5PNnpNUxhcbO7f7F6v3O4vHK3/DA2u631Ouy0eqXweKJud5wqthfoNMMbLvY8f73+v2dxeR8sNtTmdDx9/zX6PSjyeaCtd1YnNGX2PuQveCGt95Nls42h8dLlM3F4vBtAAAAM3RSTlMAAyOx0/sKBvik8opWGBMOAe3l1snDm2E9LSb06eHcu5JpHbarfHZCN9CBb08zzkdNS0kYaptYAAAFV0lEQVRYw92X51/aYBDHHS2O2qqttVbrqNq9m+TJIAYIShBkWwqIiCgoWvfeq7Z2/s29hyQNyUcR7LveGwVyXy6XH8/9rqxglLfUPLxVduUor3h0rfp2TYvpivk37929TkG037hffoX0+peVtZQc1589rigVUdXS/ABSAyEmGIO/1XfvldSK8vs3OqB6u3m0nxmIrvgB0dj7rr7Y9IbuF68hnfFaiHA/sxqm0wciIG43P60qKv9WXWc1RXGh/mFESFABTSBi0sNAKzqet17eCtOb3kZIDwxEEU0oAIJGYxNBDhBND29e0rtXXbcpuPmED9IhEAAQ/AXEaF8EPmnrrKsv0LvWR3fg5sWDNAFZOgAgaKvZDogHNU9MFwnnYROkc56RD5CjAbQX9Ow4g7upCsvYu55aSI/Nj0H1akgKQEUM94dwK65hYRmFU9MIcH/fqJYOZYcnuJSU/waKDgTOEVaVKhwrTRP5XzgSpAITYzom7UvkhFX5VutmxeNnWDjjswTKTyfgluNDGbUpWissXhF3s7mlSml+czWkg3D0l1nNjGNjz3myOQOa1KM/jOS6ebdbAVTCi4gljHSFrviza7tOgRWcS0MOUX9zdNgag5w7rRqA44Lzw0hr1WqES36dFliSJFlh2rXIae3FFcDDgKdxrUIDePr8jGcSClV1u7A9xeN0ModY/pHMxmR1EzRh8TJiwqsHmKW0l4FCEZI+jHio+JdPPE9qwQtTRxku2D8sIeRL2LnxWSllANCQGOIiqVHAz2ye2JR0DcH+HoxDkaADLjgxjKQ+AwCX/g0+DNgdG0ukYCONAe+dbc2IAc6fwt1ARoDSezNHxV2Cmzwv3O6lDMV55edBGwGK9n1+x2F8EDfAGCxug8MhpsMEcTEAWf3rx2vZhe/LAmtIn/6apE6PN0ULKgywD9mmdxbmFl3OvD5AS5fW5zLbv/YHmcsBTjf/afDz3MaZTVCfAP9z6/Bw6ycv8EUBWJIn9zYcoAWWlW9+OzO3vkTy8H+RANLmdrpOuYWdZYEXpo+TlCJrW5EARb7fF+bWdqf3hhyZI1nWJQHgznErZhbjoEsWqi8dQNoE294aldzFurwSABL2XXMf9+H1VQGke9exw5P/AnA5Pv5ngMul7LOvO922iwACu8WkCwLCafvM4CeWPxfA8lNHcWZSoi8EwMAIciKX2Z4SWCMAa3snCZ/G4EA8D6CMLNFsGQhkkz/gQNEBbPCbWsxGUpYVu3z8IyNAknwJkfPMEhLyrdi5RTyUVACkw4GSFRNWJNEW+fgPGwHD8/JxnRuLabN4CGNRkAE23na2+VmEAUmrYymSGjMAYqH84YUIyzgzs3XC7gNgH36Vcc4zKY9o9fgPBXUAiHHwVboBHGLiX6Zcjp1f2wu4tvzZKo0ecPnDtQYDQvJXaBeNzce45Fp28ZQLrEZVuFqgBwOalArKXnW1UzlnSusQKJqKYNuz4tOnI6sZG4zanpemv+7ySU2jbA9h6uhcgpfy6G2PahirDZ6zvq6zDduMVFTKvzw8wgyEdelwY9in3XkEPs3osJuwRQ4qTkfzifndg9Gfc4pdsu82+tTnHZTBa2EAMrqr2t43pguc8tNm7JQVQ2S0ukj2d22dhXYP0/veWtwKrCkNoNimAN5+Xr/oLrxswKbVJjteWrX7eR63o4j9q0GxnaBdWgGA5VStpanIjQmEhV0/nVt5VOFUvix6awJhPcAaTEShgrG+iGyvb5a0Ndb1YGHFPEwoqAinoaykaID1o1pdPNu7XsnCKQ3R+hwWIIhGvORcJUBYXe3Xa3vq/mF/N9V13ugufMkfXn+KHsRD0B8AAAAASUVORK5CYII=" type="image/x-icon" />
 
     <script>
-      window.enableWebSocket = <%- escapeJson(enableWebSocket) %>;
+      window.enableWebSocket = ${escapeJson(enableWebSocket)};
     </script>
-    <%- include('script', { filename: 'viewer.js' }) %>
+    ${getScript('viewer.js', mode)}
   </head>
 
   <body>
     <div id="app"></div>
     <script>
-      window.chartData = <%- escapeJson(chartData) %>;
-      window.defaultSizes = <%- escapeJson(defaultSizes) %>;
+      window.chartData = ${escapeJson(chartData)};
+      window.defaultSizes = ${escapeJson(defaultSizes)};
     </script>
   </body>
-</html>
+</html>`;
+}

package/src/tree/BaseFolder.js

@@ -62,7 +62,7 @@ export default class BaseFolder extends Node {
   walk(walker, state = {}, deep = true) {
     let stopped = false;
 
-    _.each(this.children, child => {
+    Object.values(this.children).forEach(child => {
       if (deep && child.walk) {
         state = child.walk(walker, state, stop);
       } else {

package/src/tree/ConcatenatedModule.js

@@ -15,7 +15,7 @@ export default class ConcatenatedModule extends Module {
   }
 
   fillContentModules() {
-    _.each(this.data.modules, moduleData => this.addContentModule(moduleData));
+    this.data.modules.forEach(moduleData => this.addContentModule(moduleData));
   }
 
   addContentModule(moduleData) {
@@ -28,7 +28,7 @@ export default class ConcatenatedModule extends Module {
     const [folders, fileName] = [pathParts.slice(0, -1), _.last(pathParts)];
     let currentFolder = this;
 
-    _.each(folders, folderName => {
+    folders.forEach(folderName => {
       let childFolder = currentFolder.getChild(folderName);
 
       if (!childFolder) {

package/src/tree/Folder.js

@@ -30,7 +30,7 @@ export default class Folder extends BaseFolder {
     const [folders, fileName] = [pathParts.slice(0, -1), _.last(pathParts)];
     let currentFolder = this;
 
-    _.each(folders, folderName => {
+    folders.forEach(folderName => {
       let childNode = currentFolder.getChild(folderName);
 
       if (

package/src/utils.js

@@ -1,4 +1,4 @@
-const {inspect} = require('util');
+const {inspect, types} = require('util');
 const _ = require('lodash');
 const opener = require('opener');
 
@@ -15,11 +15,11 @@ function createAssetsFilter(excludePatterns) {
         pattern = new RegExp(pattern, 'u');
       }
 
-      if (_.isRegExp(pattern)) {
+      if (types.isRegExp(pattern)) {
         return (asset) => pattern.test(asset);
       }
 
-      if (!_.isFunction(pattern)) {
+      if (typeof pattern !== 'function') {
         throw new TypeError(
           `Pattern should be either string, RegExp or a function, but "${inspect(pattern, {depth: 0})}" got.`
         );
@@ -30,7 +30,7 @@ function createAssetsFilter(excludePatterns) {
     .value();
 
   if (excludeFunctions.length) {
-    return (asset) => _.every(excludeFunctions, fn => fn(asset) !== true);
+    return (asset) => excludeFunctions.every(fn => fn(asset) !== true);
   } else {
     return () => true;
   }

package/src/viewer.js

@@ -5,16 +5,14 @@ const http = require('http');
 const WebSocket = require('ws');
 const _ = require('lodash');
 const express = require('express');
-const ejs = require('ejs');
-const mkdir = require('mkdirp');
 const {bold} = require('chalk');
 
 const Logger = require('./Logger');
 const analyzer = require('./analyzer');
 const {open} = require('./utils');
+const {renderViewer} = require('./template');
 
 const projectRoot = path.resolve(__dirname, '..');
-const assetsRoot = path.join(projectRoot, 'public');
 
 function resolveTitle(reportTitle) {
   if (typeof reportTitle === 'function') {
@@ -51,24 +49,18 @@ async function startServer(bundleStats, opts) {
   if (!chartData) return;
 
   const app = express();
-
-  // Explicitly using our `ejs` dependency to render templates
-  // Fixes #17
-  app.engine('ejs', require('ejs').renderFile);
-  app.set('view engine', 'ejs');
-  app.set('views', `${projectRoot}/views`);
   app.use(express.static(`${projectRoot}/public`));
 
-  app.use('/', (req, res) => {
-    res.render('viewer', {
+  app.get('/', (req, res) => {
+    res.writeHead(200, {'Content-Type': 'text/html'});
+    const html = renderViewer({
       mode: 'server',
       title: resolveTitle(reportTitle),
-      get chartData() { return chartData },
+      chartData,
       defaultSizes,
-      enableWebSocket: true,
-      // Helpers
-      escapeJson
+      enableWebSocket: true
     });
+    return res.end(html);
   });
 
   const server = http.createServer(app);
@@ -140,44 +132,23 @@ async function generateReport(bundleStats, opts) {
 
   if (!chartData) return;
 
-  await new Promise((resolve, reject) => {
-    ejs.renderFile(
-      `${projectRoot}/views/viewer.ejs`,
-      {
-        mode: 'static',
-        title: resolveTitle(reportTitle),
-        chartData,
-        defaultSizes,
-        enableWebSocket: false,
-        // Helpers
-        assetContent: getAssetContent,
-        escapeJson
-      },
-      (err, reportHtml) => {
-        try {
-          if (err) {
-            logger.error(err);
-            reject(err);
-            return;
-          }
-
-          const reportFilepath = path.resolve(bundleDir || process.cwd(), reportFilename);
-
-          mkdir.sync(path.dirname(reportFilepath));
-          fs.writeFileSync(reportFilepath, reportHtml);
-
-          logger.info(`${bold('Webpack Bundle Analyzer')} saved report to ${bold(reportFilepath)}`);
-
-          if (openBrowser) {
-            open(`file://${reportFilepath}`, logger);
-          }
-          resolve();
-        } catch (e) {
-          reject(e);
-        }
-      }
-    );
+  const reportHtml = renderViewer({
+    mode: 'static',
+    title: resolveTitle(reportTitle),
+    chartData,
+    defaultSizes,
+    enableWebSocket: false
   });
+  const reportFilepath = path.resolve(bundleDir || process.cwd(), reportFilename);
+
+  fs.mkdirSync(path.dirname(reportFilepath), {recursive: true});
+  fs.writeFileSync(reportFilepath, reportHtml);
+
+  logger.info(`${bold('Webpack Bundle Analyzer')} saved report to ${bold(reportFilepath)}`);
+
+  if (openBrowser) {
+    open(`file://${reportFilepath}`, logger);
+  }
 }
 
 async function generateJSONReport(bundleStats, opts) {
@@ -187,29 +158,12 @@ async function generateJSONReport(bundleStats, opts) {
 
   if (!chartData) return;
 
-  mkdir.sync(path.dirname(reportFilename));
-  fs.writeFileSync(reportFilename, JSON.stringify(chartData));
+  await fs.promises.mkdir(path.dirname(reportFilename), {recursive: true});
+  await fs.promises.writeFile(reportFilename, JSON.stringify(chartData));
 
   logger.info(`${bold('Webpack Bundle Analyzer')} saved JSON report to ${bold(reportFilename)}`);
 }
 
-function getAssetContent(filename) {
-  const assetPath = path.join(assetsRoot, filename);
-
-  if (!assetPath.startsWith(assetsRoot)) {
-    throw new Error(`"${filename}" is outside of the assets root`);
-  }
-
-  return fs.readFileSync(assetPath, 'utf8');
-}
-
-/**
- * Escapes `<` characters in JSON to safely use it in `<script>` tag.
- */
-function escapeJson(json) {
-  return JSON.stringify(json).replace(/</gu, '\\u003c');
-}
-
 function getChartData(analyzerOpts, ...args) {
   let chartData;
   const {logger} = analyzerOpts;

package/views/script.ejs

@@ -1,8 +0,0 @@
-<% if (mode === 'static') { %>
-  <!-- <%= filename %> -->
-  <script>
-    <%- assetContent(filename) %>
-  </script>
-<% } else { %>
-  <script src="<%= filename %>"></script>
-<% } %>