feat: replaces axios with fetch; adds terser webpack plugin

packages/b-ber-reader-react/.browserslistrc

@@ -0,0 +1,3 @@
+last 2 versions
+> 2%
+not dead

packages/b-ber-reader-react/package.json

@@ -70,6 +70,7 @@
     "style-loader": "^0.20.2",
     "sugarss": "^1.0.1",
     "tar": "^6.1.11",
+    "terser-webpack-plugin": "^4.2.3",
     "url-loader": "^1.0.1",
     "webpack": "^4.20.2",
     "webpack-bundle-analyzer": "^3.3.2",

packages/b-ber-reader-react/src/components/App.jsx

@@ -36,9 +36,8 @@ class App extends Component {
       // Books with a different full-path specified in the container.xml will of
       // course fail
       try {
-        const resp = await Request.get(manifestURL)
+        const resp = await Request.getJson(manifestURL)
         const { data } = resp
-
         const { href: opfURL } = data.resources.find(
           res => res.type === 'application/oebps-package+xml'
         )

packages/b-ber-reader-react/src/components/Footnote.jsx

@@ -76,7 +76,7 @@ class Footnote extends React.Component {
     const { hash } = new window.URL(this.props.href)
     const id = hash.slice(1)
 
-    const { data } = await Request.get(this.props.href)
+    const { data } = await Request.getText(this.props.href)
     const parser = new window.DOMParser()
     const doc = parser.parseFromString(data, 'text/html')
     const elem = doc.getElementById(id)

packages/b-ber-reader-react/src/components/Reader/loader.js

@@ -16,7 +16,7 @@ export async function createStateFromOPF(callback) {
   let guideItems
   let spineItems
 
-  data = await Request.get(opfURL)
+  data = await Request.getText(opfURL)
   data = await XMLAdaptor.parseOPF(data)
   data = await XMLAdaptor.parseNCX(data, opsURL)
   ;[guideItems, spineItems] = await Promise.all([
@@ -77,7 +77,9 @@ export async function loadSpineItem(spineItem, deferredCallback) {
 
   try {
     const { cache, opsURL } = this.state
-    const { data, request } = await Request.get(requestedSpineItem.absoluteURL)
+    const { data, request } = await Request.getText(
+      requestedSpineItem.absoluteURL
+    )
 
     content = await XMLAdaptor.parseSpineItemResponse({
       data,

packages/b-ber-reader-react/src/helpers/Request.js

@@ -1,14 +1,26 @@
-import axios from 'axios'
 import Url from './Url'
 
 class Request {
-  static get(url) {
-    return axios.get(url)
+  static async get(requestUrl, type) {
+    const resp = await fetch(requestUrl)
+    const { ok, status, url } = resp
+
+    const data = await resp[type]()
+
+    return { data, request: { ok, status, url } }
+  }
+
+  static async getJson(requestUrl) {
+    return Request.get(requestUrl, 'json')
+  }
+
+  static async getText(requestUrl) {
+    return Request.get(requestUrl, 'text')
   }
 
   static getBooks(basePath = '') {
     const url = `${Url.stripTrailingSlash(basePath)}/api/books.json`
-    return Request.get(url)
+    return Request.getJson(url)
   }
 }
 

packages/b-ber-reader-react/src/helpers/XMLAdaptor.js

@@ -11,7 +11,7 @@ import generate from 'css-tree/lib/generator'
 
 import Url from './Url'
 import Request from './Request'
-import Cache from './Cache'
+// import Cache from './Cache'
 import { BookMetadata, SpineItem, GuideItem } from '../models'
 import { processingInstructions, isValidNode } from '../lib/process-nodes'
 import DocumentProcessor from '../lib/DocumentProcessor'
@@ -69,7 +69,7 @@ class XMLAdaptor {
       }
 
       const { href } = item.attributes
-      Request.get(Url.resolveRelativeURL(opsURL, href)).then(({ data }) => {
+      Request.getText(Url.resolveRelativeURL(opsURL, href)).then(({ data }) => {
         resolve({
           ...rootNode,
           __ncx: JSON.parse(xmljs.xml2json(data)),
@@ -300,14 +300,14 @@ class XMLAdaptor {
   }
 
   static async parseSpineItemResponse(response) {
-    const { responseURL } = response.request
+    const { url: responseURL } = response.request
 
     const {
       hash,
       opsURL,
       paddingLeft,
       columnGap,
-      cache: useLocalStorageCache,
+      // cache: useLocalStorageCache,
     } = response
 
     const htmlToReactParser = new HtmlToReactParser()
@@ -360,7 +360,7 @@ class XMLAdaptor {
           //   return
           // }
 
-          Request.get(url).then(rsp => {
+          Request.getText(url).then(rsp => {
             // if (useLocalStorageCache) {
             //   console.log('No CSS cache - setting cache for %s', url)
             //   Cache.set(url, rsp.data)

packages/b-ber-reader-react/webpack/config.production.js

@@ -1,6 +1,7 @@
 /* eslint-disable global-require */
 
 const MiniCssExtractPlugin = require('mini-css-extract-plugin')
+const TerserPlugin = require('terser-webpack-plugin')
 
 const common = require('./common')
 const loaders = require('./loaders')
@@ -35,6 +36,11 @@ module.exports = {
     },
   },
 
+  optimization: {
+    minimize: true,
+    minimizer: [new TerserPlugin()],
+  },
+
   plugins,
 
   module: {

packages/b-ber-reader-react/webpack/loaders.js

@@ -74,10 +74,6 @@ module.exports = [
 
             // https://github.com/webpack/webpack/issues/4039
             modules: 'commonjs',
-
-            targets: {
-              browsers: 'last 2 versions, > 2%',
-            },
           },
         ],
         '@babel/preset-react',