vite-plugin-mock-dev-server 0.3.19 → 0.3.21

package/README.md

@@ -85,11 +85,11 @@ export default defineConfig({
   }
 })
 ```
-The plugin reads the configuration for `server.proxy` and enables mock matching only for urls where the proxy is set.
+The plugin reads the configuration for `server.proxy` or `options.prefix` and enables mock matching.
 
 The plugin also reads the `define` configuration and supports direct use in mock files.
 
-> In a general case, we only need to mock the url with the proxy so that we can proxy and mock through the http service provided by vite
+> In a general case, we only need to mock the url with the proxy so that we can proxy and mock through the http service provided by vite, but you can also configure the mock using 'options.prefix'
 
 ### Edit Mock File
 
@@ -129,6 +129,16 @@ export default defineConfig({
 
 #### options
 
+- `options.prefix`
+
+  Type: `string | string[]`
+  
+  Configure custom matches rules for the mock server. Any requests that request path starts with that `prefix` will be proxied to that specified target. If the `prefix` starts with ^, it will be interpreted as a RegExp.
+
+  > In general, `server.proxy` is sufficient to meet the requirements, and this options is added to be compatible with some scenarios.
+
+  Default: `[]`
+
 - `option.include` 
   
   Configure to read mock files, which can be a directory, glob, or array
@@ -253,14 +263,14 @@ export default defineMock({
    * configurations and determines which mock configuration
    * is valid according to the validator.
    * 
-   * @type { headers?: object; body?: object; query?: object; params?: object  }
+   * @type { headers?: object; body?: object; query?: object; params?: object; refererQuery?: object  }
    * 
    * If the validator incoming is an object, 
    * then the validation method is the comparison of the 
    * strict request of interface, headers/body/query/params 
    * each `key-value` congruent, congruent check through
    * 
-   * @type ({ headers: object; body: object; query: object; params: object }) => boolean
+   * @type ({ headers: object; body: object; query: object; params: object; refererQuery: object }) => boolean
    * If the validator is passed a function, 
    * it takes the requested interface-related data as an input,
    * gives it to the consumer for custom validation, 
@@ -272,6 +282,12 @@ export default defineMock({
     body: {},
     query: {},
     params: {},
+    /**
+     * refererQuery validates the query in the url of the page from which the request originated, 
+     * which makes it possible to modify parameters directly in the browser address bar to get 
+     * different mock data
+     */
+    refererQuery: {}
   },
   /**
    * 

package/README.zh-CN.md

@@ -86,11 +86,12 @@ export default defineConfig({
   }
 })
 ```
-插件会读取 `server.proxy` 的配置， 仅对设置了代理的 url 匹配，启用mock 匹配。
+插件会读取 `server.proxy` 或 `options.prefix` 的配置，对匹配的 url 启用mock 匹配。
 
 插件也会读取 `define` 配置， 支持在 mock 文件中直接使用。
 
-> 因为一般场景下，我们只需要对有代理的url进行mock，这样才能通过 vite 提供的 http 服务进行 代理和 mock
+> 因为一般场景下，我们只需要对有代理的url进行mock，这样才能通过 vite 提供的 http 服务进行 代理和 mock，
+> 但你也可以使用 `options.prefix`配置 mock 
 
 ### 编写mock文件
 
@@ -130,6 +131,16 @@ export default defineConfig({
 
 #### options
 
+- `options.prefix`
+
+  Type: `string | string[]`
+  
+  为mock服务器配置自定义匹配规则。任何请求路径以 `prefix` 值开头的请求将被代理到对应的目标。如果 `prefix` 值以 ^ 开头，将被识别为 RegExp。
+
+  > 一般情况下, `server.proxy` 已经足够满足需求，添加此项是为了与某些场景兼容。
+
+  Default: `[]`
+
 - `option.include` 
   
   配置读取 mock文件，可以是一个 目录，glob，或者一个数组
@@ -251,13 +262,13 @@ export default defineMock({
    * 验证器可以很好的解决这一类问题，将同个 url 分为多个 mock配置，
    * 根据 验证器来判断哪个mock配置生效。
    * 
-   * @type { headers?: object; body?: object; query?: object; params?: object  }
+   * @type { headers?: object; body?: object; query?: object; params?: object; refererQuery?: object  }
    * 
    * 如果 validator 传入的是一个对象，那么验证方式是严格比较 请求的接口
    * 中，headers/body/query/params 的各个`key`的`value`是否全等，
    * 全等则校验通过
    * 
-   * @type ({ headers: object; body: object; query: object; params: object }) => boolean
+   * @type ({ headers: object; body: object; query: object; params: object; refererQuery: object }) => boolean
    * 如果 validator 传入的是一个函数，那么会讲 请求的接口相关数据作为入参，提供给使用者进行自定义校验，并返回一个 boolean
    * 
    */
@@ -266,6 +277,12 @@ export default defineMock({
     body: {},
     query: {},
     params: {},
+    /**
+     * refererQuery validates the query in the url of the page from which the request originated, 
+     * which makes it possible to modify parameters directly in the browser address bar to get 
+     * different mock data
+     */
+    refererQuery: {}
   },
   /**
    * 

package/dist/index.cjs

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -33,6 +37,10 @@ __export(src_exports, {
 });
 module.exports = __toCommonJS(src_exports);
 
+// node_modules/.pnpm/tsup@6.6.3_typescript@4.9.5/node_modules/tsup/assets/cjs_shims.js
+var getImportMetaUrl = () => typeof document === "undefined" ? new URL("file:" + __filename).href : document.currentScript && document.currentScript.src || new URL("main.js", document.baseURI).href;
+var importMetaUrl = /* @__PURE__ */ getImportMetaUrl();
+
 // src/build.ts
 var import_node_fs2 = __toESM(require("fs"), 1);
 var import_promises2 = __toESM(require("fs/promises"), 1);
@@ -44,7 +52,7 @@ var import_vite = require("vite");
 
 // package.json
 var name = "vite-plugin-mock-dev-server";
-var version = "0.3.19";
+var version = "0.3.21";
 
 // src/esbuildPlugin.ts
 var import_promises = __toESM(require("fs/promises"), 1);
@@ -97,10 +105,17 @@ var isFunction = (val) => typeof val === "function";
 function sleep(timeout) {
   return new Promise((resolve) => setTimeout(resolve, timeout));
 }
-function getDirname(importMetaUrl) {
-  return import_node_path2.default.dirname((0, import_node_url.fileURLToPath)(importMetaUrl));
+function getDirname(importMetaUrl2) {
+  return import_node_path2.default.dirname((0, import_node_url.fileURLToPath)(importMetaUrl2));
 }
 var debug = (0, import_debug.default)("vite:plugin-mock-dev-server");
+var ensureArray = (thing) => {
+  if (isArray(thing))
+    return thing;
+  if (thing === null || thing === void 0)
+    return [];
+  return [thing];
+};
 function lookupFile(dir, formats, options) {
   for (const format of formats) {
     const fullPath = import_node_path2.default.join(dir, format);
@@ -119,8 +134,8 @@ function lookupFile(dir, formats, options) {
 
 // src/build.ts
 async function generateMockServer(ctx, config, options) {
-  const include = isArray(options.include) ? options.include : [options.include];
-  const exclude = isArray(options.exclude) ? options.exclude : [options.exclude];
+  const include = ensureArray(options.include);
+  const exclude = ensureArray(options.exclude);
   const define = {};
   if (config.define) {
     for (const key in config.define) {
@@ -128,6 +143,8 @@ async function generateMockServer(ctx, config, options) {
       define[key] = typeof val === "string" ? val : JSON.stringify(val);
     }
   }
+  const proxies = Object.keys(config.server.proxy || {});
+  const prefix = ensureArray(options.prefix);
   let pkg = {};
   try {
     const pkgStr = lookupFile(config.root, ["package.json"]);
@@ -151,7 +168,7 @@ async function generateMockServer(ctx, config, options) {
     {
       filename: import_node_path3.default.join(outputDir, "index.js"),
       source: generatorServerEntryCode(
-        config.server.proxy || {},
+        [...prefix, ...proxies],
         options.build.serverPort
       )
     },
@@ -211,8 +228,7 @@ function generatePackageJson(pkg, mockDeps) {
   });
   return JSON.stringify(mockPkg, null, 2);
 }
-function generatorServerEntryCode(proxy = {}, port = 8080) {
-  const proxies = Object.keys(proxy || {});
+function generatorServerEntryCode(proxies, port = 8080) {
   return `import connect from 'connect'
 import { baseMiddleware } from 'vite-plugin-mock-dev-server'
 import mockData from './mock-data.js'
@@ -337,7 +353,7 @@ async function parseMultipart(req, options) {
 
 // src/validator.ts
 function validate(request, validator) {
-  return equalObj(request.headers, validator.headers) && equalObj(request.body, validator.body) && equalObj(request.params, validator.params) && equalObj(request.query, validator.query);
+  return equalObj(request.headers, validator.headers) && equalObj(request.body, validator.body) && equalObj(request.params, validator.params) && equalObj(request.query, validator.query) && equalObj(request.refererQuery, validator.refererQuery);
 }
 function equalObj(left, right) {
   if (!right)
@@ -354,6 +370,7 @@ function baseMiddleware(mockLoader, { formidableOptions = {}, proxies }) {
   return async function(req, res, next) {
     const method = req.method.toUpperCase();
     const { query, pathname } = (0, import_node_url2.parse)(req.url, true);
+    const { query: refererQuery } = (0, import_node_url2.parse)(req.headers.referer || "", true);
     if (!pathname || proxies.length === 0 || !proxies.some((context) => doesProxyContextMatchUrl(context, req.url))) {
       return next();
     }
@@ -380,6 +397,7 @@ function baseMiddleware(mockLoader, { formidableOptions = {}, proxies }) {
         const params2 = urlMatch2.params || {};
         const request = {
           query,
+          refererQuery,
           params: params2,
           body: reqBody,
           headers: req.headers
@@ -406,12 +424,14 @@ function baseMiddleware(mockLoader, { formidableOptions = {}, proxies }) {
     const params = urlMatch.params || {};
     req.body = reqBody;
     req.query = query;
+    req.refererQuery = refererQuery;
     req.params = params;
     res.setHeader("Content-Type", "application/json");
     res.setHeader("X-Mock", "generate by vite:mock-dev-server");
     if (currentMock.headers) {
       const headers = isFunction(currentMock.headers) ? await currentMock.headers({
         query,
+        refererQuery,
         body: reqBody,
         params,
         headers: req.headers
@@ -425,6 +445,7 @@ function baseMiddleware(mockLoader, { formidableOptions = {}, proxies }) {
       if (isFunction(currentMock.body)) {
         body = await currentMock.body({
           query,
+          refererQuery,
           body: reqBody,
           params,
           headers: req.headers
@@ -461,8 +482,7 @@ var import_esbuild2 = require("esbuild");
 var import_fast_glob2 = __toESM(require("fast-glob"), 1);
 var import_json52 = __toESM(require("json5"), 1);
 var import_vite2 = require("vite");
-var import_meta = {};
-var _dirname = typeof __dirname !== "undefined" ? __dirname : getDirname(import_meta.url);
+var _dirname = getDirname(importMetaUrl);
 var _require = (0, import_node_module.createRequire)(_dirname);
 var _MockLoader = class extends import_node_events.default {
   constructor(options) {
@@ -531,6 +551,10 @@ var _MockLoader = class extends import_node_events.default {
     });
     this.mockWatcher = watcher;
   }
+  /**
+   * 监听 mock文件依赖的本地文件变动，
+   * mock依赖文件更新，mock文件也一并更新
+   */
   watchDeps() {
     const oldDeps = [];
     this.depsWatcher = import_chokidar.default.watch([], {
@@ -692,8 +716,8 @@ MockLoader.EXT_JSON = /\.json5?$/;
 
 // src/mockMiddleware.ts
 async function mockServerMiddleware(httpServer, config, options) {
-  const include = isArray(options.include) ? options.include : [options.include];
-  const exclude = isArray(options.exclude) ? options.exclude : [options.exclude];
+  const include = ensureArray(options.include);
+  const exclude = ensureArray(options.exclude);
   const define = {};
   if (config.define) {
     for (const key in config.define) {
@@ -709,14 +733,16 @@ async function mockServerMiddleware(httpServer, config, options) {
   await loader.load();
   httpServer == null ? void 0 : httpServer.on("close", () => loader.close());
   const proxies = Object.keys(config.server.proxy || {});
+  const prefix = ensureArray(options.prefix);
   return baseMiddleware(loader, {
     formidableOptions: options.formidableOptions,
-    proxies
+    proxies: [...prefix, ...proxies]
   });
 }
 
 // src/plugin.ts
 function mockDevServerPlugin({
+  prefix = [],
   include = ["mock/**/*.mock.{js,ts,cjs,mjs,json,json5}"],
   exclude = [
     "**/node_modules/**",
@@ -730,6 +756,7 @@ function mockDevServerPlugin({
   build: build3 = false
 } = {}) {
   const pluginOptions = {
+    prefix,
     include,
     exclude,
     formidableOptions: {

package/dist/index.d.ts

@@ -5,6 +5,13 @@ import EventEmitter from 'node:events';
 import chokidar from 'chokidar';
 
 interface MockServerPluginOptions {
+    /**
+     * 为 mock 服务配置 路径匹配规则，任何请求路径以 prefix 开头的都将被拦截代理。
+     * 如果 prefix 以 `^` 开头，将被识别为 `RegExp`。
+     *
+     * @default []
+     */
+    prefix?: string | string[];
     /**
      * glob 字符串匹配 mock 包含的文件
      * @see https://github.com/micromatch/picomatch#globbing-features
@@ -49,6 +56,10 @@ interface ResponseReq {
      * 请求地址中位于 `?` 后面的 queryString，已解析为 json
      */
     query: Record<string, any>;
+    /**
+     * 请求 referer 中位于 `?` 后面的 queryString，已解析为 json
+     */
+    refererQuery: Record<string, any>;
     /**
      * 请求体中 body 数据
      */
@@ -138,7 +149,7 @@ interface MockOptionsItem {
 type MockOptions = MockOptionsItem[];
 type FormidableFile = formidable.File | formidable.File[];
 
-declare function mockDevServerPlugin({ include, exclude, formidableOptions, build, }?: MockServerPluginOptions): Plugin[];
+declare function mockDevServerPlugin({ prefix, include, exclude, formidableOptions, build, }?: MockServerPluginOptions): Plugin[];
 
 /**
  * mock config helper

package/dist/index.js

@@ -9,7 +9,7 @@ import { createFilter } from "vite";
 
 // package.json
 var name = "vite-plugin-mock-dev-server";
-var version = "0.3.19";
+var version = "0.3.21";
 
 // src/esbuildPlugin.ts
 import fsp from "fs/promises";
@@ -66,6 +66,13 @@ function getDirname(importMetaUrl) {
   return path2.dirname(fileURLToPath(importMetaUrl));
 }
 var debug = Debug("vite:plugin-mock-dev-server");
+var ensureArray = (thing) => {
+  if (isArray(thing))
+    return thing;
+  if (thing === null || thing === void 0)
+    return [];
+  return [thing];
+};
 function lookupFile(dir, formats, options) {
   for (const format of formats) {
     const fullPath = path2.join(dir, format);
@@ -84,8 +91,8 @@ function lookupFile(dir, formats, options) {
 
 // src/build.ts
 async function generateMockServer(ctx, config, options) {
-  const include = isArray(options.include) ? options.include : [options.include];
-  const exclude = isArray(options.exclude) ? options.exclude : [options.exclude];
+  const include = ensureArray(options.include);
+  const exclude = ensureArray(options.exclude);
   const define = {};
   if (config.define) {
     for (const key in config.define) {
@@ -93,6 +100,8 @@ async function generateMockServer(ctx, config, options) {
       define[key] = typeof val === "string" ? val : JSON.stringify(val);
     }
   }
+  const proxies = Object.keys(config.server.proxy || {});
+  const prefix = ensureArray(options.prefix);
   let pkg = {};
   try {
     const pkgStr = lookupFile(config.root, ["package.json"]);
@@ -116,7 +125,7 @@ async function generateMockServer(ctx, config, options) {
     {
       filename: path3.join(outputDir, "index.js"),
       source: generatorServerEntryCode(
-        config.server.proxy || {},
+        [...prefix, ...proxies],
         options.build.serverPort
       )
     },
@@ -176,8 +185,7 @@ function generatePackageJson(pkg, mockDeps) {
   });
   return JSON.stringify(mockPkg, null, 2);
 }
-function generatorServerEntryCode(proxy = {}, port = 8080) {
-  const proxies = Object.keys(proxy || {});
+function generatorServerEntryCode(proxies, port = 8080) {
   return `import connect from 'connect'
 import { baseMiddleware } from 'vite-plugin-mock-dev-server'
 import mockData from './mock-data.js'
@@ -302,7 +310,7 @@ async function parseMultipart(req, options) {
 
 // src/validator.ts
 function validate(request, validator) {
-  return equalObj(request.headers, validator.headers) && equalObj(request.body, validator.body) && equalObj(request.params, validator.params) && equalObj(request.query, validator.query);
+  return equalObj(request.headers, validator.headers) && equalObj(request.body, validator.body) && equalObj(request.params, validator.params) && equalObj(request.query, validator.query) && equalObj(request.refererQuery, validator.refererQuery);
 }
 function equalObj(left, right) {
   if (!right)
@@ -319,6 +327,7 @@ function baseMiddleware(mockLoader, { formidableOptions = {}, proxies }) {
   return async function(req, res, next) {
     const method = req.method.toUpperCase();
     const { query, pathname } = urlParse(req.url, true);
+    const { query: refererQuery } = urlParse(req.headers.referer || "", true);
     if (!pathname || proxies.length === 0 || !proxies.some((context) => doesProxyContextMatchUrl(context, req.url))) {
       return next();
     }
@@ -345,6 +354,7 @@ function baseMiddleware(mockLoader, { formidableOptions = {}, proxies }) {
         const params2 = urlMatch2.params || {};
         const request = {
           query,
+          refererQuery,
           params: params2,
           body: reqBody,
           headers: req.headers
@@ -371,12 +381,14 @@ function baseMiddleware(mockLoader, { formidableOptions = {}, proxies }) {
     const params = urlMatch.params || {};
     req.body = reqBody;
     req.query = query;
+    req.refererQuery = refererQuery;
     req.params = params;
     res.setHeader("Content-Type", "application/json");
     res.setHeader("X-Mock", "generate by vite:mock-dev-server");
     if (currentMock.headers) {
       const headers = isFunction(currentMock.headers) ? await currentMock.headers({
         query,
+        refererQuery,
         body: reqBody,
         params,
         headers: req.headers
@@ -390,6 +402,7 @@ function baseMiddleware(mockLoader, { formidableOptions = {}, proxies }) {
       if (isFunction(currentMock.body)) {
         body = await currentMock.body({
           query,
+          refererQuery,
           body: reqBody,
           params,
           headers: req.headers
@@ -426,7 +439,7 @@ import { build as build2 } from "esbuild";
 import fastGlob from "fast-glob";
 import JSON52 from "json5";
 import { createFilter as createFilter2 } from "vite";
-var _dirname = typeof __dirname !== "undefined" ? __dirname : getDirname(import.meta.url);
+var _dirname = getDirname(import.meta.url);
 var _require = createRequire(_dirname);
 var _MockLoader = class extends EventEmitter {
   constructor(options) {
@@ -495,6 +508,10 @@ var _MockLoader = class extends EventEmitter {
     });
     this.mockWatcher = watcher;
   }
+  /**
+   * 监听 mock文件依赖的本地文件变动，
+   * mock依赖文件更新，mock文件也一并更新
+   */
   watchDeps() {
     const oldDeps = [];
     this.depsWatcher = chokidar.watch([], {
@@ -656,8 +673,8 @@ MockLoader.EXT_JSON = /\.json5?$/;
 
 // src/mockMiddleware.ts
 async function mockServerMiddleware(httpServer, config, options) {
-  const include = isArray(options.include) ? options.include : [options.include];
-  const exclude = isArray(options.exclude) ? options.exclude : [options.exclude];
+  const include = ensureArray(options.include);
+  const exclude = ensureArray(options.exclude);
   const define = {};
   if (config.define) {
     for (const key in config.define) {
@@ -673,14 +690,16 @@ async function mockServerMiddleware(httpServer, config, options) {
   await loader.load();
   httpServer == null ? void 0 : httpServer.on("close", () => loader.close());
   const proxies = Object.keys(config.server.proxy || {});
+  const prefix = ensureArray(options.prefix);
   return baseMiddleware(loader, {
     formidableOptions: options.formidableOptions,
-    proxies
+    proxies: [...prefix, ...proxies]
   });
 }
 
 // src/plugin.ts
 function mockDevServerPlugin({
+  prefix = [],
   include = ["mock/**/*.mock.{js,ts,cjs,mjs,json,json5}"],
   exclude = [
     "**/node_modules/**",
@@ -694,6 +713,7 @@ function mockDevServerPlugin({
   build: build3 = false
 } = {}) {
   const pluginOptions = {
+    prefix,
     include,
     exclude,
     formidableOptions: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-mock-dev-server",
-  "version": "0.3.19",
+  "version": "0.3.21",
   "keywords": [
     "vite",
     "plugin",
@@ -33,11 +33,11 @@
     "chokidar": "^3.5.3",
     "co-body": "^6.1.0",
     "debug": "^4.3.4",
-    "esbuild": "^0.16.9",
+    "esbuild": "^0.17.6",
     "fast-glob": "^3.2.12",
     "formidable": "^2.1.1",
     "is-core-module": "^2.11.0",
-    "json5": "^2.2.2",
+    "json5": "^2.2.3",
     "path-to-regexp": "^6.2.1"
   },
   "devDependencies": {
@@ -47,22 +47,22 @@
     "@types/debug": "^4.1.7",
     "@types/formidable": "^2.0.5",
     "@types/is-core-module": "^2.2.0",
-    "@types/node": "^18.11.7",
+    "@types/node": "^18.11.19",
     "bumpp": "^8.2.1",
     "conventional-changelog-cli": "^2.2.2",
-    "eslint": "^8.31.0",
+    "eslint": "^8.33.0",
     "mockjs": "^1.1.0",
-    "prettier": "^2.8.1",
-    "tsup": "^6.5.0",
-    "typescript": "^4.9.4",
-    "vite": "^4.0.2",
-    "vitepress": "1.0.0-alpha.35",
-    "vue": "^3.2.45"
+    "prettier": "^2.8.3",
+    "tsup": "^6.6.3",
+    "typescript": "^4.9.5",
+    "vite": "^4.1.1",
+    "vitepress": "1.0.0-alpha.45",
+    "vue": "^3.2.47"
   },
   "peerDependencies": {
     "vite": ">=3.0.0"
   },
-  "packageManager": "pnpm@7.18.2",
+  "packageManager": "pnpm@7.26.3",
   "engines": {
     "node": "^14.18.0 || >=16"
   },
@@ -70,6 +70,7 @@
     "entry": [
       "src/index.ts"
     ],
+    "shims": true,
     "sourcemap": false,
     "dts": true,
     "splitting": false,