Better use of Webpack #3471

js/package.json

@@ -138,7 +138,6 @@
     "mobx-react": "^3.5.8",
     "mobx-react-devtools": "^4.2.9",
     "moment": "^2.14.1",
-    "node-fetch": "^1.6.3",
     "qs": "^6.3.0",
     "react": "^15.2.1",
     "react-ace": "^4.0.0",

js/parity.package.json

@@ -27,6 +27,7 @@
   },
   "dependencies": {
     "bignumber.js": "^2.3.0",
-    "js-sha3": "^0.5.2"
+    "js-sha3": "^0.5.2",
+    "node-fetch": "^1.6.3"
   }
 }

js/src/parity.js

@@ -18,17 +18,16 @@ import 'babel-polyfill/dist/polyfill.js';
 import es6Promise from 'es6-promise';
 es6Promise.polyfill();
 
-try {
-  if (typeof self.window !== 'undefined') {
-    self.window.fetch = require('isomorphic-fetch');
-  }
-} catch (e) {}
+const isNode = typeof global !== 'undefined' && typeof global !== 'undefined';
+const isBrowser = typeof self !== 'undefined' && typeof self.window !== 'undefined';
 
-try {
-  if (typeof global !== 'undefined') {
-    global.fetch = require('node-fetch');
-  }
-} catch (e) {}
+if (isBrowser) {
+  require('whatwg-fetch');
+}
+
+if (isNode) {
+  global.fetch = require('node-fetch');
+}
 
 import Api from './api';
 import './dev.parity.html';
@@ -38,7 +37,7 @@ module.exports = { Api };
 // es6 default export compatibility
 module.exports.default = module.exports;
 
-if (typeof self !== 'undefined' && typeof self.window !== 'undefined') {
+if (isBrowser) {
   const api = new Api(new Api.Transport.Http('/rpc/'));
 
   self.window.parity = {

js/webpack.libraries.js

@@ -39,7 +39,14 @@ module.exports = {
     library: '[name].js',
     libraryTarget: 'umd'
   },
+  externals: {
+    'node-fetch': 'node-fetch',
+    'vertx': 'vertx'
+  },
   module: {
+    noParse: [
+      /babel-polyfill/
+    ],
     loaders: [
       {
         test: /\.js$/,