chore: import upstream snapshot with attribution
This commit is contained in:
wehub-resource-sync
@@ -0,0 +1,81 @@
|
||||
`project.json`:
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "mobile",
|
||||
//...
|
||||
"targets": {
|
||||
//...
|
||||
"build-android": {
|
||||
"executor": "@nx/react-native:build-android",
|
||||
"outputs": [
|
||||
"{projectRoot}/build/outputs/bundle",
|
||||
"{projectRoot}/build/outputs/apk"
|
||||
],
|
||||
"options": {}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx run mobile:build-android
|
||||
```
|
||||
|
||||
## Examples
|
||||
|
||||
##### Build with custom tasks
|
||||
|
||||
The `tasks` option accepts any custom gradle task, such as `assembleDebug`, `assembleRelease`, `bundleDebug`, `bundleRelease`, `installDebug`, `installRelease`.
|
||||
For example, pass in `bundleRelease` or `bundleRelease` to tasks, it will create with `.aab` extension under bundle folder.
|
||||
Pass in `assembleDebug` or `assembleRelease` to tasks, it will create a build with `.apk` extension under apk folder.
|
||||
Pass in `installDebug` or `installRelease` to tasks, it will create a build with `.apk` extension and immediately install it on a running emulator or connected device.
|
||||
|
||||
```json
|
||||
"build-android": {
|
||||
"executor": "@nx/react-native:build-android",
|
||||
"outputs": [
|
||||
"{projectRoot}/build/outputs/bundle",
|
||||
"{projectRoot}/build/outputs/apk"
|
||||
],
|
||||
"options": {
|
||||
"tasks": ["bundleRelease"]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
##### Build for debug/release
|
||||
|
||||
The `mode` option allows you determine whether to build for debug/release apk.
|
||||
|
||||
```json
|
||||
"build-android": {
|
||||
"executor": "@nx/react-native:build-android",
|
||||
"outputs": [
|
||||
"{projectRoot}/build/outputs/bundle",
|
||||
"{projectRoot}/build/outputs/apk"
|
||||
],
|
||||
"options": {
|
||||
"mode": "debug"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
##### Build for current device architecture
|
||||
|
||||
The `activeArchOnly` option allows you to build native libraries only for the current device architecture for debug builds.
|
||||
|
||||
```json
|
||||
"build-android": {
|
||||
"executor": "@nx/react-native:build-android",
|
||||
"outputs": [
|
||||
"{projectRoot}/build/outputs/bundle",
|
||||
"{projectRoot}/build/outputs/apk"
|
||||
],
|
||||
"options": {
|
||||
"activeArchOnly": true
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
@@ -0,0 +1,127 @@
|
||||
`project.json`:
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "mobile",
|
||||
//...
|
||||
"targets": {
|
||||
//...
|
||||
"build-ios": {
|
||||
"executor": "@nx/react-native:build-ios",
|
||||
"options": {}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx run mobile:build-ios
|
||||
```
|
||||
|
||||
## Examples
|
||||
|
||||
##### Build in Specific Location
|
||||
|
||||
The `buildFolder` option allows to specify the location for ios build artifacts. It corresponds to Xcode's -derivedDataPath.
|
||||
|
||||
```json
|
||||
"build-ios": {
|
||||
"executor": "@nx/react-native:build-ios",
|
||||
"options": {
|
||||
"buildFolder": "dist/ios/build"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx build-ios <app-name> --buildFolder=dist/ios/build
|
||||
```
|
||||
|
||||
##### Build the Debug/Release app
|
||||
|
||||
The `mode` option allows to specify the xcode configuartion, such as `Debug` or `Release`.
|
||||
|
||||
```json
|
||||
"build-ios": {
|
||||
"executor": "@nx/react-native:build-ios",
|
||||
"options": {
|
||||
"mode": "Release"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx build-ios <app-name> --mode=Debug
|
||||
nx build-ios <app-name> --mode=Release
|
||||
```
|
||||
|
||||
##### Build for a simulator
|
||||
|
||||
The `simulator` option allows you to launch your iOS app in a specific simulator:
|
||||
|
||||
To see all the available simulators, run command:
|
||||
|
||||
```bash
|
||||
xcrun simctl list devices available
|
||||
```
|
||||
|
||||
```json
|
||||
"build-ios": {
|
||||
"executor": "@nx/react-native:build-ios",
|
||||
"options": {
|
||||
"simulator": "iPhone 14 Pro"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx build-ios <app-name> --simulator="iPhone 14 Pro"
|
||||
```
|
||||
|
||||
##### Build for a device
|
||||
|
||||
The `device` option allows you to launch your iOS app in a specific device.
|
||||
|
||||
To see all the available device, run command:
|
||||
|
||||
```bash
|
||||
xcrun simctl list devices available
|
||||
```
|
||||
|
||||
```json
|
||||
"build-ios": {
|
||||
"executor": "@nx/react-native:build-ios",
|
||||
"options": {
|
||||
"device": "deviceName"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx build-ios <app-name> --device="deviceName"
|
||||
```
|
||||
|
||||
##### Set Device by udid
|
||||
|
||||
The `udid` option allows you to explicitly set device to use by udid.
|
||||
|
||||
To see all the available simulators and devices with udid, run command:
|
||||
|
||||
```bash
|
||||
xcrun simctl list devices available
|
||||
```
|
||||
|
||||
```json
|
||||
"build-ios": {
|
||||
"executor": "@nx/react-native:build-ios",
|
||||
"options": {
|
||||
"udid": "device udid"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx build-ios <app-name> --udid="device udid"
|
||||
```
|
||||
|
||||
---
|
||||
@@ -0,0 +1,112 @@
|
||||
`project.json`:
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "mobile",
|
||||
//...
|
||||
"targets": {
|
||||
//...
|
||||
"bundle-ios": {
|
||||
"executor": "@nx/react-native:bundle",
|
||||
"outputs": ["{projectRoot}/build"],
|
||||
"options": {
|
||||
"entryFile": "src/main.tsx",
|
||||
"platform": "ios",
|
||||
"bundleOutput": "dist/apps/mobile/ios/main.jsbundle"
|
||||
}
|
||||
},
|
||||
"bundle-android": {
|
||||
"executor": "@nx/react-native:bundle",
|
||||
"options": {
|
||||
"entryFile": "src/main.tsx",
|
||||
"platform": "android",
|
||||
"bundleOutput": "dist/apps/mobile/android/main.jsbundle"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx run mobile:bundle-ios
|
||||
nx run mobile:bundle-android
|
||||
```
|
||||
|
||||
## Examples
|
||||
|
||||
##### Bundle with sourcemap
|
||||
|
||||
The `sourcemapOutput` option allows you to specify the path of the source map relative to app folder:
|
||||
|
||||
```json
|
||||
"bundle-ios": {
|
||||
"executor": "@nx/react-native:bundle",
|
||||
"options": {
|
||||
"entryFile": "src/main.tsx",
|
||||
"platform": "ios",
|
||||
"bundleOutput": "dist/apps/mobile/ios/main.jsbundle",
|
||||
"sourcemapOutput": "../../dist/apps/mobile/ios/main.map",
|
||||
}
|
||||
},
|
||||
"bundle-android": {
|
||||
"executor": "@nx/react-native:bundle",
|
||||
"options": {
|
||||
"entryFile": "src/main.tsx",
|
||||
"platform": "android",
|
||||
"bundleOutput": "dist/apps/mobile/android/main.jsbundle",
|
||||
"sourcemapOutput": "../../dist/apps/mobile/android/main.map",
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
##### Create a dev/release bundle
|
||||
|
||||
The `dev` option determines whether to create a dev or release bundle. The default value is `true`, by setting it as `false`, warnings are disabled and the bundle is minified.
|
||||
|
||||
```json
|
||||
"bundle-ios": {
|
||||
"executor": "@nx/react-native:bundle",
|
||||
"options": {
|
||||
"entryFile": "src/main.tsx",
|
||||
"platform": "ios",
|
||||
"bundleOutput": "dist/apps/mobile/ios/main.jsbundle",
|
||||
"dev": false
|
||||
}
|
||||
},
|
||||
"bundle-android": {
|
||||
"executor": "@nx/react-native:bundle",
|
||||
"options": {
|
||||
"entryFile": "src/main.tsx",
|
||||
"platform": "android",
|
||||
"bundleOutput": "dist/apps/mobile/android/main.jsbundle",
|
||||
"dev": false
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
##### Create a minified bundle
|
||||
|
||||
The `minify` option allows you to create a minified bundle:
|
||||
|
||||
```json
|
||||
"bundle-ios": {
|
||||
"executor": "@nx/react-native:bundle",
|
||||
"options": {
|
||||
"entryFile": "src/main.tsx",
|
||||
"platform": "ios",
|
||||
"bundleOutput": "dist/apps/mobile/ios/main.jsbundle",
|
||||
"minify": true
|
||||
}
|
||||
},
|
||||
"bundle-android": {
|
||||
"executor": "@nx/react-native:bundle",
|
||||
"options": {
|
||||
"entryFile": "src/main.tsx",
|
||||
"platform": "android",
|
||||
"bundleOutput": "dist/apps/mobile/android/main.jsbundle",
|
||||
"minify": true
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
@@ -0,0 +1,55 @@
|
||||
`project.json`:
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "mobile",
|
||||
//...
|
||||
"targets": {
|
||||
//...
|
||||
"run-android": {
|
||||
"executor": "@nx/react-native:run-android",
|
||||
"options": {}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx run mobile:run-android
|
||||
```
|
||||
|
||||
## Examples
|
||||
|
||||
##### Run on a specific device/simulator
|
||||
|
||||
To see all the available emulators, run command:
|
||||
|
||||
```bash
|
||||
emulator -list-avds
|
||||
```
|
||||
|
||||
The `deviceId` option allows you to launch your android app in a specific device/simulator:
|
||||
|
||||
```json
|
||||
"run-android": {
|
||||
"executor": "@nx/react-native:run-android",
|
||||
"options": {
|
||||
"deviceId": "Pixel_5_API_30"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
##### Run the debug/release app
|
||||
|
||||
The `mode` option allows to specify the build variant, such as `debug` or `release`.
|
||||
|
||||
```json
|
||||
"run-android": {
|
||||
"executor": "@nx/react-native:run-android",
|
||||
"options": {
|
||||
"mode": "release"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
@@ -0,0 +1,109 @@
|
||||
`project.json`:
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "mobile",
|
||||
//...
|
||||
"targets": {
|
||||
//...
|
||||
"run-ios": {
|
||||
"executor": "@nx/react-native:run-ios",
|
||||
"options": {}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx run mobile:run-ios
|
||||
```
|
||||
|
||||
## Examples
|
||||
|
||||
##### Build the Debug/Release app
|
||||
|
||||
The `mode` option allows to specify the xcode configuartion schema, such as `Debug` or `Release`.
|
||||
|
||||
```json
|
||||
"run-ios": {
|
||||
"executor": "@nx/react-native:run-ios",
|
||||
"options": {
|
||||
"mode": "Release"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx run-ios <app-name> --mode=Debug
|
||||
```
|
||||
|
||||
##### Run on a simulator
|
||||
|
||||
The `simulator` option allows you to launch your iOS app in a specific simulator.
|
||||
|
||||
To see all the available simulators, run command:
|
||||
|
||||
```bash
|
||||
xcrun simctl list devices available
|
||||
```
|
||||
|
||||
```json
|
||||
"run-ios": {
|
||||
"executor": "@nx/react-native:run-ios",
|
||||
"options": {
|
||||
"simulator": "iPhone 14 Pro (16.2)"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx run-ios <app-name> --simulator="iPhone 14 Pro (16.2)"
|
||||
```
|
||||
|
||||
##### Run on a device
|
||||
|
||||
The `device` option allows you to launch your iOS app in a specific device.
|
||||
|
||||
To see all the available devices, run command:
|
||||
|
||||
```bash
|
||||
xcrun simctl list devices available
|
||||
```
|
||||
|
||||
```json
|
||||
"run-ios": {
|
||||
"executor": "@nx/react-native:run-ios",
|
||||
"options": {
|
||||
"device": "deviceName"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx run-ios <app-name> --device="deviceName"
|
||||
```
|
||||
|
||||
##### Set Device by udid
|
||||
|
||||
The `udid` option allows you to explicitly set device to use by udid.
|
||||
|
||||
To see all the available simulators and devices with udid, run command:
|
||||
|
||||
```bash
|
||||
xcrun simctl list devices available
|
||||
```
|
||||
|
||||
```json
|
||||
"run-ios": {
|
||||
"executor": "@nx/react-native:run-ios",
|
||||
"options": {
|
||||
"udid": "device udid"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx run-ios <app-name> --udid="device udid"
|
||||
```
|
||||
|
||||
---
|
||||
@@ -0,0 +1,53 @@
|
||||
`project.json`:
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "mobile",
|
||||
//...
|
||||
"targets": {
|
||||
//...
|
||||
"start": {
|
||||
"executor": "@nx/react-native:start",
|
||||
"options": {
|
||||
"port": 8081
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```bash
|
||||
nx run mobile:start
|
||||
```
|
||||
|
||||
## Examples
|
||||
|
||||
##### Starts the server non-interactively
|
||||
|
||||
The `interactive` option allows you to specify whether to use interactive mode:
|
||||
|
||||
```json
|
||||
"start": {
|
||||
"executor": "@nx/react-native:start",
|
||||
"options": {
|
||||
"port": 8081,
|
||||
"interactive": false
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
##### Starts the server with cache reset
|
||||
|
||||
The `resetCache` option allows you to remove cached files.
|
||||
|
||||
```json
|
||||
"start": {
|
||||
"executor": "@nx/react-native:start",
|
||||
"options": {
|
||||
"port": 8081,
|
||||
"resetCache": true
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
@@ -0,0 +1,61 @@
|
||||
This generator will set up Storybook for your **React Native** project.
|
||||
|
||||
```bash
|
||||
nx g @nx/react-native:storybook-configuration project-name
|
||||
```
|
||||
|
||||
When running this generator, you will be prompted to provide the following:
|
||||
|
||||
- The `name` of the project you want to generate the configuration for.
|
||||
- Whether you want to set up [Storybook interaction tests](https://storybook.js.org/docs/react/writing-tests/interaction-testing) (`interactionTests`). If you choose `yes`, a `play` function will be added to your stories, and all the necessary dependencies will be installed. Also, a `test-storybook` target will be generated in your project's `project.json`, with a command to invoke the [Storybook `test-runner`](https://storybook.js.org/docs/react/writing-tests/test-runner). You can read more about this in the [Nx Storybook interaction tests documentation page](/recipes/storybook/storybook-interaction-tests#setup-storybook-interaction-tests)..
|
||||
- Whether you want to `generateStories` for the components in your project. If you choose `yes`, a `.stories.ts` file will be generated next to each of your components in your project.
|
||||
|
||||
You must provide a `name` for the generator to work.
|
||||
|
||||
By default, this generator will also set up [Storybook interaction tests](https://storybook.js.org/docs/react/writing-tests/interaction-testing). If you don't want to set up Storybook interaction tests, you can pass the `--interactionTests=false` option, but it's not recommended.
|
||||
|
||||
There are a number of other options available. Let's take a look at some examples.
|
||||
|
||||
## Examples
|
||||
|
||||
### Generate Storybook configuration
|
||||
|
||||
```bash
|
||||
nx g @nx/react-native:storybook-configuration ui
|
||||
```
|
||||
|
||||
This will generate Storybook configuration for the `ui` project using TypeScript for the Storybook configuration files (the files inside the `.storybook` directory, eg. `.storybook/main.ts`).
|
||||
|
||||
### Ignore certain paths when generating stories
|
||||
|
||||
```bash
|
||||
nx g @nx/react-native:storybook-configuration ui --generateStories=true --ignorePaths=libs/ui/src/not-stories/**,**/**/src/**/*.other.*,apps/my-app/**/*.something.ts
|
||||
```
|
||||
|
||||
This will generate a Storybook configuration for the `ui` project and generate stories for all components in the `libs/ui/src/lib` directory, except for the ones in the `libs/ui/src/not-stories` directory, and the ones in the `apps/my-app` directory that end with `.something.ts`, and also for components that their file name is of the pattern `*.other.*`.
|
||||
|
||||
This is useful if you have a project that contains components that are not meant to be used in isolation, but rather as part of a larger component.
|
||||
|
||||
By default, Nx will ignore the following paths:
|
||||
|
||||
```text
|
||||
*.stories.ts, *.stories.tsx, *.stories.js, *.stories.jsx, *.stories.mdx
|
||||
```
|
||||
|
||||
but you can change this behaviour easily, as explained above.
|
||||
|
||||
### Generate stories using JavaScript instead of TypeScript
|
||||
|
||||
```bash
|
||||
nx g @nx/react-native:storybook-configuration ui --generateStories=true --js=true
|
||||
```
|
||||
|
||||
This will generate stories for all the components in the `ui` project using JavaScript instead of TypeScript. So, you will have `.stories.js` files next to your components.
|
||||
|
||||
### Generate Storybook configuration using JavaScript
|
||||
|
||||
```bash
|
||||
nx g @nx/react-native:storybook-configuration ui --tsConfiguration=false
|
||||
```
|
||||
|
||||
By default, our generator generates TypeScript Storybook configuration files. You can choose to use JavaScript for the Storybook configuration files of your project (the files inside the `.storybook` directory, eg. `.storybook/main.js`).
|
||||
Reference in New Issue
Block a user