chore(react-native): Fix RN not loading properly

Author: WillsonHaw

.changeset/curvy-wolves-say.md

@@ -0,0 +1,6 @@
+---
+"@plextv/vite-plugin-react-native-lightning": patch
+"@plextv/react-lightning-plugin-flexbox": patch
+---
+
+chore(react-native): Fix RN not loading properly

packages/configs/vite.config.mjs

@@ -1,10 +1,12 @@
 import { defineConfig } from 'vite';
 
+const esmExt = 'js';
+const cjsExt = 'cjs';
 const createEntryCode = (fileName) => `'use strict';
 if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./${fileName}.production.min.js');
+  module.exports = require('./${fileName}.production.${cjsExt}');
 } else {
-  module.exports = require('./${fileName}.development.js');
+  module.exports = require('./${fileName}.development.${cjsExt}');
 }`;
 
 /**
@@ -29,7 +31,7 @@ const generateEntryFile = {
 
     this.emitFile({
       type: 'asset',
-      fileName: `cjs/${name}.js`,
+      fileName: `cjs/${name}.${cjsExt}`,
       source: createEntryCode(name),
     });
   },
@@ -41,7 +43,7 @@ export default defineConfig(({ mode }) => ({
       entry: 'src/index.ts',
       name: 'index',
       fileName: (format, entryName) =>
-        `${format}/${entryName}.${mode}.${format === 'es' ? 'mjs' : 'js'}`,
+        `${format}/${entryName}.${mode}.${format === 'es' ? esmExt : cjsExt}`,
       formats: ['es', 'cjs'],
     },
     minify: mode === 'production',

packages/plugin-flexbox/package.json

@@ -12,7 +12,7 @@
     "url": "https://github.com/plexinc/react-lightning/issues/new"
   },
   "type": "module",
-  "main": "./dist/cjs/index.js",
+  "main": "./dist/cjs/index.cjs",
   "module": "./dist/es/index.production.js",
   "types": "./dist/types/index.d.ts",
   "exports": {
@@ -26,7 +26,7 @@
     "exports": {
       ".": {
         "import": "./dist/es/index.production.js",
-        "require": "./dist/cjs/index.js",
+        "require": "./dist/cjs/index.cjs",
         "types": "./dist/types/index.d.ts"
       },
       "./package.json": "./package.json",

packages/vite-plugin-react-native-lightning/src/index.ts

@@ -1,4 +1,3 @@
-import { createRequire } from 'node:module';
 import react from '@vitejs/plugin-react';
 import type { PluginOption } from 'vite';
 
@@ -24,11 +23,6 @@ type Options = {
 };
 
 const vitePlugin = (options?: Options): PluginOption => {
-  const require = createRequire(options?.cwd ?? process.cwd());
-  const reactNativeLightningPath = require.resolve(
-    '@plextv/react-native-lightning',
-  );
-
   return [
     react(options?.reactOptions),
     {
@@ -43,7 +37,7 @@ const vitePlugin = (options?: Options): PluginOption => {
         resolve: {
           extensions,
           alias: {
-            'react-native': reactNativeLightningPath,
+            'react-native': '@plextv/react-native-lightning',
           },
         },
       }),