@sleeperhq/mini-core 4.0.0 → 4.0.2

package/bin/build_mini.js

@@ -47,7 +47,7 @@ const getCommands = (projectName) => {
     --sourcemap-output "${sourcemapOutputPath[platform]}" \
     --minify true \
     --assets-dest "${assetsDestPath[platform]}" \
-    --webpackConfig ./node_modules/@sleeperhq/mini-core/webpack.config.js`;
+    --webpackConfig ./node_modules/@sleeperhq/mini-core/rspack.config.js`;
   };
   
   // Exposed

package/mini_packages.json

@@ -19,7 +19,7 @@
     "@react-navigation/native": "6.1.17",
     "@react-navigation/stack": "6.4.0",
     "@shopify/flash-list":  "1.7.6",
-    "@sleeperhq/mini-core": "4.0.0",
+    "@sleeperhq/mini-core": "4.0.1",
     "amazon-cognito-identity-js": "6.3.2",
     "crypto-js": "3.3.0",
     "decimal.js-light": "2.5.1",
@@ -52,7 +52,6 @@
     "react-native-image-pan-zoom": "2.1.12",
     "react-native-image-picker": "4.10.3",
     "react-native-image-resizer": "1.4.5",
-    "react-native-interactable": "2.0.1",
     "react-native-iphone-x-helper": "1.3.1",
     "react-native-json-tree": "1.3.0",
     "react-native-keep-awake": "4.0.0",
@@ -96,7 +95,7 @@
     "rn-prompt": "1.0.4"
   },
   "overrides": {
-    "@callstack/repack": "5.0.7-c",
+    "@callstack/repack": "5.0.9",
     "@react-native-async-storage/async-storage": "2.2.0",
     "@react-native-community/audio-toolkit": "2.0.3",
     "react-native-chart-kit": "6.7.0",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sleeperhq/mini-core",
-  "version": "4.0.0",
+  "version": "4.0.2",
   "description": "Core library frameworks for developing Sleeper Mini Apps.",
   "main": "index.ts",
   "types": "index.d.ts",
@@ -36,17 +36,21 @@
   "dependencies": {
     "@babel/plugin-transform-runtime": "7.25.9",
     "@babel/runtime": "7.26.0",
-    "@callstack/repack": "blitzstudios/repack.git#callstack-repack-v5.0.7-c-gitpkg",
+    "@callstack/repack": "blitzstudios/repack.git#callstack-repack-v5.0.9-gitpkg",
+    "@callstack/repack-plugin-reanimated": "5.1.1",
     "@react-native-community/cli": "15.0.1",
     "@react-native-community/cli-platform-android": "15.0.1",
     "@react-native-community/cli-platform-apple": "15.0.1",
     "@react-native-community/cli-platform-ios": "15.0.1",
     "@react-native-community/netinfo": "11.3.2",
+    "@rspack/core": "1.3.15",
     "@rspack/plugin-react-refresh": "1.0.0",
+    "@swc/helpers": "0.5.17",
     "axios": "0.15.3",
     "babel-loader": "9.1.3",
     "react-native-fast-image": "https://github.com/blitzstudios/react-native-fast-image.git#release/1.4",
     "react-native-linear-gradient": "2.8.3",
+    "react-native-reanimated": "3.17.1",
     "react-native-rename": "blitzstudios/react-native-rename.git#react-native-rename-v3.2.17-gitpkg",
     "react-native-turbo-image": "1.22.3",
     "regenerator-runtime": "0.13.11",

package/rspack.config.js

@@ -0,0 +1,279 @@
+const path = require('path');
+const Repack = require('../../../node_modules/@callstack/repack');
+const config = require('../../../app.json');
+const { dependencies } = require('../../../package.json');
+const { RebuildNotifyPlugin } = require('./src/plugins/rebuildNotifyPlugin');
+const { ReanimatedPlugin } = require('@callstack/repack-plugin-reanimated');
+
+const { samples, selectedSample } = config;
+const sampleClassPath = `../../../src/${samples[selectedSample]}`;
+const sampleClassPathLocal = `./src/${samples[selectedSample]}`
+
+/**
+ * More documentation, installation, usage, motivation and differences with Metro is available at:
+ * https://github.com/callstack/repack/blob/main/README.md
+ *
+ * The API documentation for the functions and plugins used in this file is available at:
+ * https://re-pack.netlify.app/
+ */
+
+/**
+ * Webpack configuration.
+ * You can also export a static object or a function returning a Promise.
+ *
+ * @param env Environment options passed from either Webpack CLI or React Native CLI
+ *            when running with `react-native start/bundle`.
+ */
+module.exports = env => {
+  const {
+    mode = 'development',
+    context = path.resolve(__dirname, '..', '..', '..'),
+    entry = './node_modules/@sleeperhq/mini-core/start.tsx',
+    platform,
+    minimize = mode === 'production',
+    devServer = undefined,
+    bundleFilename = undefined,
+    sourceMapFilename = undefined,
+    assetsPath = undefined,
+    reactNativePath = require.resolve('react-native'),
+  } = env;
+
+  if (!platform) {
+    throw new Error('Missing platform');
+  }
+
+  const dev = mode === 'development';
+
+  const sharedDeps = Object.keys(dependencies).reduce((acc, key) => {
+    acc[key] = { 
+      requiredVersion: dependencies[key],
+      // Only set eager for development to prevent sync loading issues in production
+      eager: dev && (key === 'react' || key === 'react-native'),
+      // Only set singleton for critical packages
+      ...(key === 'react' || key === 'react-native' ? { singleton: true } : {})
+    };
+    return acc;
+  }, {});
+
+  /**
+   * Using Module Federation might require disabling hmr.
+   * Uncomment below to set `devServer.hmr` to `false`.
+   *
+   * Keep in mind that `devServer` object is not available
+   * when running `webpack-bundle` command. Be sure
+   * to check its value to avoid accessing undefined value,
+   * otherwise an error might occur.
+   */
+  // if (devServer) {
+  //   devServer.hmr = false;
+  // }
+
+  /**
+   * Depending on your Babel configuration you might want to keep it.
+   * If you don't use `env` in your Babel config, you can remove it.
+   *
+   * Keep in mind that if you remove it you should set `BABEL_ENV` or `NODE_ENV`
+   * to `development` or `production`. Otherwise your production code might be compiled with
+   * in development mode by Babel.
+   */
+  process.env.BABEL_ENV = mode;
+
+  return {
+    mode,
+    /**
+     * This should be always `false`, since the Source Map configuration is done
+     * by `SourceMapDevToolPlugin`.
+     */
+    devtool: 'source-map',
+    context,
+    entry,
+    resolve: {
+      /**
+       * `getResolveOptions` returns additional resolution configuration for React Native.
+       * If it's removed, you won't be able to use `<file>.<platform>.<ext>` (eg: `file.ios.js`)
+       * convention and some 3rd-party libraries that specify `react-native` field
+       * in their `package.json` might not work correctly.
+       */
+      ...Repack.getResolveOptions(platform),
+
+      /**
+       * Uncomment this to ensure all `react-native*` imports will resolve to the same React Native
+       * dependency. You might need it when using workspaces/monorepos or unconventional project
+       * structure. For simple/typical project you won't need it.
+       */
+      // alias: {
+      //   'react-native': reactNativePath,
+      // },
+      alias: {
+        app: path.resolve(__dirname, sampleClassPath),
+        root: path.resolve(__dirname, '..', '..', '..'),
+      },
+    },
+    /**
+     * Configures output.
+     * It's recommended to leave it as it is unless you know what you're doing.
+     * By default Webpack will emit files into the directory specified under `path`. In order for the
+     * React Native app use them when bundling the `.ipa`/`.apk`, they need to be copied over with
+     * `Repack.OutputPlugin`, which is configured by default inside `Repack.RepackPlugin`.
+     */
+    output: {
+      clean: true,
+      path: path.join(__dirname, '..', '..', '..', 'build', platform),
+      filename: dev
+        ? 'index.bundle'
+        : platform === 'android'
+        ? 'index.android.bundle'
+        : 'index.ios.bundle',
+      chunkFilename: '[name].chunk.bundle',
+      uniqueName: config.name,
+    },
+    /**
+     * Configures optimization of the built bundle.
+     */
+    optimization: {
+      /** Enables minification based on values passed from React Native CLI or from fallback. */
+      minimize,
+      chunkIds: 'named',
+    },
+    /**
+     * We turn on polling so file updates can be recognized when used with Docker.
+     */
+    watchOptions: {
+      poll: true,
+      aggregateTimeout: 600,
+      ignored: '**/node_modules',
+    },
+    module: {
+      /**
+       * This rule will process all React Native related dependencies with Babel.
+       * If you have a 3rd-party dependency that you need to transpile, you can add it to the
+       * `include` list.
+       *
+       * You can also enable persistent caching with `cacheDirectory` - please refer to:
+       * https://github.com/babel/babel-loader#options
+       */
+      rules: [
+        ...Repack.getJsTransformRules(),
+        {
+          test: /\.jsx?$/,
+          type: 'javascript/auto',
+          exclude: /node_modules/,
+          use: {
+            loader: '@callstack/repack/flow-loader',
+            options: { all: true },
+          },
+        },
+        {
+          test: /\.jsx?$/,
+          include: Repack.getModulePaths([
+            'react-native-sms',
+            '@react-native-masked-view/masked-view',
+            'react-native-keyboard-aware-scroll-view',
+            'react-native-modal-datetime-picker',
+            '@react-native-community/art',
+            '@react-native-community/audio-toolkit',
+            'react-native-appsflyer',
+            'react-native-emoji-rain',
+            'react-native-keep-awake',
+            'react-native-sms',
+          ]),
+          use: {
+            loader: '@callstack/repack/flow-loader',
+            options: { all: true },
+          },
+          type: 'javascript/auto',
+        },
+        /**
+         * This loader handles all static assets (images, video, audio and others), so that you can
+         * use (reference) them inside your application.
+         *
+         * If you wan to handle specific asset type manually, filter out the extension
+         * from `ASSET_EXTENSIONS`, for example:
+         * ```
+         * Repack.ASSET_EXTENSIONS.filter((ext) => ext !== 'svg')
+         * ```
+         */
+        {
+          test: Repack.getAssetExtensionsRegExp(Repack.SCALABLE_ASSETS),
+          use: {
+            loader: '@callstack/repack/assets-loader',
+            options: {
+              // In order to support single file bundle uploads through our submission process,
+              // we need to encode image dependencies directly into the main bundle file as base64.
+              inline: true,
+              platform,
+              devServerEnabled: Boolean(devServer),
+              scalableAssetExtensions: Repack.SCALABLE_ASSETS,
+            },
+          },
+        },
+        {
+          test: Repack.getAssetExtensionsRegExp(Repack.NON_SCALABLE_ASSETS),
+          use: {
+            loader: '@callstack/repack/assets-loader',
+            options: {
+              inline: false, // all other assets must be uploaded separately, as they cannot be inlined.
+              platform,
+              devServerEnabled: Boolean(devServer),
+              scalableAssetExtensions: Repack.SCALABLE_ASSETS,
+            },
+          },
+        },
+      ].filter(Boolean),
+    },
+    plugins: [
+      /**
+       * Configure other required and additional plugins to make the bundle
+       * work in React Native and provide good development experience with
+       * sensible defaults.
+       *
+       * `Repack.RepackPlugin` provides some degree of customization, but if you
+       * need more control, you can replace `Repack.RepackPlugin` with plugins
+       * from `Repack.plugins`.
+       */
+      new Repack.RepackPlugin({
+        context,
+        mode,
+        platform,
+        devServer,
+        output: {
+          bundleFilename,
+          sourceMapFilename,
+          assetsPath,
+        },
+        extraChunks: [
+          {
+            include: new RegExp('.*'),
+            type: 'remote',
+            outputPath: path.join(__dirname, '..', '..', '..', 'dist', config.name, platform),
+          },
+        ],
+        listenerIP: config.remoteIP,
+      }),
+      new ReanimatedPlugin(),
+      new Repack.plugins.ModuleFederationPlugin({
+        name: config.name,
+        exposes: {
+          app: sampleClassPathLocal,
+        },
+        shared: {
+          // Adding this here fixes the named chunks problem.
+          // It also makes sure any third party javascript packages are included in the container,
+          // not exported to a separate chunk.
+          // The only separate chunk is the exposed stuff.
+          ...sharedDeps,
+          // if we don't do the above, then instead each package that is not included in this list will
+          // split off into a seperate chunk, and named chunks will break (assume that's a bug that we can fix).
+        },
+      }),
+
+      new RebuildNotifyPlugin(config),
+
+      // new Repack.plugins.ChunksToHermesBytecodePlugin({
+      //   enabled: !dev,
+      //   test: /\.(js)?bundle$/,
+      //   exclude: /index\.bundle$/,
+      // }),
+    ],
+  };
+};

package/webpack.config.js

@@ -78,7 +78,7 @@ module.exports = env => {
      * This should be always `false`, since the Source Map configuration is done
      * by `SourceMapDevToolPlugin`.
      */
-    devtool: false,
+    devtool: 'source-map',
     context,
     entry,
     resolve: {
@@ -322,4 +322,4 @@ module.exports = env => {
       // }),
     ],
   };
-};
+};