webpack-dev-service 0.10.0 → 0.10.2

package/cjs/client/ui/utils.cjs

@@ -0,0 +1,136 @@
+/**
+ * @package webpack-dev-service
+ * @license MIT
+ * @version 0.10.2
+ * @author nuintun <nuintun@qq.com>
+ * @description A koa 2 middleware for webpack development and hot reloading.
+ * @see https://github.com/nuintun/webpack-dev-service#readme
+ */
+
+'use strict';
+
+const Ansi = require('@nuintun/ansi');
+
+function _interopDefault(e) {
+  return e && e.__esModule ? e : { default: e };
+}
+
+const Ansi__default = /*#__PURE__*/ _interopDefault(Ansi);
+
+/**
+ * @module utils
+ */
+const ansi = new Ansi__default.default();
+function escapeHTML(text) {
+  return text.replace(/[&<>"']/gm, match => {
+    switch (match) {
+      case '&':
+        return '&amp;';
+      case '<':
+        return '&lt;';
+      case '>':
+        return '&gt;';
+      case '"':
+        return '&quot;';
+      case "'":
+        return '&#x27;';
+      default:
+        return match;
+    }
+  });
+}
+function blockToHTML({ style, value, url }) {
+  const styles = [];
+  const textDecorations = [];
+  if (style.dim) {
+    styles.push(`opacity: 0.5`);
+  }
+  if (style.bold) {
+    styles.push(`font-weight: bold`);
+  }
+  if (style.italic) {
+    styles.push(`font-style: italic`);
+  }
+  if (style.inverse) {
+    styles.push(`filter: invert(1)`);
+  }
+  if (style.hidden) {
+    styles.push(`visibility: hidden`);
+  }
+  if (style.blink) {
+    textDecorations.push('blink');
+  }
+  if (style.overline) {
+    textDecorations.push('overline');
+  }
+  if (style.underline) {
+    textDecorations.push('underline');
+  }
+  if (style.strikethrough) {
+    textDecorations.push('line-through');
+  }
+  const { color, background } = style;
+  if (color) {
+    styles.push(`color: rgb(${color})`);
+  }
+  if (background) {
+    styles.push(`background-color: rgb(${background})`);
+  }
+  if (textDecorations.length > 0) {
+    styles.push(`text-decoration: ${textDecorations.join(' ')}`);
+  }
+  const escapedValue = escapeHTML(value);
+  const href = url ? JSON.stringify(new URL(url).toString()) : null;
+  if (styles.length <= 0) {
+    if (!href) {
+      return escapedValue;
+    }
+    return `<a href=${href} target="_blank">${escapedValue}</a>`;
+  }
+  const inlineStyle = JSON.stringify(`${styles.join('; ')};`);
+  if (!href) {
+    return `<span style=${inlineStyle}>${escapedValue}</span>`;
+  }
+  return `<a style=${inlineStyle} href=${href} target="_blank">${escapedValue}</a>`;
+}
+function ansiToHTML(text) {
+  let html = '';
+  ansi.write(text, block => {
+    html += blockToHTML(block);
+  });
+  ansi.flush(block => {
+    html += blockToHTML(block);
+  });
+  return html;
+}
+function getRootElement(tagName) {
+  const stage = document.createElement(tagName);
+  const root = stage.attachShadow({ mode: 'closed' });
+  document.body.appendChild(stage);
+  return root;
+}
+function injectCSS(css, root = document.body, styleElement = document.createElement('style')) {
+  styleElement.appendChild(document.createTextNode(css.trim()));
+  if (!root.contains(styleElement)) {
+    root.appendChild(styleElement);
+  }
+  return styleElement;
+}
+function appendHTML(html, root = document.body) {
+  const nodes = [];
+  const parser = new DOMParser();
+  const fragment = document.createDocumentFragment();
+  const { body } = parser.parseFromString(html.trim(), 'text/html');
+  while (body.firstChild) {
+    nodes.push(fragment.appendChild(body.firstChild));
+  }
+  root.appendChild(fragment);
+  return nodes;
+}
+
+exports.ansiToHTML = ansiToHTML;
+exports.appendHTML = appendHTML;
+exports.blockToHTML = blockToHTML;
+exports.escapeHTML = escapeHTML;
+exports.getRootElement = getRootElement;
+exports.injectCSS = injectCSS;

package/cjs/server/compose.cjs

@@ -0,0 +1,56 @@
+/**
+ * @package webpack-dev-service
+ * @license MIT
+ * @version 0.10.2
+ * @author nuintun <nuintun@qq.com>
+ * @description A koa 2 middleware for webpack development and hot reloading.
+ * @see https://github.com/nuintun/webpack-dev-service#readme
+ */
+
+'use strict';
+
+/**
+ * @module compose
+ */
+/**
+ * @function dispatch
+ * @param middlewares 中间件数组
+ * @param index 要执行的中间件索引
+ * @param stack 调用栈信息
+ * @param context 执行上下文
+ * @param [next] 下一个中间件
+ */
+async function dispatch(middlewares, index, stack, context, next) {
+  if (index <= stack.index) {
+    throw new Error('next() called multiple times');
+  }
+  stack.index = index;
+  const { length } = middlewares;
+  if (index < length) {
+    const middleware = middlewares[index];
+    await middleware(context, () => {
+      return dispatch(middlewares, index + 1, stack, context, next);
+    });
+  } else if (next) {
+    await next();
+  }
+}
+/**
+ * @function compose
+ * @description 生成融合中间件
+ * @param middlewares 中间件数组
+ */
+function compose(...middlewares) {
+  /**
+   * @function middleware
+   * @description 融合中间件
+   * @param context 执行上下文
+   * @param [next] 下一个中间件
+   */
+  return (context, next) => {
+    const stack = { index: -1 };
+    return dispatch(middlewares, 0, stack, context, next);
+  };
+}
+
+exports.compose = compose;

package/cjs/server/dev/Service.cjs

@@ -0,0 +1,269 @@
+/**
+ * @package webpack-dev-service
+ * @license MIT
+ * @version 0.10.2
+ * @author nuintun <nuintun@qq.com>
+ * @description A koa 2 middleware for webpack development and hot reloading.
+ * @see https://github.com/nuintun/webpack-dev-service#readme
+ */
+
+'use strict';
+
+const createEtag = require('etag');
+const destroy = require('destroy');
+const stream = require('stream');
+const utils = require('../utils.cjs');
+const fs = require('./utils/fs.cjs');
+const path$1 = require('path');
+const path = require('./utils/path.cjs');
+const http = require('./utils/http.cjs');
+
+function _interopDefault(e) {
+  return e && e.__esModule ? e : { default: e };
+}
+
+const createEtag__default = /*#__PURE__*/ _interopDefault(createEtag);
+const destroy__default = /*#__PURE__*/ _interopDefault(destroy);
+
+/**
+ * @module Service
+ */
+/**
+ * @class Service
+ */
+class Service {
+  /**
+   * @constructor
+   * @description Create file service.
+   * @param root File service root.
+   * @param options File service options.
+   */
+  constructor(root, options) {
+    this.options = options;
+    this.root = path.unixify(path$1.resolve(root));
+  }
+  /**
+   * @private
+   * @method isIgnore
+   * @description Check if path is ignore.
+   * @param path File path.
+   */
+  isIgnore(path) {
+    const { ignore } = this.options;
+    return (utils.isFunction(ignore) ? ignore(path) : false) === true;
+  }
+  /**
+   * @private
+   * @method setupHeaders
+   * @description Setup headers
+   * @param context Koa context
+   * @param path File path
+   * @param stats File stats
+   */
+  setupHeaders(context, path, stats) {
+    const { options } = this;
+    const { headers, etag } = options;
+    // Set status.
+    context.status = 200;
+    // Set Content-Type.
+    context.type = path$1.extname(path);
+    // Accept-Ranges.
+    if (options.acceptRanges === false) {
+      // Set Accept-Ranges to none tell client not support.
+      context.set('Accept-Ranges', 'none');
+    } else {
+      // Set Accept-Ranges.
+      context.set('Accept-Ranges', 'bytes');
+    }
+    // ETag.
+    if (etag === false) {
+      // Remove ETag.
+      context.remove('ETag');
+    } else {
+      // Set ETag.
+      context.set('ETag', createEtag__default.default(stats));
+    }
+    // Last-Modified.
+    if (options.lastModified === false) {
+      // Remove Last-Modified.
+      context.remove('Last-Modified');
+    } else {
+      // Set mtime utc string.
+      context.set('Last-Modified', stats.mtime.toUTCString());
+    }
+    // Set headers.
+    if (headers) {
+      if (utils.isFunction(headers)) {
+        const fields = headers(path, stats);
+        if (fields) {
+          context.set(fields);
+        }
+      } else {
+        context.set(headers);
+      }
+    }
+  }
+  /**
+   * @private
+   * @method write
+   * @description Write file to stream.
+   * @param stream Destination stream.
+   * @param path The file path to read.
+   * @param range The range to read.
+   * @param end Is destory destination stream after read complete.
+   */
+  write(stream, path, range, end) {
+    const { fs } = this.options;
+    return new Promise(resolve => {
+      // Range prefix and suffix.
+      const { prefix, suffix } = range;
+      // Create file stream reader.
+      const reader = fs.createReadStream(path, range);
+      // File read stream open.
+      if (prefix) {
+        reader.once('open', () => {
+          // Write prefix boundary.
+          stream.write(prefix);
+        });
+      }
+      // File read stream end.
+      if (suffix) {
+        reader.once('end', () => {
+          // Push suffix boundary.
+          stream.write(suffix);
+        });
+      }
+      // File read stream error.
+      reader.once('error', () => {
+        // End stream.
+        stream.end();
+        // Unpipe.
+        reader.unpipe();
+        // Destroy.
+        destroy__default.default(reader);
+        // Resolve.
+        resolve(false);
+      });
+      // File read stream close.
+      reader.once('close', () => {
+        // Unpipe.
+        reader.unpipe();
+        // Destroy.
+        destroy__default.default(reader);
+        // Resolve.
+        resolve(true);
+      });
+      // Write data to buffer.
+      reader.pipe(stream, { end });
+    });
+  }
+  /**
+   * @private
+   * @method send
+   * @description Send file.
+   * @param context Koa context.
+   * @param path File path.
+   * @param ranges Read ranges.
+   */
+  async send(context, path, ranges) {
+    // Set stream body, highWaterMark 64kb.
+    const stream$1 = new stream.PassThrough({
+      highWaterMark: 65536
+    });
+    // Set response body.
+    context.body = stream$1;
+    // Ranges length.
+    let { length } = ranges;
+    // Write ranges to stream.
+    for (const range of ranges) {
+      // Write range.
+      const passed = await this.write(stream$1, path, range, --length === 0);
+      // If not passed, break.
+      if (!passed) {
+        break;
+      }
+    }
+  }
+  /**
+   * @public
+   * @method response
+   * @description Response to koa context.
+   * @param context Koa context.
+   */
+  async response(context) {
+    const { root } = this;
+    // Only support GET and HEAD (405).
+    if (context.method !== 'GET' && context.method !== 'HEAD') {
+      return false;
+    }
+    // Get path of file.
+    const path$2 = path.unixify(path$1.join(root, context.path));
+    // Malicious path (403).
+    if (path.isOutRoot(path$2, root)) {
+      return false;
+    }
+    // Is ignore path or file (403).
+    if (this.isIgnore(path$2)) {
+      return false;
+    }
+    // File stats.
+    const stats = await fs.stat(this.options.fs, path$2);
+    // Check file stats.
+    if (
+      // File not exist (404 | 500).
+      stats == null ||
+      // Is directory (403).
+      stats.isDirectory() ||
+      // Not a directory but has trailing slash (404).
+      path.hasTrailingSlash(path$2)
+    ) {
+      return false;
+    }
+    // Setup headers.
+    this.setupHeaders(context, path$2, stats);
+    // Conditional get support.
+    if (http.isConditionalGET(context)) {
+      // Request precondition failure.
+      if (http.isPreconditionFailure(context)) {
+        return context.throw(412);
+      }
+      // Request fresh (304).
+      if (context.fresh) {
+        // Set status.
+        context.status = 304;
+        // Set body null.
+        context.body = null;
+        // File found.
+        return true;
+      }
+    }
+    // Head request.
+    if (context.method === 'HEAD') {
+      // Set Content-Length.
+      context.length = stats.size;
+      // Set body null
+      context.body = null;
+      // File found.
+      return true;
+    }
+    // Parsed ranges.
+    const ranges = http.parseRanges(context, stats);
+    // 416
+    if (ranges === -1) {
+      // Set Content-Range.
+      context.set('Content-Range', `bytes */${stats.size}`);
+      // Unsatisfiable 416.
+      return context.throw(416);
+    }
+    // 400.
+    if (ranges === -2) {
+      return context.throw(400);
+    }
+    // Send file.
+    this.send(context, path$2, ranges);
+    // File found.
+    return true;
+  }
+}
+
+exports.Service = Service;

package/cjs/server/dev/index.cjs

@@ -0,0 +1,60 @@
+/**
+ * @package webpack-dev-service
+ * @license MIT
+ * @version 0.10.2
+ * @author nuintun <nuintun@qq.com>
+ * @description A koa 2 middleware for webpack development and hot reloading.
+ * @see https://github.com/nuintun/webpack-dev-service#readme
+ */
+
+'use strict';
+
+const ready = require('./utils/ready.cjs');
+const middleware = require('./middleware.cjs');
+const utils = require('../utils.cjs');
+const setupHooks = require('./utils/setupHooks.cjs');
+const setupWatching = require('./utils/setupWatching.cjs');
+const setupWriteToDisk = require('./utils/setupWriteToDisk.cjs');
+const setupOutputFileSystem = require('./utils/setupOutputFileSystem.cjs');
+
+/**
+ * @module index
+ */
+function setup(compiler, options) {
+  const context = {
+    options,
+    compiler,
+    stats: null,
+    callbacks: [],
+    logger: compiler.getInfrastructureLogger(utils.PLUGIN_NAME)
+  };
+  setupHooks.setupHooks(context);
+  if (options.writeToDisk) {
+    setupWriteToDisk.setupWriteToDisk(context);
+  }
+  setupOutputFileSystem.setupOutputFileSystem(context);
+  setupWatching.setupWatching(context);
+  return context;
+}
+function dev(compiler, options) {
+  const context = setup(compiler, options);
+  return Object.assign(middleware.middleware(context), {
+    get state() {
+      return !!context.stats;
+    },
+    get logger() {
+      return context.logger;
+    },
+    ready(callback) {
+      ready.ready(context, callback);
+    },
+    close(callback) {
+      context.watching.close(callback);
+    },
+    invalidate(callback) {
+      context.watching.invalidate(callback);
+    }
+  });
+}
+
+exports.dev = dev;

package/cjs/server/dev/middleware.cjs

@@ -0,0 +1,96 @@
+/**
+ * @package webpack-dev-service
+ * @license MIT
+ * @version 0.10.2
+ * @author nuintun <nuintun@qq.com>
+ * @description A koa 2 middleware for webpack development and hot reloading.
+ * @see https://github.com/nuintun/webpack-dev-service#readme
+ */
+
+'use strict';
+
+const Service = require('./Service.cjs');
+const ready = require('./utils/ready.cjs');
+const http = require('./utils/http.cjs');
+const paths = require('./utils/paths.cjs');
+
+/**
+ * @module middleware
+ */
+function getFileServices(context, stats) {
+  const cached = context.services;
+  // Cache hit.
+  if (cached) {
+    return cached;
+  }
+  const paths$1 = paths.getPaths(stats);
+  const { fs, options } = context;
+  const services = [];
+  const { etag, ignore, headers, acceptRanges, lastModified } = options;
+  // Get the file services.
+  for (const [outputPath, publicPath] of paths$1) {
+    services.push([
+      publicPath,
+      new Service.Service(outputPath, {
+        fs,
+        etag,
+        ignore,
+        headers,
+        acceptRanges,
+        lastModified
+      })
+    ]);
+  }
+  // Cache services.
+  context.services = services;
+  // Return services.
+  return services;
+}
+function getFileServicesAsync(context, path) {
+  return new Promise(resolve => {
+    const { stats } = context;
+    // If stats exists, resolve immediately.
+    if (stats) {
+      resolve(getFileServices(context, stats));
+    } else {
+      // Log waiting info.
+      context.logger.info(`wait until bundle finished: ${path}`);
+      // Otherwise, wait until bundle finished.
+      ready.ready(context, stats => {
+        resolve(getFileServices(context, stats));
+      });
+    }
+  });
+}
+function middleware(context) {
+  // Middleware.
+  return async (ctx, next) => {
+    const path = http.decodeURI(ctx.path);
+    // Path -1 or null byte(s).
+    if (path === -1 || path.includes('\0')) {
+      return ctx.throw(400);
+    }
+    // Is path respond.
+    let respond = false;
+    // Get the file services.
+    const services = await getFileServicesAsync(context, path);
+    // Try to respond.
+    for (const [publicPath, service] of services) {
+      if (path.startsWith(publicPath)) {
+        ctx.path = path.slice(publicPath.length);
+        respond = await service.response(ctx);
+        if (respond) {
+          return;
+        } else {
+          ctx.path = path;
+        }
+      }
+    }
+    // Not respond.
+    if (!respond) {
+      await next();
+    }
+  };
+}
+
+exports.middleware = middleware;

package/cjs/server/dev/utils/fs.cjs

@@ -0,0 +1,29 @@
+/**
+ * @package webpack-dev-service
+ * @license MIT
+ * @version 0.10.2
+ * @author nuintun <nuintun@qq.com>
+ * @description A koa 2 middleware for webpack development and hot reloading.
+ * @see https://github.com/nuintun/webpack-dev-service#readme
+ */
+
+'use strict';
+
+/**
+ * @module fs
+ */
+/**
+ * @function stat
+ * @description Get file stats.
+ * @param fs The file system to used.
+ * @param path The file path.
+ */
+function stat(fs, path) {
+  return new Promise(resolve => {
+    fs.stat(path, (error, stats) => {
+      resolve(error ? null : stats);
+    });
+  });
+}
+
+exports.stat = stat;

package/cjs/server/dev/utils/hash.cjs

@@ -0,0 +1,46 @@
+/**
+ * @package webpack-dev-service
+ * @license MIT
+ * @version 0.10.2
+ * @author nuintun <nuintun@qq.com>
+ * @description A koa 2 middleware for webpack development and hot reloading.
+ * @see https://github.com/nuintun/webpack-dev-service#readme
+ */
+
+'use strict';
+
+const crypto = require('crypto');
+
+/**
+ * @module hash
+ */
+// prettier-ignore
+const CHARS = [
+    // 0-9
+    '0', '1', '2', '3', '4', '5', '6', '7', '8', '9',
+    // A-M
+    'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M',
+    // N-Z
+    'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z',
+    // a-m
+    'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm',
+    // n-z
+    'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'
+];
+/**
+ * @function generate
+ * @description Generate a hash.
+ * @param length The length of hash.
+ */
+function generate(length = 32) {
+  let hash = '';
+  const randomValues = crypto.getRandomValues(new Uint8Array(length));
+  // Create hash.
+  for (const value of randomValues) {
+    hash += CHARS[value % 62];
+  }
+  // Return hash.
+  return hash;
+}
+
+exports.generate = generate;