vite-plugin-react-native 0.0.1 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +47 -65
- package/dist/index.js +42 -65
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
var path = require('path');
|
|
4
|
+
var url = require('url');
|
|
5
|
+
|
|
6
|
+
var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
|
|
7
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
8
|
+
|
|
9
|
+
var path__default = /*#__PURE__*/_interopDefault(path);
|
|
10
|
+
|
|
3
11
|
// index.ts
|
|
4
12
|
function uniqueStrings(values) {
|
|
5
13
|
const out = [];
|
|
@@ -12,17 +20,12 @@ function uniqueStrings(values) {
|
|
|
12
20
|
}
|
|
13
21
|
return out;
|
|
14
22
|
}
|
|
15
|
-
var
|
|
23
|
+
var webResolveExtensions = [
|
|
16
24
|
".web.mjs",
|
|
17
25
|
".web.js",
|
|
18
26
|
".web.ts",
|
|
19
27
|
".web.tsx",
|
|
20
28
|
".web.jsx",
|
|
21
|
-
".native.mjs",
|
|
22
|
-
".native.js",
|
|
23
|
-
".native.ts",
|
|
24
|
-
".native.tsx",
|
|
25
|
-
".native.jsx",
|
|
26
29
|
".mjs",
|
|
27
30
|
".js",
|
|
28
31
|
".ts",
|
|
@@ -30,60 +33,41 @@ var reactNativeResolveExtensions = [
|
|
|
30
33
|
".jsx",
|
|
31
34
|
".json"
|
|
32
35
|
];
|
|
33
|
-
var useLatestCallbackShimModule = `
|
|
34
|
-
import * as React from 'react';
|
|
35
|
-
const useClientLayoutEffect =
|
|
36
|
-
typeof document !== 'undefined' ||
|
|
37
|
-
(typeof navigator !== 'undefined' && navigator.product === 'ReactNative')
|
|
38
|
-
? React.useLayoutEffect
|
|
39
|
-
: React.useEffect;
|
|
40
|
-
export default function useLatestCallback(callback) {
|
|
41
|
-
const ref = React.useRef(callback);
|
|
42
|
-
const latestCallback = React.useRef(function latestCallback() {
|
|
43
|
-
return ref.current.apply(this, arguments);
|
|
44
|
-
}).current;
|
|
45
|
-
useClientLayoutEffect(() => {
|
|
46
|
-
ref.current = callback;
|
|
47
|
-
});
|
|
48
|
-
return latestCallback;
|
|
49
|
-
}
|
|
50
|
-
`;
|
|
51
|
-
function latestCallbackEsbuildShim() {
|
|
52
|
-
const namespace = "virtual-use-latest-callback";
|
|
53
|
-
return {
|
|
54
|
-
name: "use-latest-callback-esbuild-shim",
|
|
55
|
-
setup(build) {
|
|
56
|
-
build.onResolve({ filter: /^use-latest-callback$/ }, () => {
|
|
57
|
-
return { path: "use-latest-callback", namespace };
|
|
58
|
-
});
|
|
59
|
-
build.onLoad({ filter: /.*/, namespace }, () => {
|
|
60
|
-
return { contents: useLatestCallbackShimModule, loader: "js" };
|
|
61
|
-
});
|
|
62
|
-
}
|
|
63
|
-
};
|
|
64
|
-
}
|
|
65
36
|
function reactNative() {
|
|
66
37
|
const safeAreaId = "virtual:rn-safe-area-context";
|
|
67
38
|
const resolvedSafeAreaId = "\0" + safeAreaId;
|
|
68
39
|
const screensId = "virtual:rn-screens";
|
|
69
40
|
const resolvedScreensId = "\0" + screensId;
|
|
70
|
-
const
|
|
71
|
-
const
|
|
41
|
+
const pluginDir = path__default.default.dirname(url.fileURLToPath((typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('index.cjs', document.baseURI).href))));
|
|
42
|
+
const projectRoot = path__default.default.resolve(pluginDir, "..");
|
|
43
|
+
const routerDomSourceEntry = path__default.default.join(projectRoot, "node_modules/react-native-router-dom/src/index.ts");
|
|
72
44
|
return {
|
|
73
|
-
name: "
|
|
45
|
+
name: "react-native",
|
|
74
46
|
enforce: "pre",
|
|
75
47
|
config(userConfig, env) {
|
|
76
48
|
const mode = env.mode;
|
|
77
49
|
const isProd = mode === "production";
|
|
50
|
+
const userAlias = userConfig.resolve?.alias;
|
|
51
|
+
const userAliasArray = Array.isArray(userAlias) ? userAlias : userAlias && typeof userAlias === "object" ? Object.entries(userAlias).map(([find, replacement]) => ({ find, replacement })) : [];
|
|
78
52
|
const userResolveExtensions = Array.isArray(userConfig.resolve?.extensions) ? userConfig.resolve?.extensions : null;
|
|
79
53
|
const userOptimizeDepsExclude = Array.isArray(userConfig.optimizeDeps?.exclude) ? userConfig.optimizeDeps?.exclude : [];
|
|
80
54
|
const userOptimizeDepsInclude = Array.isArray(userConfig.optimizeDeps?.include) ? userConfig.optimizeDeps?.include : [];
|
|
81
|
-
const userEsbuildPlugins = Array.isArray(userConfig.optimizeDeps?.esbuildOptions?.plugins) ? userConfig.optimizeDeps?.esbuildOptions?.plugins : [];
|
|
82
55
|
const config = {
|
|
83
56
|
resolve: {
|
|
84
|
-
alias: [
|
|
57
|
+
alias: [
|
|
58
|
+
...userAliasArray,
|
|
59
|
+
{ find: /^react-native$/, replacement: "react-native-web" },
|
|
60
|
+
{ find: /^react-native-router-dom$/, replacement: routerDomSourceEntry }
|
|
61
|
+
],
|
|
85
62
|
dedupe: ["react", "react-dom"],
|
|
86
|
-
extensions: userResolveExtensions ? void 0 :
|
|
63
|
+
extensions: userResolveExtensions ? void 0 : webResolveExtensions
|
|
64
|
+
},
|
|
65
|
+
build: {
|
|
66
|
+
commonjsOptions: {
|
|
67
|
+
esmExternals: true,
|
|
68
|
+
requireReturnsDefault: "auto",
|
|
69
|
+
transformMixedEsModules: true
|
|
70
|
+
}
|
|
87
71
|
},
|
|
88
72
|
define: {
|
|
89
73
|
__DEV__: JSON.stringify(!isProd),
|
|
@@ -96,7 +80,9 @@ function reactNative() {
|
|
|
96
80
|
"react",
|
|
97
81
|
"react-dom",
|
|
98
82
|
"react/jsx-runtime",
|
|
99
|
-
"react/jsx-dev-runtime"
|
|
83
|
+
"react/jsx-dev-runtime",
|
|
84
|
+
"hoist-non-react-statics",
|
|
85
|
+
"invariant"
|
|
100
86
|
]),
|
|
101
87
|
exclude: uniqueStrings([
|
|
102
88
|
...userOptimizeDepsExclude,
|
|
@@ -104,10 +90,7 @@ function reactNative() {
|
|
|
104
90
|
"react-native-gesture-handler",
|
|
105
91
|
"react-native-safe-area-context",
|
|
106
92
|
"react-native-screens"
|
|
107
|
-
])
|
|
108
|
-
esbuildOptions: {
|
|
109
|
-
plugins: [...userEsbuildPlugins, latestCallbackEsbuildShim()]
|
|
110
|
-
}
|
|
93
|
+
])
|
|
111
94
|
}
|
|
112
95
|
};
|
|
113
96
|
return config;
|
|
@@ -115,14 +98,9 @@ function reactNative() {
|
|
|
115
98
|
resolveId(source) {
|
|
116
99
|
if (source === "react-native-safe-area-context") return resolvedSafeAreaId;
|
|
117
100
|
if (source === "react-native-screens") return resolvedScreensId;
|
|
118
|
-
if (source === "use-latest-callback") return resolvedLatestCallbackId;
|
|
119
|
-
if (source === "use-latest-callback/esm.mjs") return resolvedLatestCallbackId;
|
|
120
|
-
if (source.endsWith("use-latest-callback/lib/src/index.js")) return resolvedLatestCallbackId;
|
|
121
|
-
if (source === "./lib/src/index.js") return resolvedLatestCallbackId;
|
|
122
101
|
return null;
|
|
123
102
|
},
|
|
124
103
|
load(id) {
|
|
125
|
-
const normalizedId = id.split("?")[0];
|
|
126
104
|
if (id === resolvedSafeAreaId) {
|
|
127
105
|
return `
|
|
128
106
|
import * as React from 'react';
|
|
@@ -170,19 +148,23 @@ export function enableScreens() {}
|
|
|
170
148
|
export function screensEnabled() { return false; }
|
|
171
149
|
export function enableFreeze() {}
|
|
172
150
|
export function freezeEnabled() { return false; }
|
|
173
|
-
|
|
174
|
-
|
|
151
|
+
function withFlex1Style(style) {
|
|
152
|
+
if (!style) return [{ flex: 1 }];
|
|
153
|
+
if (Array.isArray(style)) return [{ flex: 1 }, ...style];
|
|
154
|
+
return [{ flex: 1 }, style];
|
|
155
|
+
}
|
|
156
|
+
export function Screen(props) {
|
|
157
|
+
const p = props ?? {};
|
|
158
|
+
const { style, ...rest } = p;
|
|
159
|
+
return React.createElement(View, { ...rest, style: withFlex1Style(style) });
|
|
160
|
+
}
|
|
161
|
+
export function ScreenContainer(props) {
|
|
162
|
+
const p = props ?? {};
|
|
163
|
+
const { style, ...rest } = p;
|
|
164
|
+
return React.createElement(View, { ...rest, style: withFlex1Style(style) });
|
|
165
|
+
}
|
|
175
166
|
`;
|
|
176
167
|
}
|
|
177
|
-
if (id === resolvedLatestCallbackId) {
|
|
178
|
-
return useLatestCallbackShimModule;
|
|
179
|
-
}
|
|
180
|
-
if (normalizedId.includes("/node_modules/use-latest-callback/lib/src/index.js")) {
|
|
181
|
-
return useLatestCallbackShimModule;
|
|
182
|
-
}
|
|
183
|
-
if (normalizedId.includes("/node_modules/use-latest-callback/esm.mjs")) {
|
|
184
|
-
return useLatestCallbackShimModule;
|
|
185
|
-
}
|
|
186
168
|
return null;
|
|
187
169
|
}
|
|
188
170
|
};
|
package/dist/index.js
CHANGED
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
import path from 'path';
|
|
2
|
+
import { fileURLToPath } from 'url';
|
|
3
|
+
|
|
1
4
|
// index.ts
|
|
2
5
|
function uniqueStrings(values) {
|
|
3
6
|
const out = [];
|
|
@@ -10,17 +13,12 @@ function uniqueStrings(values) {
|
|
|
10
13
|
}
|
|
11
14
|
return out;
|
|
12
15
|
}
|
|
13
|
-
var
|
|
16
|
+
var webResolveExtensions = [
|
|
14
17
|
".web.mjs",
|
|
15
18
|
".web.js",
|
|
16
19
|
".web.ts",
|
|
17
20
|
".web.tsx",
|
|
18
21
|
".web.jsx",
|
|
19
|
-
".native.mjs",
|
|
20
|
-
".native.js",
|
|
21
|
-
".native.ts",
|
|
22
|
-
".native.tsx",
|
|
23
|
-
".native.jsx",
|
|
24
22
|
".mjs",
|
|
25
23
|
".js",
|
|
26
24
|
".ts",
|
|
@@ -28,60 +26,41 @@ var reactNativeResolveExtensions = [
|
|
|
28
26
|
".jsx",
|
|
29
27
|
".json"
|
|
30
28
|
];
|
|
31
|
-
var useLatestCallbackShimModule = `
|
|
32
|
-
import * as React from 'react';
|
|
33
|
-
const useClientLayoutEffect =
|
|
34
|
-
typeof document !== 'undefined' ||
|
|
35
|
-
(typeof navigator !== 'undefined' && navigator.product === 'ReactNative')
|
|
36
|
-
? React.useLayoutEffect
|
|
37
|
-
: React.useEffect;
|
|
38
|
-
export default function useLatestCallback(callback) {
|
|
39
|
-
const ref = React.useRef(callback);
|
|
40
|
-
const latestCallback = React.useRef(function latestCallback() {
|
|
41
|
-
return ref.current.apply(this, arguments);
|
|
42
|
-
}).current;
|
|
43
|
-
useClientLayoutEffect(() => {
|
|
44
|
-
ref.current = callback;
|
|
45
|
-
});
|
|
46
|
-
return latestCallback;
|
|
47
|
-
}
|
|
48
|
-
`;
|
|
49
|
-
function latestCallbackEsbuildShim() {
|
|
50
|
-
const namespace = "virtual-use-latest-callback";
|
|
51
|
-
return {
|
|
52
|
-
name: "use-latest-callback-esbuild-shim",
|
|
53
|
-
setup(build) {
|
|
54
|
-
build.onResolve({ filter: /^use-latest-callback$/ }, () => {
|
|
55
|
-
return { path: "use-latest-callback", namespace };
|
|
56
|
-
});
|
|
57
|
-
build.onLoad({ filter: /.*/, namespace }, () => {
|
|
58
|
-
return { contents: useLatestCallbackShimModule, loader: "js" };
|
|
59
|
-
});
|
|
60
|
-
}
|
|
61
|
-
};
|
|
62
|
-
}
|
|
63
29
|
function reactNative() {
|
|
64
30
|
const safeAreaId = "virtual:rn-safe-area-context";
|
|
65
31
|
const resolvedSafeAreaId = "\0" + safeAreaId;
|
|
66
32
|
const screensId = "virtual:rn-screens";
|
|
67
33
|
const resolvedScreensId = "\0" + screensId;
|
|
68
|
-
const
|
|
69
|
-
const
|
|
34
|
+
const pluginDir = path.dirname(fileURLToPath(import.meta.url));
|
|
35
|
+
const projectRoot = path.resolve(pluginDir, "..");
|
|
36
|
+
const routerDomSourceEntry = path.join(projectRoot, "node_modules/react-native-router-dom/src/index.ts");
|
|
70
37
|
return {
|
|
71
|
-
name: "
|
|
38
|
+
name: "react-native",
|
|
72
39
|
enforce: "pre",
|
|
73
40
|
config(userConfig, env) {
|
|
74
41
|
const mode = env.mode;
|
|
75
42
|
const isProd = mode === "production";
|
|
43
|
+
const userAlias = userConfig.resolve?.alias;
|
|
44
|
+
const userAliasArray = Array.isArray(userAlias) ? userAlias : userAlias && typeof userAlias === "object" ? Object.entries(userAlias).map(([find, replacement]) => ({ find, replacement })) : [];
|
|
76
45
|
const userResolveExtensions = Array.isArray(userConfig.resolve?.extensions) ? userConfig.resolve?.extensions : null;
|
|
77
46
|
const userOptimizeDepsExclude = Array.isArray(userConfig.optimizeDeps?.exclude) ? userConfig.optimizeDeps?.exclude : [];
|
|
78
47
|
const userOptimizeDepsInclude = Array.isArray(userConfig.optimizeDeps?.include) ? userConfig.optimizeDeps?.include : [];
|
|
79
|
-
const userEsbuildPlugins = Array.isArray(userConfig.optimizeDeps?.esbuildOptions?.plugins) ? userConfig.optimizeDeps?.esbuildOptions?.plugins : [];
|
|
80
48
|
const config = {
|
|
81
49
|
resolve: {
|
|
82
|
-
alias: [
|
|
50
|
+
alias: [
|
|
51
|
+
...userAliasArray,
|
|
52
|
+
{ find: /^react-native$/, replacement: "react-native-web" },
|
|
53
|
+
{ find: /^react-native-router-dom$/, replacement: routerDomSourceEntry }
|
|
54
|
+
],
|
|
83
55
|
dedupe: ["react", "react-dom"],
|
|
84
|
-
extensions: userResolveExtensions ? void 0 :
|
|
56
|
+
extensions: userResolveExtensions ? void 0 : webResolveExtensions
|
|
57
|
+
},
|
|
58
|
+
build: {
|
|
59
|
+
commonjsOptions: {
|
|
60
|
+
esmExternals: true,
|
|
61
|
+
requireReturnsDefault: "auto",
|
|
62
|
+
transformMixedEsModules: true
|
|
63
|
+
}
|
|
85
64
|
},
|
|
86
65
|
define: {
|
|
87
66
|
__DEV__: JSON.stringify(!isProd),
|
|
@@ -94,7 +73,9 @@ function reactNative() {
|
|
|
94
73
|
"react",
|
|
95
74
|
"react-dom",
|
|
96
75
|
"react/jsx-runtime",
|
|
97
|
-
"react/jsx-dev-runtime"
|
|
76
|
+
"react/jsx-dev-runtime",
|
|
77
|
+
"hoist-non-react-statics",
|
|
78
|
+
"invariant"
|
|
98
79
|
]),
|
|
99
80
|
exclude: uniqueStrings([
|
|
100
81
|
...userOptimizeDepsExclude,
|
|
@@ -102,10 +83,7 @@ function reactNative() {
|
|
|
102
83
|
"react-native-gesture-handler",
|
|
103
84
|
"react-native-safe-area-context",
|
|
104
85
|
"react-native-screens"
|
|
105
|
-
])
|
|
106
|
-
esbuildOptions: {
|
|
107
|
-
plugins: [...userEsbuildPlugins, latestCallbackEsbuildShim()]
|
|
108
|
-
}
|
|
86
|
+
])
|
|
109
87
|
}
|
|
110
88
|
};
|
|
111
89
|
return config;
|
|
@@ -113,14 +91,9 @@ function reactNative() {
|
|
|
113
91
|
resolveId(source) {
|
|
114
92
|
if (source === "react-native-safe-area-context") return resolvedSafeAreaId;
|
|
115
93
|
if (source === "react-native-screens") return resolvedScreensId;
|
|
116
|
-
if (source === "use-latest-callback") return resolvedLatestCallbackId;
|
|
117
|
-
if (source === "use-latest-callback/esm.mjs") return resolvedLatestCallbackId;
|
|
118
|
-
if (source.endsWith("use-latest-callback/lib/src/index.js")) return resolvedLatestCallbackId;
|
|
119
|
-
if (source === "./lib/src/index.js") return resolvedLatestCallbackId;
|
|
120
94
|
return null;
|
|
121
95
|
},
|
|
122
96
|
load(id) {
|
|
123
|
-
const normalizedId = id.split("?")[0];
|
|
124
97
|
if (id === resolvedSafeAreaId) {
|
|
125
98
|
return `
|
|
126
99
|
import * as React from 'react';
|
|
@@ -168,19 +141,23 @@ export function enableScreens() {}
|
|
|
168
141
|
export function screensEnabled() { return false; }
|
|
169
142
|
export function enableFreeze() {}
|
|
170
143
|
export function freezeEnabled() { return false; }
|
|
171
|
-
|
|
172
|
-
|
|
144
|
+
function withFlex1Style(style) {
|
|
145
|
+
if (!style) return [{ flex: 1 }];
|
|
146
|
+
if (Array.isArray(style)) return [{ flex: 1 }, ...style];
|
|
147
|
+
return [{ flex: 1 }, style];
|
|
148
|
+
}
|
|
149
|
+
export function Screen(props) {
|
|
150
|
+
const p = props ?? {};
|
|
151
|
+
const { style, ...rest } = p;
|
|
152
|
+
return React.createElement(View, { ...rest, style: withFlex1Style(style) });
|
|
153
|
+
}
|
|
154
|
+
export function ScreenContainer(props) {
|
|
155
|
+
const p = props ?? {};
|
|
156
|
+
const { style, ...rest } = p;
|
|
157
|
+
return React.createElement(View, { ...rest, style: withFlex1Style(style) });
|
|
158
|
+
}
|
|
173
159
|
`;
|
|
174
160
|
}
|
|
175
|
-
if (id === resolvedLatestCallbackId) {
|
|
176
|
-
return useLatestCallbackShimModule;
|
|
177
|
-
}
|
|
178
|
-
if (normalizedId.includes("/node_modules/use-latest-callback/lib/src/index.js")) {
|
|
179
|
-
return useLatestCallbackShimModule;
|
|
180
|
-
}
|
|
181
|
-
if (normalizedId.includes("/node_modules/use-latest-callback/esm.mjs")) {
|
|
182
|
-
return useLatestCallbackShimModule;
|
|
183
|
-
}
|
|
184
161
|
return null;
|
|
185
162
|
}
|
|
186
163
|
};
|