├── base-serializer.js ├── index.js ├── package.json ├── LICENSE.md ├── .gitignore └── README.md /base-serializer.js: -------------------------------------------------------------------------------- 1 | const createSerializer = () => { 2 | const baseJSBundle = require('metro/src/DeltaBundler/Serializers/baseJSBundle'); 3 | const bundleToString = require("metro/src/lib/bundleToString"); 4 | 5 | return (entryPoint, prepend, graph, bundleOptions) => bundleToString( 6 | baseJSBundle(entryPoint, prepend, graph, bundleOptions) 7 | ); 8 | } 9 | 10 | const getBaseSerializer = () => { 11 | try { 12 | return createSerializer(); 13 | } catch (error) { 14 | if (error.code === 'MODULE_NOT_FOUND') { 15 | throw new Error('Cannot find required internals of Metro. Please make sure you have installed the correct version of Metro.'); 16 | } 17 | 18 | throw error; 19 | } 20 | } 21 | 22 | module.exports = { getBaseSerializer }; 23 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | const { withExpoAtlas } = require('expo-atlas/metro'); 2 | const { getBaseSerializer } = require('./base-serializer'); 3 | 4 | /** 5 | * Initialize Expo Atlas to gather statistics from Metro when exporting bundles. 6 | * This function adds the required Metro config, and should be the last config mutation. 7 | * 8 | * @param {import("metro-config").MetroConfig} metroConfig 9 | * @param {{ atlasFile: string; }} [options] 10 | */ 11 | const withExpoAtlasWithoutExpo = (metroConfig, options) => { 12 | return withExpoAtlas({ 13 | ...metroConfig, 14 | serializer: { 15 | ...metroConfig.serializer, 16 | customSerializer: metroConfig.serializer?.customSerializer ?? getBaseSerializer(), 17 | } 18 | }, options); 19 | }; 20 | 21 | module.exports = { withExpoAtlasWithoutExpo }; 22 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "sideEffects": false, 3 | "name": "expo-atlas-without-expo", 4 | "version": "1.0.1", 5 | "description": "Supercharge your vanilla React Native apps with Expo Atlas metrics", 6 | "keywords": [ 7 | "react-native", 8 | "bundle", 9 | "visualizer", 10 | "explorer", 11 | "expo", 12 | "react", 13 | "devtools" 14 | ], 15 | "main": "index.js", 16 | "homepage": "https://github.com/v3ron/expo-atlas-without-expo#readme", 17 | "bugs": { 18 | "url": "https://github.com/v3ron/expo-atlas-without-expo/issues" 19 | }, 20 | "repository": { 21 | "type": "git", 22 | "url": "https://github.com/v3ron/expo-atlas-without-expo" 23 | }, 24 | "license": "MIT", 25 | "dependencies": { 26 | "expo-atlas": "^0.4.0" 27 | }, 28 | "peerDependencies": { 29 | "metro": "^0.79.0 || ^0.81.0", 30 | "expo-atlas": "^0.4.0" 31 | }, 32 | "peerDependenciesMeta": { 33 | "expo-atlas": { 34 | "optional": false 35 | } 36 | }, 37 | "author": "Szymon Chmal (https://github.com/V3R0N)" 38 | } 39 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2025 Szymon Chmal 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | lerna-debug.log* 8 | .pnpm-debug.log* 9 | 10 | # Diagnostic reports (https://nodejs.org/api/report.html) 11 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json 12 | 13 | # Runtime data 14 | pids 15 | *.pid 16 | *.seed 17 | *.pid.lock 18 | 19 | # Directory for instrumented libs generated by jscoverage/JSCover 20 | lib-cov 21 | 22 | # Coverage directory used by tools like istanbul 23 | coverage 24 | *.lcov 25 | 26 | # nyc test coverage 27 | .nyc_output 28 | 29 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) 30 | .grunt 31 | 32 | # Bower dependency directory (https://bower.io/) 33 | bower_components 34 | 35 | # node-waf configuration 36 | .lock-wscript 37 | 38 | # Compiled binary addons (https://nodejs.org/api/addons.html) 39 | build/Release 40 | 41 | # Dependency directories 42 | node_modules/ 43 | jspm_packages/ 44 | 45 | # Snowpack dependency directory (https://snowpack.dev/) 46 | web_modules/ 47 | 48 | # TypeScript cache 49 | *.tsbuildinfo 50 | 51 | # Optional npm cache directory 52 | .npm 53 | 54 | # Optional eslint cache 55 | .eslintcache 56 | 57 | # Optional stylelint cache 58 | .stylelintcache 59 | 60 | # Microbundle cache 61 | .rpt2_cache/ 62 | .rts2_cache_cjs/ 63 | .rts2_cache_es/ 64 | .rts2_cache_umd/ 65 | 66 | # Optional REPL history 67 | .node_repl_history 68 | 69 | # Output of 'npm pack' 70 | *.tgz 71 | 72 | # Yarn Integrity file 73 | .yarn-integrity 74 | 75 | # dotenv environment variable files 76 | .env 77 | .env.development.local 78 | .env.test.local 79 | .env.production.local 80 | .env.local 81 | 82 | # parcel-bundler cache (https://parceljs.org/) 83 | .cache 84 | .parcel-cache 85 | 86 | # Next.js build output 87 | .next 88 | out 89 | 90 | # Nuxt.js build / generate output 91 | .nuxt 92 | dist 93 | 94 | # Gatsby files 95 | .cache/ 96 | # Comment in the public line in if your project uses Gatsby and not Next.js 97 | # https://nextjs.org/blog/next-9-1#public-directory-support 98 | # public 99 | 100 | # vuepress build output 101 | .vuepress/dist 102 | 103 | # vuepress v2.x temp and cache directory 104 | .temp 105 | .cache 106 | 107 | # vitepress build output 108 | **/.vitepress/dist 109 | 110 | # vitepress cache directory 111 | **/.vitepress/cache 112 | 113 | # Docusaurus cache and generated files 114 | .docusaurus 115 | 116 | # Serverless directories 117 | .serverless/ 118 | 119 | # FuseBox cache 120 | .fusebox/ 121 | 122 | # DynamoDB Local files 123 | .dynamodb/ 124 | 125 | # TernJS port file 126 | .tern-port 127 | 128 | # Stores VSCode versions used for testing VSCode extensions 129 | .vscode-test 130 | 131 | # yarn v2 132 | .yarn/cache 133 | .yarn/unplugged 134 | .yarn/build-state.yml 135 | .yarn/install-state.gz 136 | .pnp.* 137 | 138 | # Idea 139 | .idea/ 140 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |
2 | 3 | # 📊 expo-atlas-without-expo 4 | 5 | [![npm version](https://img.shields.io/npm/v/expo-atlas-without-expo.svg?style=flat-square)](https://www.npmjs.com/package/expo-atlas-without-expo) 6 | [![license](https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square)](https://github.com/v3ron/expo-atlas-without-expo/blob/main/LICENSE) 7 | [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) 8 | 9 | **Supercharge your vanilla React Native apps with Expo Atlas metrics** 10 | 11 | [Installation](#installation) • 12 | [Usage](#usage) • 13 | [Documentation](#configuration-options) • 14 | [Contributing](#contributing) 15 | 16 | --- 17 | 18 |
19 | 20 | ## Overview 21 | 22 | This package allows you to use Expo Atlas in your vanilla React Native applications without requiring a full Expo setup. It provides the same functionality as Expo Atlas in Expo apps but works with custom Metro configurations. 23 | 24 | ## ✨ Features 25 | 26 | - 🔄 Seamless integration with existing Metro config 27 | - 📊 Full Expo Atlas metrics support 28 | - 🛠 Custom serializer preservation 29 | - ⚡️ Zero performance overhead 30 | - 🎯 Simple one-line setup 31 | 32 | ## 🚀 Installation 33 | 34 | ```bash 35 | npm install --save-dev expo-atlas-without-expo expo-atlas 36 | # or 37 | yarn add -D expo-atlas-without-expo expo-atlas 38 | # or 39 | pnpm add --save-dev expo-atlas-without-expo expo-atlas 40 | ``` 41 | 42 | ## 📖 Usage 43 | 44 | 1. Import the adapter in your Metro configuration file (`metro.config.js`): 45 | 46 | ```javascript 47 | const { withExpoAtlasWithoutExpo } = require('expo-atlas-without-expo'); 48 | 49 | module.exports = withExpoAtlasWithoutExpo({ 50 | // Your existing Metro configuration 51 | }, { 52 | // Optional: Specify custom Atlas options 53 | atlasFile: 'path/to/atlas-stats.json' 54 | }); 55 | ``` 56 | 57 | 58 | 2. Bundle your application using the React Native CLI: 59 | 60 | ```bash 61 | npx react-native bundle --platform ios --dev false --entry-file index.js --bundle-output ios/main.jsbundle 62 | # or for Android 63 | npx react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle 64 | ``` 65 | 66 | 3. Run Expo Atlas - it will automatically detect and analyze the statistics gathered during bundling: 67 | 68 | ```bash 69 | npx expo-atlas 70 | ``` 71 | 72 | ## ⚙️ Configuration Options 73 | 74 | The `withExpoAtlasWithoutExpo` function accepts two parameters: 75 | 76 | - `metroConfig`: Your base Metro configuration object 77 | - `options`: (Optional) An object with the following properties: 78 | - `atlasFile`: Custom path for the Atlas statistics output file 79 | 80 | ## 🔍 How It Works 81 | 82 | The adapter wraps your Metro configuration with Expo Atlas while preserving your existing serializer settings. It ensures compatibility between Expo Atlas and your custom Metro setup by: 83 | 84 | 1. Maintaining your existing Metro configuration 85 | 2. Adding the necessary Expo Atlas instrumentation 86 | 3. Preserving any custom serializers you may have configured 87 | 88 | ## 💡 Example 89 | 90 | ```javascript 91 | const { withExpoAtlasWithoutExpo } = require('expo-atlas-without-expo'); 92 | 93 | const config = { 94 | transformer: { 95 | // Your transformer config 96 | }, 97 | resolver: { 98 | // Your resolver config 99 | }, 100 | // ... other Metro config options 101 | }; 102 | 103 | module.exports = withExpoAtlasWithoutExpo(config, { 104 | atlasFile: './build/atlas-stats.json' 105 | }); 106 | ``` 107 | 108 | ## 📄 License 109 | 110 | MIT 111 | 112 | ## 🤝 Contributing 113 | 114 | Contributions are welcome! Please feel free to submit a Pull Request. 115 | --------------------------------------------------------------------------------