From 8eb897c68013cd93502616251da3cf4ebfaa9e1c Mon Sep 17 00:00:00 2001 From: Enrico Valbuena Date: Fri, 24 Dec 2021 12:00:47 -0700 Subject: [PATCH] React-Native & Expo support for alternative workspace.packages folders (#4) * new wrapper bp-request * removed expo/metro-config from rnative * minor refactor in metro.config.js * support for extra folder * update xpo project to use simiilar config --- apps/rnative/App.tsx | 12 ++++-- apps/rnative/metro.config.js | 51 +++++++++++++++----------- apps/rnative/package.json | 3 +- apps/xpo/metro.config.js | 12 ++++-- apps/xpo/package.json | 3 +- package.json | 5 ++- packages/README.md | 3 ++ wrappers/README.md | 6 +++ wrappers/bp-request/.eslintrc.js | 1 + wrappers/bp-request/package.json | 28 ++++++++++++++ wrappers/bp-request/prettier.config.js | 1 + wrappers/bp-request/src/index.ts | 14 +++++++ wrappers/bp-request/tsconfig.json | 14 +++++++ yarn.lock | 41 +-------------------- 14 files changed, 121 insertions(+), 73 deletions(-) create mode 100644 packages/README.md create mode 100644 wrappers/README.md create mode 100644 wrappers/bp-request/.eslintrc.js create mode 100644 wrappers/bp-request/package.json create mode 100644 wrappers/bp-request/prettier.config.js create mode 100644 wrappers/bp-request/src/index.ts create mode 100644 wrappers/bp-request/tsconfig.json diff --git a/apps/rnative/App.tsx b/apps/rnative/App.tsx index ed16c0f..a86a729 100644 --- a/apps/rnative/App.tsx +++ b/apps/rnative/App.tsx @@ -19,7 +19,7 @@ import { View, } from 'react-native'; import {Button} from 'ui-native'; -import axios from 'axios'; +import * as requestWrapper from 'bp-request'; import { Colors, DebugInstructions, @@ -63,9 +63,13 @@ const App = () => { backgroundColor: isDarkMode ? Colors.darker : Colors.lighter, }; React.useEffect(() => { - axios.get('https://pokeapi.co/api/v2/pokemon/ditto').then(result => { - console.log('result', result?.data?.abilities); - }); + requestWrapper + .get<{}, {data: {abilities: any}}>( + 'https://pokeapi.co/api/v2/pokemon/ditto', + ) + .then(result => { + console.log('result', result?.data?.abilities); + }); }, []); return ( diff --git a/apps/rnative/metro.config.js b/apps/rnative/metro.config.js index 8961ff4..e52a33b 100644 --- a/apps/rnative/metro.config.js +++ b/apps/rnative/metro.config.js @@ -1,36 +1,45 @@ -const {getDefaultConfig} = require('@expo/metro-config'); const path = require('path'); const {readdirSync} = require('fs'); -const config = getDefaultConfig(__dirname); const projectRoot = __dirname; const workspaceRoot = path.resolve(__dirname, '../..'); const rootPackage = require('./package.json'); +const workspacePackage = require('../../package.json'); function findSharedPackages(workspaceRoot, sharedPackagesFolder) { const sharedPackageRoots = sharedPackagesFolder.map(packageFolder => path.resolve(workspaceRoot, packageFolder), ); - const hey = sharedPackageRoots.map(sharedPackageRoot => - readdirSync(sharedPackageRoot, { - withFileTypes: true, - }) - .filter(dir => dir.isDirectory() && !dir.name.startsWith('.')) - .map(dir => dir.name) - .map(packageFolder => { - const packagePath = path.resolve(sharedPackageRoot, packageFolder); - - const packageName = require(`${packagePath}/package.json`).name; - - return {packageName, packagePath}; - }), - ); - return hey.flat(); + return sharedPackageRoots + .map(sharedPackageRoot => + readdirSync(sharedPackageRoot, { + withFileTypes: true, + }) + .filter(dir => dir.isDirectory() && !dir.name.startsWith('.')) + .map(dir => dir.name) + .map(packageFolder => { + const packagePath = path.resolve(sharedPackageRoot, packageFolder); + + const packageName = require(`${packagePath}/package.json`).name; + + return {packageName, packagePath}; + }), + ) + .flat(); } +const config = { + resolver: {}, +}; + /** * Get monorepo depencies, flagged by a "*" */ + +const monoRepoFolders = workspacePackage.workspaces.packages.map(pkg => + pkg.substring(0, pkg.search(RegExp('\\/\\*'))), +); + const dependencies = { ...rootPackage.dependencies, ...rootPackage.devDependencies, @@ -40,10 +49,10 @@ const usedDeps = Object.keys(dependencies).filter( dep => dependencies[dep] === '*', ); -const allRepoPackages = findSharedPackages(path.resolve(workspaceRoot), [ - 'packages', - 'apps', -]); +const allRepoPackages = findSharedPackages( + path.resolve(workspaceRoot), + monoRepoFolders, +); /** * We don't need to watch the whole repo as it can get pretty large over time. diff --git a/apps/rnative/package.json b/apps/rnative/package.json index a0dccc0..931c112 100644 --- a/apps/rnative/package.json +++ b/apps/rnative/package.json @@ -12,7 +12,7 @@ "clean": "rm -rf .turbo && rm -rf node_modules" }, "dependencies": { - "axios": "^0.24.0", + "bp-request": "*", "react": "17.0.2", "react-native": "0.66.4", "ui-native": "*" @@ -20,7 +20,6 @@ "devDependencies": { "@babel/core": "^7.12.9", "@babel/runtime": "^7.12.5", - "@expo/metro-config": "^0.3.8", "@react-native-community/eslint-config": "^2.0.0", "@types/jest": "^26.0.23", "@types/react-native": "^0.66.4", diff --git a/apps/xpo/metro.config.js b/apps/xpo/metro.config.js index 8961ff4..4f91e15 100644 --- a/apps/xpo/metro.config.js +++ b/apps/xpo/metro.config.js @@ -5,6 +5,13 @@ const config = getDefaultConfig(__dirname); const projectRoot = __dirname; const workspaceRoot = path.resolve(__dirname, '../..'); const rootPackage = require('./package.json'); +const workspacePackage = require('../../package.json'); + + +const monoRepoFolders = workspacePackage.workspaces.packages.map(pkg => + pkg.substring(0, pkg.search(RegExp('\\/\\*'))), +); + function findSharedPackages(workspaceRoot, sharedPackagesFolder) { const sharedPackageRoots = sharedPackagesFolder.map(packageFolder => @@ -40,10 +47,7 @@ const usedDeps = Object.keys(dependencies).filter( dep => dependencies[dep] === '*', ); -const allRepoPackages = findSharedPackages(path.resolve(workspaceRoot), [ - 'packages', - 'apps', -]); +const allRepoPackages = findSharedPackages(path.resolve(workspaceRoot), monoRepoFolders); /** * We don't need to watch the whole repo as it can get pretty large over time. diff --git a/apps/xpo/package.json b/apps/xpo/package.json index 4ac262f..379ded8 100644 --- a/apps/xpo/package.json +++ b/apps/xpo/package.json @@ -17,7 +17,8 @@ "react-dom": "17.0.2", "react-native": "0.64.3", "react-native-web": "0.17.1", - "ui-native": "*" + "ui-native": "*", + "bp-request":"*" }, "devDependencies": { "@babel/core": "^7.12.9", diff --git a/package.json b/package.json index e86f056..9d50f43 100644 --- a/package.json +++ b/package.json @@ -1,11 +1,12 @@ { "name": "turbo-boilerplate", - "version": "0.1.0", + "version": "0.2.0", "private": true, "workspaces": { "packages": [ "packages/*", - "apps/*" + "apps/*", + "wrappers/*" ], "nohoist": [ "**/react-native", diff --git a/packages/README.md b/packages/README.md new file mode 100644 index 0000000..d23c1fe --- /dev/null +++ b/packages/README.md @@ -0,0 +1,3 @@ +## Purpose + +This folder in the monorepo contains libraries which are to be built before being used. \ No newline at end of file diff --git a/wrappers/README.md b/wrappers/README.md new file mode 100644 index 0000000..bfada35 --- /dev/null +++ b/wrappers/README.md @@ -0,0 +1,6 @@ +## Wrappers + +- This folder in the monorepo contains libraries which do not need to be built before being used. +- Wrapper libraries are libraries that "wrap" around a third party library like stripe, sendGrid, twilio, axios, etc. +- This is so that if the third party library requirements change, you only need to change the third party library in a few places as opposed to all your mono repo applications. +- These libraries should have no other monorepo package dependencies. \ No newline at end of file diff --git a/wrappers/bp-request/.eslintrc.js b/wrappers/bp-request/.eslintrc.js new file mode 100644 index 0000000..7821ec2 --- /dev/null +++ b/wrappers/bp-request/.eslintrc.js @@ -0,0 +1 @@ +module.exports = require("scripts/eslint-preset"); diff --git a/wrappers/bp-request/package.json b/wrappers/bp-request/package.json new file mode 100644 index 0000000..41a064b --- /dev/null +++ b/wrappers/bp-request/package.json @@ -0,0 +1,28 @@ +{ + "name": "bp-request", + "version": "1.0.0", + "main": "./dist/index.js", + "module": "./dist/index.mjs", + "types": "./dist/index.d.ts", + "sideEffects": false, + "private": true, + "license": "MIT", + "files": [ + "dist/**" + ], + "scripts": { + "test": "jest -u", + "build": "tsup src/index.ts --format esm,cjs --dts --external axios", + "dev": "tsup src/index.ts --format esm,cjs --watch --dts --external axios", + "lint": "TIMING=1 eslint src --fix", + "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist" + }, + "devDependencies": { + "axios": "0.24.0", + "tsup": "^5.10.1", + "typescript": "^4.2.4" + }, + "jest": { + "preset": "scripts/jest/node" + } +} diff --git a/wrappers/bp-request/prettier.config.js b/wrappers/bp-request/prettier.config.js new file mode 100644 index 0000000..7c6d6c7 --- /dev/null +++ b/wrappers/bp-request/prettier.config.js @@ -0,0 +1 @@ +module.exports = {} \ No newline at end of file diff --git a/wrappers/bp-request/src/index.ts b/wrappers/bp-request/src/index.ts new file mode 100644 index 0000000..08b57bf --- /dev/null +++ b/wrappers/bp-request/src/index.ts @@ -0,0 +1,14 @@ +import axios from "axios"; + +const get = async

( + url: string, + headers?: { [key: string]: string } +): Promise => { + const result = await axios.get(url, { + headers, + }); + + return result; +}; + +export { get }; diff --git a/wrappers/bp-request/tsconfig.json b/wrappers/bp-request/tsconfig.json new file mode 100644 index 0000000..755ad2b --- /dev/null +++ b/wrappers/bp-request/tsconfig.json @@ -0,0 +1,14 @@ +{ + "extends": "tsconfig/base.json", + "compilerOptions": { + "moduleResolution": "node", + "jsx": "react-jsx", + "lib": ["ES2015"], + "target": "ES6", + "module": "ESNext", + "outDir": "./dist", + "rootDir": "./src" + }, + "include": ["src"], + "exclude": ["node_modules", "src/__test__/**/*"] +} diff --git a/yarn.lock b/yarn.lock index 286f065..6797912 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1142,7 +1142,7 @@ xcode "^3.0.1" xml2js "^0.4.23" -"@expo/config-plugins@4.0.15", "@expo/config-plugins@^4.0.2": +"@expo/config-plugins@^4.0.2": version "4.0.15" resolved "https://registry.yarnpkg.com/@expo/config-plugins/-/config-plugins-4.0.15.tgz#cc170a0cf890973b6491cf357540e9955296019c" integrity sha512-QqxVEt2bFu3ZuI1soULRJv7i0Zrg/FMZ0IxNV7Y3AjH7fhtUJH3pPo9f6MURvqNr+PLxhBlkofkWfunrVejSkw== @@ -1191,23 +1191,6 @@ slugify "^1.3.4" sucrase "^3.20.0" -"@expo/config@6.0.15": - version "6.0.15" - resolved "https://registry.yarnpkg.com/@expo/config/-/config-6.0.15.tgz#aa610f8b714e0b1103e13c8210059519479d11d6" - integrity sha512-nrG+OUe/2n3ulNSgHRs9V70zXu3lpkuzJ6F0VmCuhjyHqT7UYimkgSCJGqaE3N+AayBTK+YffOT6bTWH17wxjQ== - dependencies: - "@babel/code-frame" "~7.10.4" - "@expo/config-plugins" "4.0.15" - "@expo/config-types" "^43.0.1" - "@expo/json-file" "8.2.34" - getenv "^1.0.0" - glob "7.1.6" - require-from-string "^2.0.2" - resolve-from "^5.0.0" - semver "7.3.2" - slugify "^1.3.4" - sucrase "^3.20.0" - "@expo/json-file@8.2.33": version "8.2.33" resolved "https://registry.yarnpkg.com/@expo/json-file/-/json-file-8.2.33.tgz#78f56f33a2cfb807b23c81e00237a33159aa1f32" @@ -1226,19 +1209,6 @@ json5 "^1.0.1" write-file-atomic "^2.3.0" -"@expo/metro-config@^0.3.8": - version "0.3.8" - resolved "https://registry.yarnpkg.com/@expo/metro-config/-/metro-config-0.3.8.tgz#e784f96ad9d182e7177c191b82471a6c8c9e6704" - integrity sha512-dDjd5wFlw0t/UEjYvT6atDPEUYI8GyCX0unnRowRCe2V67NMmwZ2FkUBapwOy12HhkdlRJqfp+XdHgj2LiXzdg== - dependencies: - "@expo/config" "6.0.15" - "@expo/json-file" "8.2.34" - chalk "^4.1.0" - debug "^4.3.2" - find-yarn-workspace-root "~2.0.0" - getenv "^1.0.0" - sucrase "^3.20.0" - "@expo/metro-config@~0.1.84": version "0.1.84" resolved "https://registry.yarnpkg.com/@expo/metro-config/-/metro-config-0.1.84.tgz#ddcc7b4f1087c29f86bc9d916933d29bacd2c726" @@ -3020,7 +2990,7 @@ axe-core@^4.3.5: resolved "https://registry.yarnpkg.com/axe-core/-/axe-core-4.3.5.tgz#78d6911ba317a8262bfee292aeafcc1e04b49cc5" integrity sha512-WKTW1+xAzhMS5dJsxWkliixlO/PqC4VhmO9T4juNYcaTg9jzWiJsou6m5pxWYGfigWbwzJWeFY6z47a+4neRXA== -axios@^0.24.0: +axios@0.24.0: version "0.24.0" resolved "https://registry.yarnpkg.com/axios/-/axios-0.24.0.tgz#804e6fa1e4b9c5288501dd9dff56a7a0940d20d6" integrity sha512-Q6cWsys88HoPgAaFAVUb0WpPk0O8iTeisR9IMqy9G8AbO4NlpVknrnQS03zzF9PGAWgO3cgletO3VjV/P7VztA== @@ -5662,13 +5632,6 @@ find-up@~5.0.0: locate-path "^6.0.0" path-exists "^4.0.0" -find-yarn-workspace-root@~2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/find-yarn-workspace-root/-/find-yarn-workspace-root-2.0.0.tgz#f47fb8d239c900eb78179aa81b66673eac88f7bd" - integrity sha512-1IMnbjt4KzsQfnhnzNd8wUEgXZ44IzZaZmnLYx7D5FZlaHt2gW20Cri8Q+E/t5tIj4+epTBub+2Zxu/vNILzqQ== - dependencies: - micromatch "^4.0.2" - flat-cache@^3.0.4: version "3.0.4" resolved "https://registry.yarnpkg.com/flat-cache/-/flat-cache-3.0.4.tgz#61b0338302b2fe9f957dcc32fc2a87f1c3048b11"