feat: migrate CRA to pure webpack example

.eslintignore

@@ -3,4 +3,4 @@
 **/*type.validator.ts
 **/umd
 **/esm
-**/docs
+**/docs

.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": ["@rarible/eslint-config-ts", "plugin:prettier/recommended"]
+}

.gitignore

@@ -22,4 +22,6 @@ storybook-static
 yarn-error.log
 lerna-debug.log
 .env
+.env.*
 .yarnrc
+.parcel-cache

package.json

@@ -50,7 +50,7 @@
     "build-ethereum": "sh ./scripts/build-ethereum.sh",
     "build-imx": "sh ./scripts/build-imx.sh",
     "build-solana": "sh ./scripts/build-solana.sh",
-    "build-example": "yarn build && cd packages/example && yarn build",
+    "build-example": "yarn build && yarn workspace example run build",
     "build-all": "sh ./scripts/build.sh",
     "lint": "eslint --ext .js,.jsx,.ts,.tsx ./",
     "lint:fix": "yarn run lint --fix",
@@ -82,11 +82,13 @@
     "**/axios": "^0.26.1"
   },
   "devDependencies": {
+    "@babel/core": "^7.24.5",
     "@babel/runtime": "^7.24.5",
     "@commitlint/cli": "^13.1.0",
     "@commitlint/config-conventional": "^13.1.0",
     "@onflow/fcl": "^1.4.1",
     "@onflow/types": "^1.1.0",
+    "@rarible/eslint-config-react": "~0.10.0-alpha.37",
     "@rarible/eslint-config-ts": "~0.10.0-alpha.37",
     "@rarible/prettier": "~0.10.0-alpha.37",
     "@solana/web3.js": "~1.54.0",
@@ -99,7 +101,10 @@
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-import": "^2.29.1",
     "eslint-plugin-jest": "^28.5.0",
+    "eslint-plugin-jsx-a11y": "^6.8.0",
     "eslint-plugin-prettier": "^5.1.3",
+    "eslint-plugin-react": "^7.34.1",
+    "eslint-plugin-react-hooks": "^4.6.2",
     "eslint-plugin-unicorn": "^53.0.0",
     "google-protobuf": "^3.21.2",
     "husky": "^8.0.3",
@@ -112,8 +117,8 @@
     "npm-check-updates": "^11.5.13",
     "npm-run-all": "^4.1.5",
     "prettier": "^3.2.5",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
+    "react": "^17",
+    "react-dom": "^17",
     "rxjs": "^6.6.7",
     "sort-package-json": "^1.52.0",
     "ts-jest": "^29.1.2",

packages/example/.babelrc

@@ -0,0 +1,17 @@
+{
+  "presets": [
+    "@babel/env",
+    [
+      "@babel/react",
+      {
+        "runtime": "automatic"
+      }
+    ],
+    "@babel/typescript"
+  ],
+  "plugins": [
+    ["@babel/plugin-transform-private-methods", { "loose": true }],
+    ["@babel/plugin-transform-private-property-in-object", { "loose": true }],
+    ["@babel/plugin-transform-class-properties", { "loose": true }]
+  ]
+}

packages/example/.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": ["@rarible/eslint-config-react", "plugin:prettier/recommended"]
+}

packages/example/.gitignore

@@ -1,2 +1 @@
 *.pem
-src/react-app-env.d.ts

packages/example/package.json

@@ -3,48 +3,26 @@
   "version": "0.13.68-fix.23",
   "private": true,
   "scripts": {
-    "build": "mv common.env .env && yarn run build:raw",
-    "build:raw": "NODE_OPTIONS='--max-old-space-size=6096 --openssl-legacy-provider' CI=false react-app-rewired build",
-    "eject": "react-app-rewired eject",
-    "serve-static": "serve ./build",
-    "start": "react-app-rewired start",
-    "verify": "tsc --noEmit"
+    "build": "run-s setup:env build:webpack",
+    "build:webpack": "webpack --config webpack.prod.ts",
+    "serve": "serve ./build",
+    "setup:env": "mv common.env .env",
+    "start": "webpack serve --config webpack.dev.ts",
+    "verify": "tsc"
   },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
-  },
-  "resolutions": {
-    "//": "See https://github.com/facebook/create-react-app/issues/11773",
-    "react-error-overlay": "6.0.9"
-  },
-  "devDependencies": {
+  "browserslist": "> 0.5%, last 2 versions, not dead",
+  "dependencies": {
     "@babel/core": "^7.24.5",
-    "@babel/plugin-proposal-logical-assignment-operators": "^7.20.7",
-    "@babel/plugin-proposal-nullish-coalescing-operator": "^7.18.6",
-    "@babel/plugin-syntax-bigint": "^7.8.3",
-    "@babel/plugin-syntax-flow": "^7.24.1",
-    "@babel/plugin-transform-optional-chaining": "^7.24.5",
-    "@babel/plugin-transform-react-jsx": "^7.23.4",
-    "@babel/runtime": "^7.24.5",
     "@emotion/react": "^11.8.2",
     "@emotion/styled": "^11.8.1",
     "@fortawesome/fontawesome-svg-core": "^1.3.0",
     "@fortawesome/free-regular-svg-icons": "6.0.0",
     "@fortawesome/free-solid-svg-icons": "6.0.0",
     "@fortawesome/react-fontawesome": "0.1.17",
     "@imtbl/imx-sdk": "^2.1.1",
-    "@mui/icons-material": "^5.8.4",
-    "@mui/lab": "^5.0.0-alpha.72",
-    "@mui/material": "^5.5.0",
+    "@mui/icons-material": "^5.15.17",
+    "@mui/lab": "^5.0.0-alpha.170",
+    "@mui/material": "^5.15.17",
     "@nfid/embed": "0.0.5-alpha.0",
     "@nfid/wallet": "^1.1.0",
     "@rarible/api-client": "0.16.5-alpha.10",
@@ -67,29 +45,41 @@
     "@rarible/web3-ethereum": "^0.13.68-fix.23",
     "@rixio/atom": "^0.12.1",
     "@rixio/react": "^0.12.1",
-    "@testing-library/dom": "^7.21.4",
-    "@testing-library/jest-dom": "^5.16.2",
-    "@testing-library/react": "^12.1.4",
-    "@testing-library/user-event": "^13.5.0",
-    "@types/lodash": "^4.14.179",
-    "@types/node": "^17.0.21",
-    "@types/react": "^17.0.40",
-    "@types/react-dom": "^17.0.13",
-    "@types/react-syntax-highlighter": "^13.5.2",
-    "customize-cra": "1.0.0",
     "lodash": "^4.17.21",
-    "node-polyfill-webpack-plugin": "^3.0.0",
-    "node-sass": "^7.0.1",
-    "normalize.css": "^8.0.1",
-    "react": "^17.0.2",
-    "react-app-rewired": "^2.2.1",
-    "react-dom": "^17.0.2",
-    "react-error-overlay": "6.0.9",
-    "react-hook-form": "~7.28.0",
+    "react": "^17",
+    "react-dom": "^17",
+    "react-hook-form": "^7.51.5",
     "react-router-dom": "6",
-    "react-scripts": "^5.0.1",
-    "react-syntax-highlighter": "^15.4.5",
+    "react-syntax-highlighter": "^15.5.0",
     "rxjs": "^6.6.7",
-    "serve": "^14.2.1"
+    "swr": "^2.2.5"
+  },
+  "devDependencies": {
+    "@babel/plugin-transform-class-properties": "^7.24.1",
+    "@babel/preset-env": "^7.24.5",
+    "@babel/preset-react": "^7.24.1",
+    "@babel/preset-typescript": "^7.24.1",
+    "@types/dotenv-webpack": "^7.0.7",
+    "@types/lodash": "^4.14.179",
+    "@types/node": "^20.12.12",
+    "@types/react": "^17",
+    "@types/react-dom": "^17",
+    "@types/react-syntax-highlighter": "^15.5.13",
+    "babel-loader": "^9.1.3",
+    "css-loader": "^7.1.2",
+    "dotenv-webpack": "^8.1.0",
+    "html-webpack-plugin": "^5.6.0",
+    "node-polyfill-webpack-plugin": "^3.0.0",
+    "serve": "^14.2.3",
+    "style-loader": "^4.0.0",
+    "ts-node": "^10.9.2",
+    "typescript": "^5.4.5",
+    "webpack": "^5.91.0",
+    "webpack-cli": "^5.1.4",
+    "webpack-dev-server": "^5.0.4",
+    "webpack-merge": "^5.10.0"
+  },
+  "engines": {
+    "node": ">=18.0.0"
   }
 }