Switch to tsup bundler from bunchee

Author: suhaotian

.gitignore

@@ -3,14 +3,19 @@ node_modules
 lib
 dist
 uploads
+shorts/
 plugins/
-!src/plugins
-!src/tests/plugins
-!tests/src/tests/plugins
 utils/
+doc
+*.tsbuildinfo
+tauri-app
+*.d.*
+*.js
+*.mjs
 !src/utils
 !src/tests/utils
 !tests/src/tests/utils
-doc
-*.tsbuildinfo
-tauri-app
+!src/plugins
+!src/tests/plugins
+!tests/src/tests/plugins
+!scripts

CHANGELOG.md

@@ -4,6 +4,7 @@
 
 - Fix(plugins): For the `errorRetry` plugin, if `enableRetry` is a function returning `undefined` or is `undefined`, it only retries GET requests and skips POST requests; same with other plugins adjustments.
 - Chore: Add https://www.jsdocs.io/package/xior to README's API Reference section
+- Chore(build): switc to `tsup` bundler from `bunchee`, reduce the output size!!
 
 ## v0.7.3
 

README.md

@@ -2203,7 +2203,7 @@ Without the support of these resources, xior wouldn't be possible:
 - [axios](https://github.com/axios/axios)
 - [axios-extensions](https://github.com/kuitos/axios-extensions)
 - [axios-mock-adapter](https://github.com/ctimmerm/axios-mock-adapter)
-- [ts-deepmerge](https://github.com/voodoocreation/ts-deepmerge)
+- ~~[ts-deepmerge](https://github.com/voodoocreation/ts-deepmerge)~~
 - [tiny-lru](https://github.com/avoidwork/tiny-lru)
-- [bunchee](https://github.com/huozhi/bunchee)
+- ~~[bunchee](https://github.com/huozhi/bunchee)~~ [tsup](https://tsup.egoist.dev)
 - [fetch MDN docs](https://developer.mozilla.org/en-US/docs/Web/API/fetch)

cloudflare-example/src/xior.ts

@@ -13,3 +13,5 @@ http.plugins.use(cachePlugin());
 http.plugins.use(uploadDownloadProgressPlugin());
 
 const mock = new MockPlugin(http, { onNoMatch: 'passthrough' });
+
+http.get('https://google.com');

my-react-app/src/App.js

@@ -1,6 +1,20 @@
+import { delay } from 'xior';
+
 import logo from './logo.svg';
+
 import './App.css';
 
+export const a = async () => {
+  await delay(1000);
+  console.log('hello xior.js');
+};
+class B {
+  constructor() {
+    this.a = 123;
+  }
+}
+a();
+console.log('class test', new B(), process.env.NODE_ENV);
 function App() {
   return (
     <div className="App">

package.json

@@ -5,76 +5,122 @@
   "repository": "suhaotian/xior",
   "bugs": "https://github.com/suhaotian/xior/issues",
   "homepage": "https://github.com/suhaotian/xior",
-  "main": "./dist/index.cjs",
-  "types": "./dist/types/index.d.ts",
-  "require": "./dist/index.cjs",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "sideEffects": false,
   "exports": {
+    "./package.json": "./package.json",
     ".": {
-      "types": "./dist/types/index.d.ts",
-      "require": "./dist/index.cjs",
-      "import": "./dist/index.mjs",
-      "module": "./dist/index.esm.js"
+      "import": {
+        "types": "./dist/index.d.mts",
+        "default": "./dist/index.mjs"
+      },
+      "require": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      }
     },
     "./utils": {
-      "types": "./utils/index.d.ts",
-      "require": "./utils/index.cjs",
-      "import": "./utils/index.mjs",
-      "module": "./utils/index.esm.js"
+      "import": {
+        "types": "./utils.mts",
+        "default": "./utils.mjs"
+      },
+      "require": {
+        "types": "./utils.ts",
+        "default": "./utils.js"
+      }
     },
     "./plugins/error-retry": {
-      "types": "./plugins/error-retry/index.d.ts",
-      "require": "./plugins/error-retry/index.cjs",
-      "import": "./plugins/error-retry/index.mjs",
-      "module": "./plugins/error-retry/index.esm.js"
+      "import": {
+        "types": "./plugins/error-retry.mts",
+        "default": "./plugins/error-retry.mjs"
+      },
+      "require": {
+        "types": "./plugins/error-retry.ts",
+        "default": "./plugins/error-retry.js"
+      }
     },
     "./plugins/throttle": {
-      "types": "./plugins/throttle/index.d.ts",
-      "require": "./plugins/throttle/index.cjs",
-      "import": "./plugins/throttle/index.mjs",
-      "module": "./plugins/throttle/index.esm.js"
+      "import": {
+        "types": "./plugins/throttle.mts",
+        "default": "./plugins/throttle.mjs"
+      },
+      "require": {
+        "types": "./plugins/throttle.ts",
+        "default": "./plugins/throttle.js"
+      }
     },
     "./plugins/dedupe": {
-      "types": "./plugins/dedupe/index.d.ts",
-      "require": "./plugins/dedupe/index.cjs",
-      "import": "./plugins/dedupe/index.mjs",
-      "module": "./plugins/dedupe/index.esm.js"
+      "import": {
+        "types": "./plugins/dedupe.mts",
+        "default": "./plugins/dedupe.mjs"
+      },
+      "require": {
+        "types": "./plugins/dedupe.ts",
+        "default": "./plugins/dedupe.js"
+      }
     },
     "./plugins/cache": {
-      "types": "./plugins/cache/index.d.ts",
-      "require": "./plugins/cache/index.cjs",
-      "import": "./plugins/cache/index.mjs",
-      "module": "./plugins/cache/index.esm.js"
+      "import": {
+        "types": "./plugins/cache.mts",
+        "default": "./plugins/cache.mjs"
+      },
+      "require": {
+        "types": "./plugins/cache.ts",
+        "default": "./plugins/cache.js"
+      }
     },
     "./plugins/progress": {
-      "types": "./plugins/progress/index.d.ts",
-      "require": "./plugins/progress/index.cjs",
-      "import": "./plugins/progress/index.mjs",
-      "module": "./plugins/progress/index.esm.js"
+      "import": {
+        "types": "./plugins/progress.mts",
+        "default": "./plugins/progress.mjs"
+      },
+      "require": {
+        "types": "./plugins/progress.ts",
+        "default": "./plugins/progress.js"
+      }
     },
     "./plugins/mock": {
-      "types": "./plugins/mock/index.d.ts",
-      "require": "./plugins/mock/index.cjs",
-      "import": "./plugins/mock/index.mjs",
-      "module": "./plugins/mock/index.esm.js"
+      "import": {
+        "types": "./plugins/mock.mts",
+        "default": "./plugins/mock.mjs"
+      },
+      "require": {
+        "types": "./plugins/mock.ts",
+        "default": "./plugins/mock.js"
+      }
     },
     "./plugins/error-cache": {
-      "types": "./plugins/error-cache/index.d.ts",
-      "require": "./plugins/error-cache/index.cjs",
-      "import": "./plugins/error-cache/index.mjs",
-      "module": "./plugins/error-cache/index.esm.js"
+      "import": {
+        "types": "./plugins/error-cache.mts",
+        "default": "./plugins/error-cache.mjs"
+      },
+      "require": {
+        "types": "./plugins/error-cache.ts",
+        "default": "./plugins/error-cache.js"
+      }
     },
     "./plugins/token-refresh": {
-      "types": "./plugins/token-refresh/index.d.ts",
-      "require": "./plugins/token-refresh/index.cjs",
-      "import": "./plugins/token-refresh/index.mjs",
-      "module": "./plugins/token-refresh/index.esm.js"
+      "import": {
+        "types": "./plugins/token-refresh.mts",
+        "default": "./plugins/token-refresh.mjs"
+      },
+      "require": {
+        "types": "./plugins/token-refresh.ts",
+        "default": "./plugins/token-refresh.js"
+      }
     }
   },
+  "browserslist": [
+    "last 1 version",
+    "> 1%"
+  ],
   "scripts": {
-    "build": "bunchee -m",
+    "build": "tsup",
     "build:lib": "rm -rf lib && tsc --project tsconfig.json",
     "build:umd": "pnpm build:lib && pnpm webpack --config ./scripts/webpack.config.mjs",
-    "test": "bunchee && pnpm --filter=xior-tests test",
+    "test": "tsup && pnpm --filter=xior-tests test",
     "checktype": "tsc --noEmit",
     "start-publish": "pnpm build && pnpm build:umd && node scripts/purge-pkg-for-publish.mjs && npm publish --access public --no-git-checks --provenance --registry=https://registry.npmjs.org",
     "push": "git push && git lfs push --all origin",
@@ -105,14 +151,14 @@
     "@types/multer": "^1.4.11",
     "qs": "^6.14.0",
     "@types/qs": "^6.9.18",
-    "bunchee": "^6.4.0",
     "lfs-auto-track": "^1.1.1",
     "isomorphic-unfetch": "^4.0.2",
     "promise-polyfill": "^8.3.0",
     "webpack": "^5.98.0",
     "webpack-cli": "^6.0.1",
     "change-case": "^5.4.4",
-    "typedoc": "^0.27.9"
+    "typedoc": "^0.27.9",
+    "tsup": "^8.4.0"
   },
   "prettier": {
     "printWidth": 100,
@@ -142,7 +188,12 @@
   "files": [
     "dist",
     "plugins",
-    "utils",
+    "./*.js",
+    "./*.mjs",
+    "./*.d.*",
+    "./xior*",
+    "./chunk*",
+    "README.md",
     "Mock-plugin.md"
   ],
   "keywords": [

pnpm-lock.yaml

@@ -20,7 +20,7 @@ function getConfig() {
     },
   };
   Object.keys(exports).forEach((key) => {
-    if (key === '.') return;
+    if (key === '.' || key === './package.json') return;
     const filename = fs.existsSync(path.join('lib', key + '.js'))
       ? key + '.js'
       : path.join(key, 'index.js');

scripts/webpack.config.mjs

@@ -1,5 +1,7 @@
 /** Code Ref: https://github.com/jacobheun/any-signal/pull/40/files */
 
+import { abort, addEventListener } from './shorts';
+
 export interface ClearableSignal extends AbortSignal {
   clear: () => void;
 }
@@ -26,14 +28,14 @@ export function anySignal(
       break;
     }
 
-    if (signal?.addEventListener != null) {
+    if (signal?.[addEventListener]) {
       const cb = () => {
         onAbort(signal.reason);
       };
       unsubscribe.push(() => {
-        signal.removeEventListener?.('abort', cb);
+        signal.removeEventListener?.(abort, cb);
       });
-      signal.addEventListener('abort', cb);
+      signal[addEventListener](abort, cb);
     }
   }
 

src/any-signals.ts

@@ -1,10 +1,9 @@
-import { O } from './shorts';
 import { Xior } from './xior';
 
 export * from './xior';
 export * from './types';
 export * from './utils';
 
 const { create, VERSION } = Xior;
-const xior = O.assign(create(), { create, VERSION });
+const xior = Object.assign(create(), { create, VERSION });
 export default xior;

src/index.ts

@@ -1,16 +1,16 @@
-import { keys, o, f, O } from './shorts';
+import { keys, o, f, O, json, GET, HEAD, OPTIONS, undefinedValue } from './shorts';
 import type { XiorInterceptorRequestConfig } from './types';
 import { trimUndefined, encodeParams, merge } from './utils';
 
 const appPrefix = 'application/';
 const formUrl = `${appPrefix}x-www-form-urlencoded`;
-const jsonType = `${appPrefix}json`;
+const jsonType = `${appPrefix}${json}`;
 
-export function likeGET(method = 'GET') {
-  return ['HEAD', 'GET', 'OPTIONS'].includes(method);
+export function likeGET(method = GET) {
+  return [HEAD, GET, OPTIONS].includes(method);
 }
 
-const supportURLSearchParams = typeof URLSearchParams !== 'undefined';
+const supportURLSearchParams = typeof URLSearchParams !== `${undefinedValue}`;
 
 export default async function defaultRequestInterceptor(req: XiorInterceptorRequestConfig) {
   const ps = req.paramsSerializer || encodeParams;

src/interceptors.ts

@@ -1,6 +1,6 @@
 /** From @voodoocreation/ts-deepmerge: https://github.com/voodoocreation/ts-deepmerge/blob/master/src/index.ts */
 
-import { isArray, keys, O, op, o, f } from './shorts';
+import { isArray, keys, O, op, o, f, p } from './shorts';
 
 type TAllKeys<T> = T extends any ? keyof T : never;
 
@@ -52,7 +52,7 @@ export const merge = <T extends IObject[]>(...objects: T): TMerged<T[number]> =>
     }
 
     keys(current).forEach((key) => {
-      if (['__proto__', 'constructor', 'prototype'].includes(key)) {
+      if (['__proto__', 'constructor', p].includes(key)) {
         return;
       }
 

src/merge.ts

@@ -1,8 +1,8 @@
 import { lru } from 'tiny-lru';
 
-import { ICacheLike } from './utils';
-import type { XiorPlugin, XiorRequestConfig, XiorResponse } from '../../types';
-import { buildSortedURL, isAbsoluteURL, joinPath } from '../../utils';
+import { ICacheLike } from './cache/utils';
+import type { XiorPlugin, XiorRequestConfig, XiorResponse } from '../types';
+import { buildSortedURL, isAbsoluteURL, joinPath } from '../utils';
 
 type XiorPromise = Promise<XiorResponse>;
 

src/plugins/cache/index.ts src/plugins/cache.ts

@@ -1,11 +1,11 @@
-import { MockHeaders, StatusOrCallback, RequestOptions, RequestData, VERBS } from './types';
-import { keys } from '../../shorts';
+import { MockHeaders, StatusOrCallback, RequestOptions, RequestData, VERBS } from './mock/types';
+import { keys } from '../shorts';
 import type {
   XiorInterceptorRequestConfig,
   XiorPlugin,
   XiorRequestConfig,
   XiorResponse,
-} from '../../types';
+} from '../types';
 import {
   ClearableSignal,
   XiorError,
@@ -16,8 +16,8 @@ import {
   encodeParams,
   joinPath,
   merge,
-} from '../../utils';
-import { XiorInstance } from '../../xior';
+} from '../utils';
+import { XiorInstance } from '../xior';
 
 export interface MockOptions {
   delayResponse?: number;

src/plugins/mock/index.ts src/plugins/mock.ts

@@ -1,6 +1,20 @@
-export const O = Object;
-export const op = O.prototype;
 export const o = 'object';
 export const f = 'function';
+export const p = 'prototype';
+export const text = 'text';
+export const json = 'json';
+export const abort = 'abort';
+export const addEventListener = 'addEventListener';
+export const O = Object;
+export const undefinedValue = undefined;
+export const op = O[p];
 export const keys = O.keys;
 export const isArray = Array.isArray;
+
+export const HEAD = 'HEAD';
+export const GET = 'GET';
+export const OPTIONS = 'OPTIONS';
+export const POST = 'POST';
+export const PUT = 'PUT';
+export const PATCH = 'PATCH';
+export const DELETE = 'DELETE';

src/shorts.ts

@@ -1,10 +1,9 @@
-import { isArray, keys, o, op } from './shorts';
+import { isArray, keys, o, op, undefinedValue } from './shorts';
 import type { XiorRequestConfig, XiorResponse } from './types';
 export * from './any-signals';
 export * from './merge';
 export * from './plugins/utils';
 
-const undefinedValue = undefined;
 export function encodeParams<T = any>(
   params: T,
   encodeURI = true,

src/utils.ts

@@ -1,4 +1,5 @@
 import defaultRequestInterceptor from './interceptors';
+import { DELETE, GET, HEAD, json, OPTIONS, PATCH, POST, PUT, text, undefinedValue } from './shorts';
 import type {
   XiorInterceptorOptions,
   XiorInterceptorRequestConfig,
@@ -18,7 +19,6 @@ import {
   encodeParams,
 } from './utils';
 
-const undefinedValue = undefined;
 const supportAbortController = typeof AbortController !== `${undefinedValue}`;
 export type XiorInstance = Xior;
 export type Fetch = typeof fetch;
@@ -28,9 +28,9 @@ async function getResponseData(
   responseType?: 'json' | 'text' | 'blob' | 'arraybuffer' | 'stream' | 'document' | 'original'
 ) {
   let data: any;
-  if (!responseType || !response.ok || ['text', 'json'].includes(responseType)) {
-    data = await response.text();
-    if (data && responseType !== 'text') {
+  if (!responseType || !response.ok || [text, json].includes(responseType)) {
+    data = await response[text]();
+    if (data && responseType !== text) {
       try {
         data = JSON.parse(data);
         // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -276,7 +276,7 @@ export class Xior {
       data?: any;
     }
   ) {
-    return this.cG<T>('GET')(url, options);
+    return this.cG<T>(GET)(url, options);
   }
   head<T = any>(
     url: string,
@@ -285,23 +285,23 @@ export class Xior {
       data?: any;
     }
   ) {
-    return this.cG<T>('HEAD')(url, options);
+    return this.cG<T>(HEAD)(url, options);
   }
 
   post<T = any>(url: string, data?: any, options?: XiorRequestConfig) {
-    return this.cP<T>('POST')(url, data, options);
+    return this.cP<T>(POST)(url, data, options);
   }
 
   put<T = any>(url: string, data?: any, options?: XiorRequestConfig) {
-    return this.cP<T>('PUT')(url, data, options);
+    return this.cP<T>(PUT)(url, data, options);
   }
 
   patch<T = any>(url: string, data?: any, options?: XiorRequestConfig) {
-    return this.cP<T>('PATCH')(url, data, options);
+    return this.cP<T>(PATCH)(url, data, options);
   }
 
   delete<T = any>(url: string, options?: XiorRequestConfig) {
-    return this.cG<T>('DELETE')(url, options);
+    return this.cG<T>(DELETE)(url, options);
   }
 
   options<T = any>(
@@ -311,6 +311,6 @@ export class Xior {
       data?: any;
     }
   ) {
-    return this.cG<T>('OPTIONS')(url, options);
+    return this.cG<T>(OPTIONS)(url, options);
   }
 }

src/xior.ts

@@ -0,0 +1,22 @@
+import { defineConfig } from 'tsup';
+
+export default defineConfig({
+  entry: {
+    'dist/index': 'src/index.ts',
+    utils: 'src/utils.ts',
+    'plugins/error-retry': 'src/plugins/error-retry.ts',
+    'plugins/throttle': 'src/plugins/throttle.ts',
+    'plugins/dedupe': 'src/plugins/dedupe.ts',
+    'plugins/cache': 'src/plugins/cache.ts',
+    'plugins/progress': 'src/plugins/progress.ts',
+    'plugins/mock': 'src/plugins/mock.ts',
+    'plugins/error-cache': 'src/plugins/error-cache.ts',
+    'plugins/token-refresh': 'src/plugins/token-refresh.ts',
+  },
+  outDir: './',
+  splitting: true,
+  format: ['esm', 'cjs'],
+  minify: true,
+  target: 'esnext',
+  dts: true,
+});

tsup.config.ts

@@ -1,3 +1,4 @@
 module.exports = {
   presets: ['@vue/cli-plugin-babel/preset'],
+  plugins: ['@babel/plugin-transform-class-static-block']
 };

vue-cli-app/babel.config.js

@@ -15,6 +15,7 @@
   "devDependencies": {
     "@babel/core": "^7.12.16",
     "@babel/eslint-parser": "^7.12.16",
+    "@babel/plugin-transform-class-static-block": "^7.26.0",
     "@vue/cli-plugin-babel": "~5.0.0",
     "@vue/cli-plugin-eslint": "~5.0.0",
     "@vue/cli-service": "~5.0.0",
@@ -38,7 +39,6 @@
   },
   "browserslist": [
     "> 1%",
-    "last 2 versions",
-    "not dead"
+    "last 2 versions"
   ]
 }

vue-cli-app/package.json

@@ -1,6 +1,7 @@
 import Vue from 'vue';
 import App from './App.vue';
 import { instance } from './xior';
+import { delay } from 'xior';
 
 instance.get('/');
 
@@ -9,3 +10,17 @@ Vue.config.productionTip = false;
 new Vue({
   render: (h) => h(App),
 }).$mount('#app');
+
+
+
+export const a = async () => {
+  await delay(1000);
+  console.log('hello xior.js');
+};
+class B {
+  constructor() {
+    this.a = 123;
+  }
+}
+a();
+console.log('class test', new B(), process.env.NODE_ENV);