vite-plugin-react-native-web 1.0.0 → 1.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/README.md +37 -1
- package/dist/cjs/index.js +66 -2
- package/dist/es/index.js +66 -2
- package/package.json +7 -5
package/README.md
CHANGED
|
@@ -1,2 +1,38 @@
|
|
|
1
1
|
# vite-plugin-react-native-web
|
|
2
|
-
|
|
2
|
+
|
|
3
|
+
[](https://www.npmjs.com/package/vite-plugin-react-native-web)
|
|
4
|
+
|
|
5
|
+
Add React Native Web support to Vite by removing Flow types, aliasing `react-native` to `react-native-web` and transforming .js files as .jsx files using ESBuild.
|
|
6
|
+
|
|
7
|
+
## Installation
|
|
8
|
+
|
|
9
|
+
Just install it:
|
|
10
|
+
|
|
11
|
+
```bash
|
|
12
|
+
npm i vite-plugin-react-native-web -D
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
## Usage
|
|
16
|
+
|
|
17
|
+
```typescript
|
|
18
|
+
import reactNativeWeb from "vite-plugin-react-native-web";
|
|
19
|
+
|
|
20
|
+
export default defineConfig({
|
|
21
|
+
plugins: [
|
|
22
|
+
reactNativeWeb()
|
|
23
|
+
]
|
|
24
|
+
});
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
If you are getting errors please report them in the issues section.
|
|
28
|
+
|
|
29
|
+
The following variables are transformed by the plugin:
|
|
30
|
+
- `global` is transformed to `window`
|
|
31
|
+
- `__DEV__` is transformed to `JSON.stringify(process.env.NODE_ENV === 'development')`
|
|
32
|
+
- `process.env.NODE_ENV` is transformed to `JSON.stringify(process.env.NODE_ENV)`
|
|
33
|
+
|
|
34
|
+
## Contributing
|
|
35
|
+
Please feel free to contribute to this project. Just fork it and submit a PR.
|
|
36
|
+
|
|
37
|
+
## License
|
|
38
|
+
MIT
|
package/dist/cjs/index.js
CHANGED
|
@@ -2,8 +2,72 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var vite = require('vite');
|
|
6
|
+
var flowRemoveTypes = require('flow-remove-types');
|
|
7
|
+
var fs = require('fs/promises');
|
|
6
8
|
|
|
7
|
-
|
|
9
|
+
// import type { ViteReactNativeWebOptions } from '../types'
|
|
10
|
+
const development = process.env.NODE_ENV === 'development';
|
|
11
|
+
const extensions = [
|
|
12
|
+
'.web.mjs',
|
|
13
|
+
'.mjs',
|
|
14
|
+
'.web.js',
|
|
15
|
+
'.js',
|
|
16
|
+
'.web.mts',
|
|
17
|
+
'.mts',
|
|
18
|
+
'.web.ts',
|
|
19
|
+
'.ts',
|
|
20
|
+
'.web.jsx',
|
|
21
|
+
'.jsx',
|
|
22
|
+
'.web.tsx',
|
|
23
|
+
'.tsx',
|
|
24
|
+
'.json',
|
|
25
|
+
];
|
|
26
|
+
const loader = {
|
|
27
|
+
'.js': 'jsx',
|
|
28
|
+
};
|
|
29
|
+
const filter = /\.(js|flow)$/;
|
|
30
|
+
const esbuildPlugin = () => ({
|
|
31
|
+
name: 'react-native-web',
|
|
32
|
+
setup: build => {
|
|
33
|
+
build.onLoad({ filter }, async ({ path }) => {
|
|
34
|
+
const src = await fs.readFile(path, 'utf-8');
|
|
35
|
+
return {
|
|
36
|
+
contents: flowRemoveTypes(src).toString(),
|
|
37
|
+
loader: loader['.js'],
|
|
38
|
+
};
|
|
39
|
+
});
|
|
40
|
+
},
|
|
41
|
+
});
|
|
42
|
+
const reactNativeWeb = ( /*options: ViteReactNativeWebOptions = {}*/) => ({
|
|
43
|
+
enforce: 'pre',
|
|
44
|
+
name: 'react-native-web',
|
|
45
|
+
config: () => ({
|
|
46
|
+
define: {
|
|
47
|
+
global: 'window',
|
|
48
|
+
__DEV__: JSON.stringify(development),
|
|
49
|
+
'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
|
|
50
|
+
},
|
|
51
|
+
resolve: {
|
|
52
|
+
extensions,
|
|
53
|
+
alias: [{ find: 'react-native', replacement: 'react-native-web' }],
|
|
54
|
+
},
|
|
55
|
+
optimizeDeps: {
|
|
56
|
+
esbuildOptions: {
|
|
57
|
+
plugins: [esbuildPlugin()],
|
|
58
|
+
resolveExtensions: extensions,
|
|
59
|
+
},
|
|
60
|
+
},
|
|
61
|
+
}),
|
|
62
|
+
async transform(code, id) {
|
|
63
|
+
if (!filter.test(id))
|
|
64
|
+
return code;
|
|
65
|
+
if (code.includes('@flow'))
|
|
66
|
+
code = flowRemoveTypes(code).toString();
|
|
67
|
+
return (await vite.transformWithEsbuild(code, id, { loader: loader['.js'] })).code;
|
|
68
|
+
},
|
|
69
|
+
});
|
|
70
|
+
|
|
71
|
+
exports.default = reactNativeWeb;
|
|
8
72
|
module.exports = Object.assign(exports.default, exports);
|
|
9
73
|
//# sourceMappingURL=index.js.map
|
package/dist/es/index.js
CHANGED
|
@@ -1,4 +1,68 @@
|
|
|
1
|
-
|
|
1
|
+
import { transformWithEsbuild } from 'vite';
|
|
2
|
+
import flowRemoveTypes from 'flow-remove-types';
|
|
3
|
+
import fs from 'fs/promises';
|
|
2
4
|
|
|
3
|
-
|
|
5
|
+
// import type { ViteReactNativeWebOptions } from '../types'
|
|
6
|
+
const development = process.env.NODE_ENV === 'development';
|
|
7
|
+
const extensions = [
|
|
8
|
+
'.web.mjs',
|
|
9
|
+
'.mjs',
|
|
10
|
+
'.web.js',
|
|
11
|
+
'.js',
|
|
12
|
+
'.web.mts',
|
|
13
|
+
'.mts',
|
|
14
|
+
'.web.ts',
|
|
15
|
+
'.ts',
|
|
16
|
+
'.web.jsx',
|
|
17
|
+
'.jsx',
|
|
18
|
+
'.web.tsx',
|
|
19
|
+
'.tsx',
|
|
20
|
+
'.json',
|
|
21
|
+
];
|
|
22
|
+
const loader = {
|
|
23
|
+
'.js': 'jsx',
|
|
24
|
+
};
|
|
25
|
+
const filter = /\.(js|flow)$/;
|
|
26
|
+
const esbuildPlugin = () => ({
|
|
27
|
+
name: 'react-native-web',
|
|
28
|
+
setup: build => {
|
|
29
|
+
build.onLoad({ filter }, async ({ path }) => {
|
|
30
|
+
const src = await fs.readFile(path, 'utf-8');
|
|
31
|
+
return {
|
|
32
|
+
contents: flowRemoveTypes(src).toString(),
|
|
33
|
+
loader: loader['.js'],
|
|
34
|
+
};
|
|
35
|
+
});
|
|
36
|
+
},
|
|
37
|
+
});
|
|
38
|
+
const reactNativeWeb = ( /*options: ViteReactNativeWebOptions = {}*/) => ({
|
|
39
|
+
enforce: 'pre',
|
|
40
|
+
name: 'react-native-web',
|
|
41
|
+
config: () => ({
|
|
42
|
+
define: {
|
|
43
|
+
global: 'window',
|
|
44
|
+
__DEV__: JSON.stringify(development),
|
|
45
|
+
'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
|
|
46
|
+
},
|
|
47
|
+
resolve: {
|
|
48
|
+
extensions,
|
|
49
|
+
alias: [{ find: 'react-native', replacement: 'react-native-web' }],
|
|
50
|
+
},
|
|
51
|
+
optimizeDeps: {
|
|
52
|
+
esbuildOptions: {
|
|
53
|
+
plugins: [esbuildPlugin()],
|
|
54
|
+
resolveExtensions: extensions,
|
|
55
|
+
},
|
|
56
|
+
},
|
|
57
|
+
}),
|
|
58
|
+
async transform(code, id) {
|
|
59
|
+
if (!filter.test(id))
|
|
60
|
+
return code;
|
|
61
|
+
if (code.includes('@flow'))
|
|
62
|
+
code = flowRemoveTypes(code).toString();
|
|
63
|
+
return (await transformWithEsbuild(code, id, { loader: loader['.js'] })).code;
|
|
64
|
+
},
|
|
65
|
+
});
|
|
66
|
+
|
|
67
|
+
export { reactNativeWeb as default };
|
|
4
68
|
//# sourceMappingURL=index.js.map
|
package/package.json
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "vite-plugin-react-native-web",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.2",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
7
7
|
"description": "React Native Web support for Vite",
|
|
8
8
|
"license": "MIT",
|
|
9
9
|
"repository": {
|
|
10
|
-
"url": "Bram-dc/vite-plugin-react-native-web"
|
|
10
|
+
"url": "git+https://github.com/Bram-dc/vite-plugin-react-native-web.git"
|
|
11
11
|
},
|
|
12
12
|
"author": "Bram del Canho",
|
|
13
13
|
"homepage": "https://github.com/Bram-dc/vite-plugin-react-native-web#readme",
|
|
@@ -24,8 +24,8 @@
|
|
|
24
24
|
},
|
|
25
25
|
"scripts": {
|
|
26
26
|
"build": "rollup -c",
|
|
27
|
-
"prerelease": "npm build",
|
|
28
|
-
"release": "npm
|
|
27
|
+
"prerelease": "npm run build",
|
|
28
|
+
"release": "npm publish"
|
|
29
29
|
},
|
|
30
30
|
"files": [
|
|
31
31
|
"dist",
|
|
@@ -44,10 +44,12 @@
|
|
|
44
44
|
"flow-remove-types": "^2.233.0"
|
|
45
45
|
},
|
|
46
46
|
"devDependencies": {
|
|
47
|
+
"@rollup/plugin-typescript": "^11.1.6",
|
|
47
48
|
"@types/node": "^20.12.4",
|
|
48
49
|
"rollup": "^4.14.0",
|
|
50
|
+
"tslib": "^2.6.2",
|
|
49
51
|
"typescript": "^5.4.4",
|
|
50
52
|
"vite": "^5.2.8"
|
|
51
53
|
},
|
|
52
54
|
"types": "./types/index.d.ts"
|
|
53
|
-
}
|
|
55
|
+
}
|