fix: json assertions (#267)

Co-authored-by: Eugene Chybisov <[email protected]>

examples/create-react-app/.babelrc

@@ -0,0 +1,5 @@
+{
+  "plugins": [
+    "@babel/plugin-syntax-import-assertions"
+  ]
+}

examples/create-react-app/README.md

@@ -1,5 +1,17 @@
 # Getting Started with Create React App
 
+> **_NOTE:_** The Create React App tool has been deprecated. 
+> We will attempt to maintain this example for as long as we can but its important
+> to be aware that there are some workarounds to the standard CRA config in order to get 
+> the LI.FI Widget working.
+> 
+> We are using a mix of `react-app-rewired`, `customize-cra` and `@babel/plugin-syntax-import-assertions` 
+> dev dependencies to get the Widget to work in Create React App. Take a look at the scripts in the 
+> package.json, the contents of the config-overrides.js file and the addition of the .babelrc file to understand the 
+> changes that are needed.
+> 
+> If you are currently maintaining a CRA project it might be worth considering migrating to a better supported build tool like [Vite](https://vitejs.dev/).
+
 This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
 
 ## Available Scripts

examples/create-react-app/config-overrides.js

@@ -1,6 +1,9 @@
 const webpack = require('webpack');
+const path = require('path');
 
-module.exports = function override(config) {
+const { override, useBabelRc, addWebpackModuleRule } = require('customize-cra');
+
+function projectOverrides(config) {
   const fallback = config.resolve.fallback || {};
   Object.assign(fallback, {
     buffer: require.resolve('buffer'),
@@ -21,4 +24,13 @@ module.exports = function override(config) {
     },
   });
   return config;
-};
+}
+
+module.exports = override(
+  projectOverrides,
+  useBabelRc(),
+  addWebpackModuleRule({
+    test: /\.js$/,
+    include: [path.resolve(__dirname, 'node_modules', '@lifi', 'widget')],
+  }),
+);

examples/create-react-app/package.json

@@ -42,7 +42,12 @@
     ]
   },
   "devDependencies": {
+    "@babel/core": "^7.24.7",
+    "@babel/plugin-syntax-import-assertions": "^7.24.7",
+    "@types/babel__core": "^7",
+    "@types/customize-cra": "^1",
     "buffer": "^6.0.3",
+    "customize-cra": "^1.0.0",
     "react-app-rewired": "^2.2.1"
   }
 }