feat: add helpers and remove vue plugin

sampullman · Sep 23, 2022 · aa71fae · aa71fae
1 parent 0f02688
commit aa71fae
Show file tree

Hide file tree

Showing 23 changed files with 100 additions and 809 deletions.
diff --git a/README.md b/README.md
@@ -26,7 +26,6 @@ yarn add @sampullman/fetch-api
 pnpm i -D @sampullman/fetch-api
 ```
 
-
 ### Configuration
 
 `FetchApi` global configuration is passed to the constructor.
@@ -66,15 +65,17 @@ Here is an example of basic usage that includes a response interceptor for handl
 ```ts
 const api = new FetchApi({
   baseUrl: 'https://cool.api/',
-  responseInterceptors: [async res => {
-    const { status } = res;
-
-    if(status === 403) {
-      throw new Error('FORBIDDEN');
-    }
-    res.data = await res.json();
-    return res;
-  }],
+  responseInterceptors: [
+    async (res) => {
+      const { status } = res;
+
+      if (status === 403) {
+        throw new Error('FORBIDDEN');
+      }
+      res.data = await res.json();
+      return res;
+    },
+  ],
 });
 
 // Make a get request to 'https://cool.api/status/'
@@ -87,7 +88,7 @@ const status = api.request({ url: 'status/' });
 
 ## Example
 
-See the `example` or `vue3-plugin/example` directory.
+See the `example` directory.
 
 ## License
 

diff --git a/example/index.html b/example/index.html
@@ -8,24 +8,23 @@
   <body>
     <script type="module" src="/main.js"></script>
     <h1>Fetch Api Example</h1>
-    <h4>
-      This demo provides a fake API at <span>https://fetching.com/data/</span>
-    </h4>
+    <h4>This demo provides a fake API at <span>https://fetching.com/data/</span></h4>
     <div>Try to GET, POST, PUT, or DELETE some data. Other endpoints will time out.</div>
-    <div>Take a look at vue3-plugin/example for a more interesting demo.</div>
     <div id="inputs">
-      <div>URL: <input type="text" id="url-input" value="https://fetching.com/data/"></div>
-      <div>ID:  <input type="text" id="id-input" placeholder="Not needed for GET/POST"></div>
-      <div>Data: <input type="text" id="data-input"></div>
+      <div>
+        URL: <input type="text" id="url-input" value="https://fetching.com/data/" />
+      </div>
+      <div>
+        ID: <input type="text" id="id-input" placeholder="Not needed for GET/POST" />
+      </div>
+      <div>Data: <input type="text" id="data-input" /></div>
     </div>
     <div id="buttons">
       <button onclick="getData()">GET</button>
       <button onclick="postData()">POST</button>
       <button onclick="putData()">PUT</button>
       <button onclick="deleteData()">DELETE</button>
     </div>
-    <div id="data">
-      API data displayed here: try to GET https://fetching.com/data/
-    </div>
+    <div id="data">API data displayed here: try to GET https://fetching.com/data/</div>
   </body>
 </html>
diff --git a/lib/fetchApi.ts b/lib/fetchApi.ts
@@ -5,14 +5,13 @@ import {
   FetchApiConfig,
   FetchRequestConfig,
 } from './types';
-
 import {
   prepareJson,
   basicAuth,
   encodeParams,
   resolveSearchParams,
   toArray,
-} from './utils';
+} from './util';
 
 export class FetchApi<ResponseType = Response> {
   readonly baseUrl: string;
@@ -22,8 +21,10 @@ export class FetchApi<ResponseType = Response> {
 
   constructor(options: FetchApiOptions<ResponseType>) {
     const { timeout, baseUrl } = options;
-    this.responseInterceptors = toArray(options.responseInterceptors);
-    this.requestInterceptors = toArray(options.requestInterceptors);
+    this.responseInterceptors = toArray<ResponseInterceptor<ResponseType>>(
+      options.responseInterceptors,
+    );
+    this.requestInterceptors = toArray<RequestInterceptor>(options.requestInterceptors);
 
     this.baseUrl = baseUrl || '';
     this.timeout = timeout === undefined ? 10000 : timeout;

diff --git a/lib/index.ts b/lib/index.ts
@@ -1,9 +1,6 @@
-
 import { FetchApi } from './fetchApi';
 
 export * from './types';
-export * from './utils';
+export * from './util';
 
-export {
-  FetchApi,
-};
+export { FetchApi };
diff --git a/lib/utils.ts b/lib/utils.ts
diff --git a/package.json b/package.json
@@ -14,8 +14,6 @@
     "build": "rimraf dist && rollup -c rollup.config.js",
     "example:dev": "npm -C example run dev",
     "example:build": "npm -C example run build",
-    "plugin:dev": "npm -C vue3-fetch-api/example run dev",
-    "plugin:build": "npm -C vue3-fetch-api run build",
     "build:all": "npm run build && npm run plugin:build",
     "build:test": "npm run build && jest",
     "test": "jest",