diff --git a/packages/apps/webpack.base.cjs b/packages/apps/webpack.base.cjs
index a2e55991ac..6918fa7b05 100644
--- a/packages/apps/webpack.base.cjs
+++ b/packages/apps/webpack.base.cjs
@@ -173,6 +173,7 @@ function createWebpack (context, mode = 'production') {
       fallback: {
         assert: require.resolve('assert/'),
         crypto: require.resolve('crypto-browserify'),
+        fs: false,
         http: require.resolve('stream-http'),
         https: require.resolve('https-browserify'),
         os: require.resolve('os-browserify/browser'),
diff --git a/packages/react-api/package.json b/packages/react-api/package.json
index 33ca3bbb7e..0ebace0db6 100644
--- a/packages/react-api/package.json
+++ b/packages/react-api/package.json
@@ -12,6 +12,10 @@
   "sideEffects": true,
   "type": "module",
   "version": "0.121.2-16-x",
+  "browser": {
+    "fs": false,
+    "path": false
+  },
   "dependencies": {
     "@babel/runtime": "^7.18.9",
     "@polkadot/api": "^9.2.3",
diff --git a/packages/react-api/src/light.spec.ts b/packages/react-api/src/light.spec.ts
new file mode 100644
index 0000000000..988afdffc4
--- /dev/null
+++ b/packages/react-api/src/light.spec.ts
@@ -0,0 +1,22 @@
+// Copyright 2017-2022 @polkadot/react-api authors & contributors
+// SPDX-License-Identifier: Apache-2.0
+
+import fs from 'fs';
+import path from 'path';
+
+import { assert } from '@polkadot/util';
+
+import { lightSpecs } from './light';
+
+describe('lightSpecs', (): void => {
+  describe.each(Object.keys(lightSpecs))('%s', (r): void => {
+    it.each(Object.keys(lightSpecs[r]))('%s', (s): void => {
+      assert(
+        fs.existsSync(
+          path.join(__dirname, lightSpecs[r][s])
+        ),
+        `packages/react-api/src/${lightSpecs[r][s].slice(2)} does not exist`
+      );
+    });
+  });
+});
diff --git a/packages/react-api/src/light/index.ts b/packages/react-api/src/light/index.ts
index 08b0d2db50..f7aab52c95 100644
--- a/packages/react-api/src/light/index.ts
+++ b/packages/react-api/src/light/index.ts
@@ -7,15 +7,13 @@ import { specs as kusama } from './kusama';
 
 export const lightSpecs: Record<string, Record<string, string>> =
   Object
-    .entries<Record<string, string>>({ kusama })
+    .entries({ kusama })
     .reduce((all: Record<string, Record<string, string>>, [r, v]) => {
-      all[r] = Object
-        .entries<string>(v)
-        .reduce((specs: Record<string, string>, [k, v]) => {
-          specs[k] = `./light/${r}/${v}`;
+      all[r] = v.reduce((specs: Record<string, string>, k) => {
+        specs[k] = `./light/${r}/${k}.json`;
 
-          return specs;
-        }, {});
+        return specs;
+      }, {});
 
       return all;
     }, {});
diff --git a/packages/react-api/src/light/kusama/index.ts b/packages/react-api/src/light/kusama/index.ts
index 1ee3545916..0015f7d589 100644
--- a/packages/react-api/src/light/kusama/index.ts
+++ b/packages/react-api/src/light/kusama/index.ts
@@ -4,7 +4,7 @@
 // Add your imported spec here in alphabetical order.
 // The key here reflects the URL of the light client endpoint.
 // e.g. light://substrate-connect/kusama/gm
-export const specs: Record<string, string> = {
-  gm: 'gm.json',
-  tinkernet: 'tinkernet.json'
-};
+export const specs: string[] = [
+  'gm',
+  'tinkernet'
+];