vite-plugin-react-native-web 2.0.2 → 2.1.1

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.
Files changed (3) hide show
  1. package/dist/cjs/index.js +33 -35
  2. package/dist/es/index.js +33 -35
  3. package/package.json +8 -8
package/dist/cjs/index.js CHANGED
@@ -9,59 +9,54 @@ var vite = require('vite');
9
9
  // import type { ViteReactNativeWebOptions } from '../types'
10
10
  const development = process.env.NODE_ENV === 'development';
11
11
  const extensions = [
12
+ // ⚠️ This currently does not work as expected (https://github.com/evanw/esbuild/issues/4053)
13
+ // '.web.mjs',
14
+ // '.mjs',
15
+ // '.web.js',
16
+ // '.js',
17
+ // '.web.mts',
18
+ // '.mts',
19
+ // '.web.ts',
20
+ // '.ts',
21
+ // '.web.jsx',
22
+ // '.jsx',
23
+ // '.web.tsx',
24
+ // '.tsx',
25
+ // '.json',
26
+ // ⚠️ Temporary fix
12
27
  '.web.mjs',
13
- '.mjs',
14
28
  '.web.js',
15
- '.js',
16
29
  '.web.mts',
17
- '.mts',
18
30
  '.web.ts',
19
- '.ts',
20
31
  '.web.jsx',
21
- '.jsx',
22
32
  '.web.tsx',
33
+ '.mjs',
34
+ '.js',
35
+ '.mts',
36
+ '.ts',
37
+ '.jsx',
23
38
  '.tsx',
24
39
  '.json',
25
40
  ];
26
- const scriptPathPattern = /\.(js|jsx|ts|tsx|flow)$/;
27
- const nativeLegacyScriptPathPattern = /\.(js|flow)$/;
41
+ const reactNativeFlowJsxPathPattern = /\.(js|flow)$/;
42
+ const reactNativeFlowJsxLoader = 'jsx';
28
43
  const flowPragmaPattern = /@flow\b/;
29
44
  const useClientPragmaPattern = /['"]use client['"]/;
30
45
  const jsxElementPattern = /<([A-Za-z][A-Za-z0-9]*)\b[^>]*>([\s\S]*?)<\/\1>/;
31
46
  const jsxSelfClosingPattern = /<([A-Za-z][A-Za-z0-9]*)\b[^>]*\/?>/;
32
47
  const jsxFragmentPattern = /<>([\s\S]*?)<\/>/;
33
- const loaders = {
34
- '.js': 'jsx',
35
- '.flow': 'jsx',
36
- };
37
- const getLoader = (path) => {
38
- const ext = `.${path.split('.').pop()}`;
39
- if (ext in loaders) {
40
- return loaders[ext];
41
- }
42
- return 'default';
43
- };
44
48
  const esbuildPlugin = () => ({
45
49
  name: 'react-native-web',
46
50
  setup: (build) => {
47
- build.onLoad({ filter: scriptPathPattern }, async (args) => {
48
- let path = args.path;
49
- // We need to manually resolve .web files since the resolveExtensions option does not seem to work properly.
50
- const webPath = args.path.replace(/(\.[^/.]+)$/, '.web$1');
51
- try {
52
- await fs.access(webPath);
53
- path = webPath;
54
- }
55
- catch { }
56
- let contents = await fs.readFile(path, 'utf-8');
57
- const loader = getLoader(path);
58
- if (nativeLegacyScriptPathPattern.test(path) && flowPragmaPattern.test(contents)) {
51
+ build.onLoad({ filter: reactNativeFlowJsxPathPattern }, async (args) => {
52
+ let contents = await fs.readFile(args.path, 'utf-8');
53
+ if (flowPragmaPattern.test(contents)) {
59
54
  const transformed = flowRemoveTypes(contents);
60
55
  contents = transformed.toString();
61
56
  }
62
57
  return {
63
58
  contents,
64
- loader,
59
+ loader: reactNativeFlowJsxLoader,
65
60
  };
66
61
  });
67
62
  },
@@ -88,19 +83,22 @@ const reactNativeWeb = ( /*options: ViteReactNativeWebOptions = {}*/) => ({
88
83
  }),
89
84
  async transform(code, id) {
90
85
  id = id.split('?')[0];
91
- if (!nativeLegacyScriptPathPattern.test(id)) {
86
+ if (!reactNativeFlowJsxPathPattern.test(id)) {
92
87
  return;
93
88
  }
94
89
  let map = null;
95
90
  if (flowPragmaPattern.test(code)) {
96
91
  const transformed = flowRemoveTypes(code);
97
92
  code = transformed.toString();
98
- map = transformed.generateMap();
93
+ map = {
94
+ file: id,
95
+ toUrl: () => id,
96
+ ...transformed.generateMap(),
97
+ };
99
98
  }
100
99
  if (jsxElementPattern.test(code) || jsxSelfClosingPattern.test(code) || jsxFragmentPattern.test(code)) {
101
- const loader = getLoader(id);
102
100
  const result = await vite.transformWithEsbuild(code, id, {
103
- loader,
101
+ loader: reactNativeFlowJsxLoader,
104
102
  tsconfigRaw: {
105
103
  compilerOptions: {
106
104
  jsx: 'react-jsx',
package/dist/es/index.js CHANGED
@@ -5,59 +5,54 @@ import { transformWithEsbuild } from 'vite';
5
5
  // import type { ViteReactNativeWebOptions } from '../types'
6
6
  const development = process.env.NODE_ENV === 'development';
7
7
  const extensions = [
8
+ // ⚠️ This currently does not work as expected (https://github.com/evanw/esbuild/issues/4053)
9
+ // '.web.mjs',
10
+ // '.mjs',
11
+ // '.web.js',
12
+ // '.js',
13
+ // '.web.mts',
14
+ // '.mts',
15
+ // '.web.ts',
16
+ // '.ts',
17
+ // '.web.jsx',
18
+ // '.jsx',
19
+ // '.web.tsx',
20
+ // '.tsx',
21
+ // '.json',
22
+ // ⚠️ Temporary fix
8
23
  '.web.mjs',
9
- '.mjs',
10
24
  '.web.js',
11
- '.js',
12
25
  '.web.mts',
13
- '.mts',
14
26
  '.web.ts',
15
- '.ts',
16
27
  '.web.jsx',
17
- '.jsx',
18
28
  '.web.tsx',
29
+ '.mjs',
30
+ '.js',
31
+ '.mts',
32
+ '.ts',
33
+ '.jsx',
19
34
  '.tsx',
20
35
  '.json',
21
36
  ];
22
- const scriptPathPattern = /\.(js|jsx|ts|tsx|flow)$/;
23
- const nativeLegacyScriptPathPattern = /\.(js|flow)$/;
37
+ const reactNativeFlowJsxPathPattern = /\.(js|flow)$/;
38
+ const reactNativeFlowJsxLoader = 'jsx';
24
39
  const flowPragmaPattern = /@flow\b/;
25
40
  const useClientPragmaPattern = /['"]use client['"]/;
26
41
  const jsxElementPattern = /<([A-Za-z][A-Za-z0-9]*)\b[^>]*>([\s\S]*?)<\/\1>/;
27
42
  const jsxSelfClosingPattern = /<([A-Za-z][A-Za-z0-9]*)\b[^>]*\/?>/;
28
43
  const jsxFragmentPattern = /<>([\s\S]*?)<\/>/;
29
- const loaders = {
30
- '.js': 'jsx',
31
- '.flow': 'jsx',
32
- };
33
- const getLoader = (path) => {
34
- const ext = `.${path.split('.').pop()}`;
35
- if (ext in loaders) {
36
- return loaders[ext];
37
- }
38
- return 'default';
39
- };
40
44
  const esbuildPlugin = () => ({
41
45
  name: 'react-native-web',
42
46
  setup: (build) => {
43
- build.onLoad({ filter: scriptPathPattern }, async (args) => {
44
- let path = args.path;
45
- // We need to manually resolve .web files since the resolveExtensions option does not seem to work properly.
46
- const webPath = args.path.replace(/(\.[^/.]+)$/, '.web$1');
47
- try {
48
- await fs.access(webPath);
49
- path = webPath;
50
- }
51
- catch { }
52
- let contents = await fs.readFile(path, 'utf-8');
53
- const loader = getLoader(path);
54
- if (nativeLegacyScriptPathPattern.test(path) && flowPragmaPattern.test(contents)) {
47
+ build.onLoad({ filter: reactNativeFlowJsxPathPattern }, async (args) => {
48
+ let contents = await fs.readFile(args.path, 'utf-8');
49
+ if (flowPragmaPattern.test(contents)) {
55
50
  const transformed = flowRemoveTypes(contents);
56
51
  contents = transformed.toString();
57
52
  }
58
53
  return {
59
54
  contents,
60
- loader,
55
+ loader: reactNativeFlowJsxLoader,
61
56
  };
62
57
  });
63
58
  },
@@ -84,19 +79,22 @@ const reactNativeWeb = ( /*options: ViteReactNativeWebOptions = {}*/) => ({
84
79
  }),
85
80
  async transform(code, id) {
86
81
  id = id.split('?')[0];
87
- if (!nativeLegacyScriptPathPattern.test(id)) {
82
+ if (!reactNativeFlowJsxPathPattern.test(id)) {
88
83
  return;
89
84
  }
90
85
  let map = null;
91
86
  if (flowPragmaPattern.test(code)) {
92
87
  const transformed = flowRemoveTypes(code);
93
88
  code = transformed.toString();
94
- map = transformed.generateMap();
89
+ map = {
90
+ file: id,
91
+ toUrl: () => id,
92
+ ...transformed.generateMap(),
93
+ };
95
94
  }
96
95
  if (jsxElementPattern.test(code) || jsxSelfClosingPattern.test(code) || jsxFragmentPattern.test(code)) {
97
- const loader = getLoader(id);
98
96
  const result = await transformWithEsbuild(code, id, {
99
- loader,
97
+ loader: reactNativeFlowJsxLoader,
100
98
  tsconfigRaw: {
101
99
  compilerOptions: {
102
100
  jsx: 'react-jsx',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vite-plugin-react-native-web",
3
- "version": "2.0.2",
3
+ "version": "2.1.1",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -42,16 +42,16 @@
42
42
  "react-native-web"
43
43
  ],
44
44
  "dependencies": {
45
- "flow-remove-types": "^2.233.0"
45
+ "flow-remove-types": "^2.259.1"
46
46
  },
47
47
  "devDependencies": {
48
48
  "@biomejs/biome": "^1.9.4",
49
- "@rollup/plugin-typescript": "^11.1.6",
50
- "@types/node": "^20.12.4",
51
- "rollup": "^4.14.0",
52
- "tslib": "^2.6.2",
53
- "typescript": "^5.4.4",
54
- "vite": "^5.2.8"
49
+ "@rollup/plugin-typescript": "^12.1.2",
50
+ "@types/node": "^22.10.10",
51
+ "rollup": "^4.32.0",
52
+ "tslib": "^2.8.1",
53
+ "typescript": "^5.7.3",
54
+ "vite": "^6.0.11"
55
55
  },
56
56
  "types": "./types/index.d.ts"
57
57
  }