Skill v1.0.0

version: "1.0.0" name: prod-bundles description: Use when the user asks to build production bundles, check bundle sizes, audit tree-shaking, or verify mobile/desktop code separation. Covers both the desktop Vite prod build and the iOS/Android Metro bundle.

Build production bundles for both platforms and analyze them for correct tree-shaking.

Build Commands

Desktop (Vite):

# From shared/
yarn desktop:build:prod

Output lands in shared/desktop/dist/. Prod bundles have no .dev or .profile suffix — filter with:

ls shared/desktop/dist/*.bundle.js | grep -v '\.dev\.' | grep -v '\.profile\.'

iOS (Metro):

# From shared/
yarn ios:jsbundle

Output: shared/ios/dist/main.jsbundle

Android (Metro):

# From shared/
yarn android:jsbundle

Output: shared/android/dist/main.jsbundle

Tree-Shaking Audit

Desktop — check mobile-only modules are absent:

DIST=shared/desktop/dist
PROD=$(ls "$DIST"/*.bundle.js | grep -v '\.dev\.' | grep -v '\.profile\.')
for mod in expo-audio expo-location expo-video react-native-kb @gorhom/bottom-sheet lottie-react-native react-native-safe-area-context; do
  hits=$(echo "$PROD" | xargs grep -l "$mod" 2>/dev/null | wc -l | tr -d ' ')
  echo "$mod: $hits files"
done

iOS bundle — check bare `isMobile`/`isElectron` are inlined as literals (Babel plugin):

# Should report 0 occurrences — bare globals replaced with true/false at transform time
python3 -c "
import re
bundle = open('shared/ios/dist/main.jsbundle').read()
for name in ['isMobile', 'isElectron', 'isAndroid', 'isIOS']:
    real = [m for m in re.finditer(r'(?<![.\w{,])' + name + r'(?![:\w])', bundle)]
    print(f'{name} not as property/key: {len(real)} occurrences')
"

Key Facts

• Vite (desktop): the define block in shared/vite.config.mts (makeDefines) replaces bare globals (isMobile, isElectron, etc.) with literals, and the prod minifier drops the dead branches.
• Metro (iOS/Android): The makePlatformPlugin Babel plugin in babel.config.js inlines the same globals at transform time, enabling Metro's constant-folding-plugin to DCE dead branches.
• Native-only module aliasing (desktop): packages in shared/native-only-modules.js are aliased to shared/null-module.js by the resolve config in shared/vite.config.mts, and pre-bundled through optimizeDeps. After changing that file, clear Vite's dep cache: rm -rf shared/node_modules/.vite.