feat: added many build options

README.md

@@ -107,6 +107,8 @@ const resp2 = await api.get('https://api.example.com/');
 - [Support list](#support-list)
 - [Getting Started](#getting-started)
 - [Compiled code](#compiled-code)
+  - [NodeJS](#nodejs)
+  - [Browsers](#browsers)
 - [Typescript users](#typescript-users)
 - [Basic Knowledge](#basic-knowledge)
   - [Request id](#request-id)
@@ -171,14 +173,28 @@ import { setupCache } from 'axios-cache-interceptor';
 ```html
 <!-- Replace latest with the desired version -->
 
+<!-- Development (ES2020) (~30KB) -->
+<script
+  crossorigin
+  src="https://cdn.jsdelivr.net/npm/axios-cache-interceptor@latest/dist/index.development.js"
+></script>
+
+<!-- Production for ES6+ (~12KB) -->
 <script
   crossorigin
   src="https://cdn.jsdelivr.net/npm/axios-cache-interceptor@latest/dist/index.min.js"
 ></script>
-<!-- or -->
+
+<!-- Production for ES5+ (~22KB) -->
 <script
   crossorigin
-  src="https://unpkg.com/axios-cache-interceptor@latest/dist/index.min.js"
+  src="https://cdn.jsdelivr.net/npm/axios-cache-interceptor@latest/dist/index.es5.min.js"
+></script>
+
+<!-- Production for ES2020+ (~9KB) -->
+<script
+  crossorigin
+  src="https://cdn.jsdelivr.net/npm/axios-cache-interceptor@latest/dist/index.es2020.min.js"
 ></script>
 ```
 
@@ -247,16 +263,44 @@ here: [Per-request configuration](#per-request-configuration).
 
 ## Compiled code
 
-As axios itself requires [ES6 Promises](https://axios-http.com/docs/notes#promises), the
-CommonsJS module and the UMD module are also `>= ES6` compatibles.
+### NodeJS
+
+The code is compiled with `tsc` with support to `>= ES6`. See the
+[build config](/tsconfig.build.json).
+
+- `axios-cache-interceptor`: Redirects to `/dist/index.js`
+- `axios-cache-interceptor/dist/index.js`: The main library file.
+- `axios-cache-interceptor/dist/index.d.ts`: The Typescript definition file.
 
-You can see more here about compiling options:
+Every browser build is also compatible with CommonsJS because it builds with UMD, so you
+can use them too.
 
-- `UMD` -> [Browser config](/tsconfig.browser.json) & [Webpack config](/webpack.config.js)
-- `CommonsJS` -> [NodeJS Config](/tsconfig.build.json)
+### Browsers
 
-Don't forget, you can always rebuilt this library by up from it's source code or recompile
-the dist with lower ecma script versions.
+> _NOTE_: Axios itself requires [ES6 Promises](https://axios-http.com/docs/notes#promises)
+
+The UMD code is compiled with `webpack` with support to `>= ES5`. See the
+[build config](/webpack.config.js). You can import these files anywhere (Browser,
+CommonsJS and more)
+
+- `axios-cache-interceptor/dist/index.min.js`: Production file for ES6+
+- `axios-cache-interceptor/dist/index.es5.min.js`: Production file for ES5+
+- `axios-cache-interceptor/dist/index.development.js`: Development file
+
+```html
+<!-- You can use the cdn of your choice -->
+
+<!-- UNPKG -->
+<script crossorigin src="https://unpkg.com/axios-cache-interceptor@latest"></script>
+
+<!-- JSDELIVR -->
+<script
+  crossorigin
+  src="https://cdn.jsdelivr.net/npm/axios-cache-interceptor@latest"
+></script>
+
+<!-- Etc... -->
+```
 
 <br />
 

src/index.development.ts

@@ -0,0 +1,10 @@
+/** Index file for webpack and cdn usage */
+
+export { createCache, setupCache, useCache } from './cache/create';
+export { BrowserAxiosStorage } from './storage/browser';
+export { MemoryAxiosStorage } from './storage/memory';
+export { AxiosStorage } from './storage/storage';
+
+console.warn(
+  'You are using a development build. Make sure to use the correct build in production\nhttps://github.com/arthurfiorette/axios-cache-interceptor#installing'
+);

tsconfig.browser.json

@@ -7,5 +7,5 @@
     "declarationMap": false,
     "module": "ESNext"
   },
-  "include": ["src/index.browser.ts"]
+  "include": ["src/index.*.ts"]
 }

tsconfig.build.json

@@ -5,5 +5,5 @@
     "target": "ES6"
   },
   "include": ["src"],
-  "exclude": ["src/index.browser.ts"]
+  "exclude": ["src/index.*.ts"]
 }

tsconfig.json

@@ -48,7 +48,7 @@
     // "sourceMap": true                                    /* Create source map files for emitted JavaScript files. */,
     // "outFile": "./",                                  /* Specify a file that bundles all outputs into one JavaScript file. If `declaration` is true, also designates a file that bundles all .d.ts output. */
     "outDir": "./dist"                                   /* Specify an output folder for all emitted files. */,
-    "removeComments": true,                           /* Disable emitting comments. */
+    // "removeComments": true,                           /* Disable emitting comments. */
     "noEmit": true,                                   /* Disable emitting files from a compilation. */
     // "importHelpers": true,                               /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
     "importsNotUsedAsValues": "error"                    /* Specify emit/checking behavior for imports that are only used for types */,

webpack.config.js

@@ -4,16 +4,24 @@
 const path = require('path');
 const TerserWebpackPlugin = require('terser-webpack-plugin');
 
-/** @type {import('webpack').Configuration} */
-const config = {
+/**
+ * @param {{
+ *   output: string;
+ *   entry: string;
+ *   esTarget: string;
+ *   minimize: boolean;
+ * }} options
+ * @returns {import('webpack').Configuration}
+ */
+const config = ({ output, esTarget, minimize, entry }) => ({
   mode: 'production',
 
-  entry: path.resolve(__dirname, 'src', 'index.browser.ts'),
+  entry: path.resolve(__dirname, 'src', entry),
 
   output: {
     path: path.resolve(__dirname, 'dist'),
     globalObject: `typeof self == 'undefined' ? this : self`,
-    filename: 'index.min.js',
+    filename: output,
     library: {
       type: 'umd',
       name: 'AxiosCacheInterceptor'
@@ -33,16 +41,44 @@ const config = {
         test: /\.(ts|js)$/,
         loader: 'ts-loader',
         options: {
-          configFile: 'tsconfig.browser.json'
+          configFile: path.resolve(__dirname, 'tsconfig.browser.json'),
+          compilerOptions: {
+            target: esTarget
+          }
         }
       }
     ]
   },
 
   optimization: {
-    minimize: true,
+    minimize,
     minimizer: [new TerserWebpackPlugin({ parallel: true })]
   }
-};
+});
 
-module.exports = config;
+module.exports = [
+  config({
+    esTarget: 'es2020',
+    entry: 'index.development.ts',
+    output: 'index.development.js',
+    minimize: false
+  }),
+  config({
+    esTarget: 'es2015',
+    entry: 'index.browser.ts',
+    output: 'index.min.js',
+    minimize: true
+  }),
+  config({
+    esTarget: 'es5',
+    entry: 'index.browser.ts',
+    output: 'index.es5.min.js',
+    minimize: true
+  }),
+  config({
+    esTarget: 'es2020',
+    entry: 'index.browser.ts',
+    output: 'index.es2020.min.js',
+    minimize: true
+  })
+];