Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
44 commits
Select commit Hold shift + click to select a range
b3b09ef
Improve handling of files in monorepo
grabbou Oct 3, 2019
440f166
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
1ffc0c2
Remove note about monorepo from the docs
grabbou Oct 3, 2019
391505d
wat
grabbou Oct 3, 2019
e0722c3
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
f85186f
Fix Ruby tests
grabbou Oct 3, 2019
435d314
Always resolve correct root
grabbou Oct 4, 2019
78065e0
Move files around
grabbou Oct 4, 2019
80be9d2
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
3495fe5
Fix tests
grabbou Oct 4, 2019
7e46d77
Assert it works from the same level
grabbou Oct 4, 2019
68639b7
Warn if the root is passed
grabbou Oct 7, 2019
f8de995
Implement monorepo support for Android
grabbou Oct 8, 2019
5041be8
Note custom paths
grabbou Oct 8, 2019
53f59d1
Add quiet flag
grabbou Oct 8, 2019
9dd0ce1
Improve handling of files in monorepo
grabbou Oct 3, 2019
3be7ea4
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
4091c4c
Remove note about monorepo from the docs
grabbou Oct 3, 2019
27fac31
wat
grabbou Oct 3, 2019
0cbe32d
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
e362dc6
Fix Ruby tests
grabbou Oct 3, 2019
19fd10e
Always resolve correct root
grabbou Oct 4, 2019
366b7c4
Move files around
grabbou Oct 4, 2019
553df50
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
858ac79
Fix tests
grabbou Oct 4, 2019
883068f
Assert it works from the same level
grabbou Oct 4, 2019
7733cb2
Warn if the root is passed
grabbou Oct 7, 2019
c4c1745
Implement monorepo support for Android
grabbou Oct 8, 2019
a13e47f
Note custom paths
grabbou Oct 8, 2019
bdcc9fa
Add quiet flag
grabbou Oct 8, 2019
07bd62e
update locfile
thymikee Oct 10, 2019
858ea5e
Fix init - make detachedCommands and remove ugly setProjectDir hack
grabbou Oct 10, 2019
94d8bba
Resolve conflicts
grabbou Oct 10, 2019
81e7b10
Merge branch 'fix/paths' of github.com:react-native-community/react-n…
grabbou Oct 10, 2019
beca41b
Fix remainig uses or root and get rid of cwd
grabbou Oct 10, 2019
cc8c80c
Update paths
grabbou Oct 10, 2019
6661421
Remove unused func
grabbou Oct 10, 2019
781c0e6
Update templates.ts
grabbou Oct 10, 2019
46b0cd3
Fix unit tests
grabbou Oct 10, 2019
5033e50
Better logger
grabbou Oct 10, 2019
cc4b5bf
Debug
grabbou Oct 10, 2019
7402931
Add deprecations
grabbou Oct 10, 2019
90bacbc
Fix a typo
grabbou Oct 10, 2019
d0bd034
Better deprecation message
grabbou Oct 10, 2019
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 11 additions & 47 deletions docs/autolinking.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -36,28 +36,6 @@ The implementation ensures that a library is imported only once. If you need to

See example usage in React Native template's [Podfile](https://github.com/facebook/react-native/blob/0.60-stable/template/ios/Podfile).

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking script assume your project root to be `".."`, relative to `ios` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
ios/
```

you'll need to set a custom root. Pass it as an argument to `use_native_modules!` function inside the targets and adjust the relatively required `native_modules` path accordingly:

```rb
# example/ios/Podfile
require_relative '../../node_modules/@react-native-community/cli-platform-ios/native_modules'
target 'RNapp' do
# React pods and custom pods here...
use_native_modules!("../..")
end
```

## Platform Android

The [native_modules.gradle](https://github.com/react-native-community/cli/blob/master/packages/platform-android/native_modules.gradle) script is included in your project's `settings.gradle` and `app/build.gradle` files and:
Expand All@@ -76,31 +54,6 @@ See example usage in React Native template:
- [app/build.gradle](https://github.com/facebook/react-native/blob/0.60-stable/template/android/app/build.gradle#L185)
- [MainApplication.java](https://github.com/facebook/react-native/blob/769e35ba5f4c31ef913035a5cc8bc0e88546ca55/template/android/app/src/main/java/com/helloworld/MainApplication.java#L22-L28)

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking scripts assume your project root to be `".."`, relative to `android` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
android/
```

you'll need to set a custom root. Pass it as a second argument to `applyNativeModulesSettingsGradle` and `applyNativeModulesAppBuildGradle` methods and adjust the `native_modules.gradle` path accordingly:

```groovy
// example/android/settings.gradle
apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesSettingsGradle(settings, "../..")
```

```groovy
// example/android/app/build.gradle
apply from: file("../../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesAppBuildGradle(project, "../..")
```

## What do I need to have in my package to make it work?

You’re already using Gradle, so Android support will work by default.
Expand DownExpand Up@@ -142,3 +95,14 @@ module.exports = {
},
};
```

## How can I use autolinking in a monorepo?

There is nothing extra you need to do - monorepos are supported by default.

Please note that in certain scenarios, such as when using Yarn workspaces, your packages might be hoisted to the root of the repository. If that is the case, please make sure that the following paths are pointing to the
correct location and update them accordingly:

- path to `native_modules.rb` in your `ios/Podfile`
- path to `native_modules.gradle` in your `android/settings.gradle`
- path to `native_modules.gradle` in your `android/app/build.gradle`
Comment thread
grabbou marked this conversation as resolved.
10 changes: 10 additions & 0 deletions packages/cli-types/src/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -39,6 +39,16 @@ export interface Command<Args = Object> {
}>;
}

export type DetachedCommandFunction<Args = Object> = (
argv: Array<string>,
args: Args,
) => Promise<void> | void;

export type DetachedCommand<Args = Object> = Command<Args> & {
detached: true;
func: DetachedCommandFunction<Args>;
};

interface PlatformConfig<
ProjectConfig,
ProjectParams,
Expand Down
3 changes: 2 additions & 1 deletion packages/cli/package.json
Original file line numberDiff line numberDiff line change
Expand Up@@ -42,6 +42,7 @@
"envinfo": "^7.1.0",
"errorhandler": "^1.5.0",
"execa": "^1.0.0",
"find-up": "^4.1.0",
"fs-extra": "^7.0.1",
"glob": "^7.1.1",
"graceful-fs": "^4.1.3",
Expand DownExpand Up@@ -71,8 +72,8 @@
},
"devDependencies": {
"@types/command-exists": "^1.2.0",
"@types/graceful-fs": "^4.1.3",
"@types/cosmiconfig": "^5.0.3",
"@types/graceful-fs": "^4.1.3",
"@types/hapi__joi": "^15.0.4",
"@types/minimist": "^1.2.0",
"@types/mkdirp": "^0.5.2",
Expand Down
43 changes: 28 additions & 15 deletions packages/cli/src/cliEntry.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -14,14 +14,12 @@ import path from 'path';

import type {CommandT, ConfigT} from 'types';
// $FlowFixMe - converted to TS
import commands from './commands';
import {detachedCommands, projectCommands} from './commands';
// $FlowFixMe - converted to TS
import init from './commands/init/initCompat';
// $FlowFixMe - converted to TS
import assertRequiredOptions from './tools/assertRequiredOptions';
import {logger} from '@react-native-community/cli-tools';
// $FlowFixMe - converted to TS
import {setProjectDir} from './tools/packageManager';
import pkgJson from '../package.json';
// $FlowFixMe - converted to TS
import loadConfig from './tools/config';
Expand DownExpand Up@@ -117,7 +115,11 @@ const addCommand = (command: CommandT, ctx: ConfigT) => {

try {
assertRequiredOptions(options, passedOptions);
await command.func(argv, ctx, passedOptions);
if (command.detached) {
await command.func(argv, passedOptions);
} else {
await command.func(argv, ctx, passedOptions);
}
} catch (error) {
handleError(error);
}
Expand DownExpand Up@@ -149,6 +151,9 @@ async function run() {
}

async function setupAndRun() {
// Commander is not available yet
logger.setVerbose(process.argv.includes('--verbose'));

// We only have a setup script for UNIX envs currently
if (process.platform !== 'win32') {
const scriptName = 'setup_env.sh';
Expand All@@ -168,19 +173,29 @@ async function setupAndRun() {
}
}

// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}
detachedCommands.forEach(addCommand);

const ctx = loadConfig();
try {
// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}

logger.enable();
const ctx = loadConfig();
Comment thread
grabbou marked this conversation as resolved.

setProjectDir(ctx.root);
logger.enable();

[...commands, ...ctx.commands].forEach(command => addCommand(command, ctx));
[...projectCommands, ...ctx.commands].forEach(command =>
addCommand(command, ctx),
);
} catch (e) {
logger.enable();
logger.debug(e.message);
logger.debug(
'Failed to load configuration of your project. Only a subset of commands will be available.',
);
}

commander.parse(process.argv);

Expand All@@ -194,8 +209,6 @@ async function setupAndRun() {
if (commander.args.length === 0 && commander.rawArgs.includes('--version')) {
console.log(pkgJson.version);
}

logger.setVerbose(commander.verbose);
}

export default {
Expand Down
7 changes: 4 additions & 3 deletions packages/cli/src/commands/index.ts
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
import {Command} from '@react-native-community/cli-types';
import {DetachedCommand, Command} from '@react-native-community/cli-types';

// @ts-ignore - JS file
import server from './server/server';
Expand All@@ -15,7 +15,7 @@ import init from './init';
// @ts-ignore - JS file
import doctor from './doctor';

export default [
export const projectCommands = [
server,
bundle,
ramBundle,
Expand All@@ -26,6 +26,7 @@ export default [
upgrade,
info,
config,
init,
doctor,
] as Command[];

export const detachedCommands = [init] as DetachedCommand[];
2 changes: 1 addition & 1 deletion packages/cli/src/commands/init/__tests__/template.test.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -26,7 +26,7 @@ test('installTemplatePackage', async () => {
expect(PackageManger.install).toHaveBeenCalledWith([TEMPLATE_NAME], {
preferYarn: false,
silent: true,
cwd: TEMPLATE_SOURCE_DIR,
root: TEMPLATE_SOURCE_DIR,
});
});

Expand Down
1 change: 1 addition & 0 deletions packages/cli/src/commands/init/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,7 @@ import init from './init';

export default {
func: init,
detached: true,
name: 'init <projectName>',
description:
'Initialize a new React Native project named <projectName> in a directory of the same name.',
Expand Down
35 changes: 15 additions & 20 deletions packages/cli/src/commands/init/init.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,6 @@ import {validateProjectName} from './validate';
import DirectoryAlreadyExistsError from './errors/DirectoryAlreadyExistsError';
import printRunInstructions from './printRunInstructions';
import {CLIError, logger} from '@react-native-community/cli-tools';
import {Config} from '@react-native-community/cli-types';
import {
installTemplatePackage,
getTemplateConfig,
Expand DownExpand Up@@ -47,16 +46,6 @@ function doesDirectoryExist(dir: string) {
return fs.existsSync(dir);
}

function getProjectDirectory({
projectName,
directory,
}: {
projectName: string;
directory: string;
}): string {
return path.relative(process.cwd(), directory || projectName);
}

async function setProjectDirectory(directory: string) {
const directoryExists = doesDirectoryExist(directory);
if (directoryExists) {
Expand DownExpand Up@@ -87,6 +76,8 @@ async function setProjectDirectory(directory: string) {
error,
);
}

return process.cwd();
}

function adjustNameIfUrl(name: string, cwd: string) {
Expand All@@ -112,7 +103,7 @@ async function createFromTemplate({
logger.debug('Initializing new project');
logger.log(banner);

await setProjectDirectory(directory);
const projectDirectory = await setProjectDirectory(directory);

const Loader = getLoader();
const loader = new Loader({text: 'Downloading template'});
Expand DownExpand Up@@ -152,7 +143,12 @@ async function createFromTemplate({
loader.succeed();
}

await installDependencies({projectName, npm, loader});
await installDependencies({
projectName,
npm,
loader,
root: projectDirectory,
});
} catch (e) {
loader.fail();
throw new Error(e);
Expand All@@ -165,16 +161,19 @@ async function installDependencies({
projectName,
npm,
loader,
root,
}: {
projectName: string;
npm?: boolean;
loader: ora.Ora;
root: string;
}) {
loader.start('Installing dependencies');

await PackageManager.installAll({
preferYarn: !npm,
silent: true,
root,
});

if (process.platform === 'darwin') {
Expand DownExpand Up@@ -213,10 +212,9 @@ async function createProject(

export default (async function initialize(
[projectName]: Array<string>,
context: Config,
options: Options,
) {
const rootFolder = context.root;
const root = process.cwd();

validateProjectName(projectName);

Expand All@@ -226,15 +224,12 @@ export default (async function initialize(
*/
const version: string = minimist(process.argv).version || DEFAULT_VERSION;

const directoryName = getProjectDirectory({
projectName,
directory: options.directory || projectName,
});
const directoryName = path.relative(root, options.directory || projectName);

try {
await createProject(projectName, directoryName, version, options);

const projectFolder = path.join(rootFolder, projectName);
const projectFolder = path.join(root, projectName);
printRunInstructions(projectFolder, projectName);
} catch (e) {
logger.error(e.message);
Expand Down
30 changes: 18 additions & 12 deletions packages/cli/src/commands/init/initCompat.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -56,27 +56,33 @@ async function generateProject(
const pkgJson = require('react-native/package.json');
const reactVersion = pkgJson.peerDependencies.react;

PackageManager.setProjectDir(destinationRoot);
await createProjectFromTemplate(
destinationRoot,
newProjectName,
options.template,
);

logger.info('Adding required dependencies');
await PackageManager.install([`react@${reactVersion}`]);
await PackageManager.install([`react@${reactVersion}`], {
root: destinationRoot,
});

logger.info('Adding required dev dependencies');
await PackageManager.installDev([
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
]);
await PackageManager.installDev(
[
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
],
{
root: destinationRoot,
},
);

addJestToPackageJson(destinationRoot);

Expand Down
Loading
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
44 commits
Select commit Hold shift + click to select a range
b3b09ef
Improve handling of files in monorepo
grabbou Oct 3, 2019
440f166
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
1ffc0c2
Remove note about monorepo from the docs
grabbou Oct 3, 2019
391505d
wat
grabbou Oct 3, 2019
e0722c3
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
f85186f
Fix Ruby tests
grabbou Oct 3, 2019
435d314
Always resolve correct root
grabbou Oct 4, 2019
78065e0
Move files around
grabbou Oct 4, 2019
80be9d2
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
3495fe5
Fix tests
grabbou Oct 4, 2019
7e46d77
Assert it works from the same level
grabbou Oct 4, 2019
68639b7
Warn if the root is passed
grabbou Oct 7, 2019
f8de995
Implement monorepo support for Android
grabbou Oct 8, 2019
5041be8
Note custom paths
grabbou Oct 8, 2019
53f59d1
Add quiet flag
grabbou Oct 8, 2019
9dd0ce1
Improve handling of files in monorepo
grabbou Oct 3, 2019
3be7ea4
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
4091c4c
Remove note about monorepo from the docs
grabbou Oct 3, 2019
27fac31
wat
grabbou Oct 3, 2019
0cbe32d
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
e362dc6
Fix Ruby tests
grabbou Oct 3, 2019
19fd10e
Always resolve correct root
grabbou Oct 4, 2019
366b7c4
Move files around
grabbou Oct 4, 2019
553df50
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
858ac79
Fix tests
grabbou Oct 4, 2019
883068f
Assert it works from the same level
grabbou Oct 4, 2019
7733cb2
Warn if the root is passed
grabbou Oct 7, 2019
c4c1745
Implement monorepo support for Android
grabbou Oct 8, 2019
a13e47f
Note custom paths
grabbou Oct 8, 2019
bdcc9fa
Add quiet flag
grabbou Oct 8, 2019
07bd62e
update locfile
thymikee Oct 10, 2019
858ea5e
Fix init - make detachedCommands and remove ugly setProjectDir hack
grabbou Oct 10, 2019
94d8bba
Resolve conflicts
grabbou Oct 10, 2019
81e7b10
Merge branch 'fix/paths' of github.com:react-native-community/react-n…
grabbou Oct 10, 2019
beca41b
Fix remainig uses or root and get rid of cwd
grabbou Oct 10, 2019
cc8c80c
Update paths
grabbou Oct 10, 2019
6661421
Remove unused func
grabbou Oct 10, 2019
781c0e6
Update templates.ts
grabbou Oct 10, 2019
46b0cd3
Fix unit tests
grabbou Oct 10, 2019
5033e50
Better logger
grabbou Oct 10, 2019
cc4b5bf
Debug
grabbou Oct 10, 2019
7402931
Add deprecations
grabbou Oct 10, 2019
90bacbc
Fix a typo
grabbou Oct 10, 2019
d0bd034
Better deprecation message
grabbou Oct 10, 2019
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 11 additions & 47 deletions docs/autolinking.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -36,28 +36,6 @@ The implementation ensures that a library is imported only once. If you need to

See example usage in React Native template's [Podfile](https://github.com/facebook/react-native/blob/0.60-stable/template/ios/Podfile).

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking script assume your project root to be `".."`, relative to `ios` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
ios/
```

you'll need to set a custom root. Pass it as an argument to `use_native_modules!` function inside the targets and adjust the relatively required `native_modules` path accordingly:

```rb
# example/ios/Podfile
require_relative '../../node_modules/@react-native-community/cli-platform-ios/native_modules'
target 'RNapp' do
# React pods and custom pods here...
use_native_modules!("../..")
end
```

## Platform Android

The [native_modules.gradle](https://github.com/react-native-community/cli/blob/master/packages/platform-android/native_modules.gradle) script is included in your project's `settings.gradle` and `app/build.gradle` files and:
Expand All@@ -76,31 +54,6 @@ See example usage in React Native template:
- [app/build.gradle](https://github.com/facebook/react-native/blob/0.60-stable/template/android/app/build.gradle#L185)
- [MainApplication.java](https://github.com/facebook/react-native/blob/769e35ba5f4c31ef913035a5cc8bc0e88546ca55/template/android/app/src/main/java/com/helloworld/MainApplication.java#L22-L28)

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking scripts assume your project root to be `".."`, relative to `android` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
android/
```

you'll need to set a custom root. Pass it as a second argument to `applyNativeModulesSettingsGradle` and `applyNativeModulesAppBuildGradle` methods and adjust the `native_modules.gradle` path accordingly:

```groovy
// example/android/settings.gradle
apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesSettingsGradle(settings, "../..")
```

```groovy
// example/android/app/build.gradle
apply from: file("../../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesAppBuildGradle(project, "../..")
```

## What do I need to have in my package to make it work?

You’re already using Gradle, so Android support will work by default.
Expand DownExpand Up@@ -142,3 +95,14 @@ module.exports = {
},
};
```

## How can I use autolinking in a monorepo?

There is nothing extra you need to do - monorepos are supported by default.

Please note that in certain scenarios, such as when using Yarn workspaces, your packages might be hoisted to the root of the repository. If that is the case, please make sure that the following paths are pointing to the
correct location and update them accordingly:

- path to `native_modules.rb` in your `ios/Podfile`
- path to `native_modules.gradle` in your `android/settings.gradle`
- path to `native_modules.gradle` in your `android/app/build.gradle`
Comment thread
grabbou marked this conversation as resolved.
10 changes: 10 additions & 0 deletions packages/cli-types/src/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -39,6 +39,16 @@ export interface Command<Args = Object> {
}>;
}

export type DetachedCommandFunction<Args = Object> = (
argv: Array<string>,
args: Args,
) => Promise<void> | void;

export type DetachedCommand<Args = Object> = Command<Args> & {
detached: true;
func: DetachedCommandFunction<Args>;
};

interface PlatformConfig<
ProjectConfig,
ProjectParams,
Expand Down
3 changes: 2 additions & 1 deletion packages/cli/package.json
Original file line numberDiff line numberDiff line change
Expand Up@@ -42,6 +42,7 @@
"envinfo": "^7.1.0",
"errorhandler": "^1.5.0",
"execa": "^1.0.0",
"find-up": "^4.1.0",
"fs-extra": "^7.0.1",
"glob": "^7.1.1",
"graceful-fs": "^4.1.3",
Expand DownExpand Up@@ -71,8 +72,8 @@
},
"devDependencies": {
"@types/command-exists": "^1.2.0",
"@types/graceful-fs": "^4.1.3",
"@types/cosmiconfig": "^5.0.3",
"@types/graceful-fs": "^4.1.3",
"@types/hapi__joi": "^15.0.4",
"@types/minimist": "^1.2.0",
"@types/mkdirp": "^0.5.2",
Expand Down
43 changes: 28 additions & 15 deletions packages/cli/src/cliEntry.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -14,14 +14,12 @@ import path from 'path';

import type {CommandT, ConfigT} from 'types';
// $FlowFixMe - converted to TS
import commands from './commands';
import {detachedCommands, projectCommands} from './commands';
// $FlowFixMe - converted to TS
import init from './commands/init/initCompat';
// $FlowFixMe - converted to TS
import assertRequiredOptions from './tools/assertRequiredOptions';
import {logger} from '@react-native-community/cli-tools';
// $FlowFixMe - converted to TS
import {setProjectDir} from './tools/packageManager';
import pkgJson from '../package.json';
// $FlowFixMe - converted to TS
import loadConfig from './tools/config';
Expand DownExpand Up@@ -117,7 +115,11 @@ const addCommand = (command: CommandT, ctx: ConfigT) => {

try {
assertRequiredOptions(options, passedOptions);
await command.func(argv, ctx, passedOptions);
if (command.detached) {
await command.func(argv, passedOptions);
} else {
await command.func(argv, ctx, passedOptions);
}
} catch (error) {
handleError(error);
}
Expand DownExpand Up@@ -149,6 +151,9 @@ async function run() {
}

async function setupAndRun() {
// Commander is not available yet
logger.setVerbose(process.argv.includes('--verbose'));

// We only have a setup script for UNIX envs currently
if (process.platform !== 'win32') {
const scriptName = 'setup_env.sh';
Expand All@@ -168,19 +173,29 @@ async function setupAndRun() {
}
}

// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}
detachedCommands.forEach(addCommand);

const ctx = loadConfig();
try {
// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}

logger.enable();
const ctx = loadConfig();
Comment thread
grabbou marked this conversation as resolved.

setProjectDir(ctx.root);
logger.enable();

[...commands, ...ctx.commands].forEach(command => addCommand(command, ctx));
[...projectCommands, ...ctx.commands].forEach(command =>
addCommand(command, ctx),
);
} catch (e) {
logger.enable();
logger.debug(e.message);
logger.debug(
'Failed to load configuration of your project. Only a subset of commands will be available.',
);
}

commander.parse(process.argv);

Expand All@@ -194,8 +209,6 @@ async function setupAndRun() {
if (commander.args.length === 0 && commander.rawArgs.includes('--version')) {
console.log(pkgJson.version);
}

logger.setVerbose(commander.verbose);
}

export default {
Expand Down
7 changes: 4 additions & 3 deletions packages/cli/src/commands/index.ts
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
import {Command} from '@react-native-community/cli-types';
import {DetachedCommand, Command} from '@react-native-community/cli-types';

// @ts-ignore - JS file
import server from './server/server';
Expand All@@ -15,7 +15,7 @@ import init from './init';
// @ts-ignore - JS file
import doctor from './doctor';

export default [
export const projectCommands = [
server,
bundle,
ramBundle,
Expand All@@ -26,6 +26,7 @@ export default [
upgrade,
info,
config,
init,
doctor,
] as Command[];

export const detachedCommands = [init] as DetachedCommand[];
2 changes: 1 addition & 1 deletion packages/cli/src/commands/init/__tests__/template.test.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -26,7 +26,7 @@ test('installTemplatePackage', async () => {
expect(PackageManger.install).toHaveBeenCalledWith([TEMPLATE_NAME], {
preferYarn: false,
silent: true,
cwd: TEMPLATE_SOURCE_DIR,
root: TEMPLATE_SOURCE_DIR,
});
});

Expand Down
1 change: 1 addition & 0 deletions packages/cli/src/commands/init/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,7 @@ import init from './init';

export default {
func: init,
detached: true,
name: 'init <projectName>',
description:
'Initialize a new React Native project named <projectName> in a directory of the same name.',
Expand Down
35 changes: 15 additions & 20 deletions packages/cli/src/commands/init/init.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,6 @@ import {validateProjectName} from './validate';
import DirectoryAlreadyExistsError from './errors/DirectoryAlreadyExistsError';
import printRunInstructions from './printRunInstructions';
import {CLIError, logger} from '@react-native-community/cli-tools';
import {Config} from '@react-native-community/cli-types';
import {
installTemplatePackage,
getTemplateConfig,
Expand DownExpand Up@@ -47,16 +46,6 @@ function doesDirectoryExist(dir: string) {
return fs.existsSync(dir);
}

function getProjectDirectory({
projectName,
directory,
}: {
projectName: string;
directory: string;
}): string {
return path.relative(process.cwd(), directory || projectName);
}

async function setProjectDirectory(directory: string) {
const directoryExists = doesDirectoryExist(directory);
if (directoryExists) {
Expand DownExpand Up@@ -87,6 +76,8 @@ async function setProjectDirectory(directory: string) {
error,
);
}

return process.cwd();
}

function adjustNameIfUrl(name: string, cwd: string) {
Expand All@@ -112,7 +103,7 @@ async function createFromTemplate({
logger.debug('Initializing new project');
logger.log(banner);

await setProjectDirectory(directory);
const projectDirectory = await setProjectDirectory(directory);

const Loader = getLoader();
const loader = new Loader({text: 'Downloading template'});
Expand DownExpand Up@@ -152,7 +143,12 @@ async function createFromTemplate({
loader.succeed();
}

await installDependencies({projectName, npm, loader});
await installDependencies({
projectName,
npm,
loader,
root: projectDirectory,
});
} catch (e) {
loader.fail();
throw new Error(e);
Expand All@@ -165,16 +161,19 @@ async function installDependencies({
projectName,
npm,
loader,
root,
}: {
projectName: string;
npm?: boolean;
loader: ora.Ora;
root: string;
}) {
loader.start('Installing dependencies');

await PackageManager.installAll({
preferYarn: !npm,
silent: true,
root,
});

if (process.platform === 'darwin') {
Expand DownExpand Up@@ -213,10 +212,9 @@ async function createProject(

export default (async function initialize(
[projectName]: Array<string>,
context: Config,
options: Options,
) {
const rootFolder = context.root;
const root = process.cwd();

validateProjectName(projectName);

Expand All@@ -226,15 +224,12 @@ export default (async function initialize(
*/
const version: string = minimist(process.argv).version || DEFAULT_VERSION;

const directoryName = getProjectDirectory({
projectName,
directory: options.directory || projectName,
});
const directoryName = path.relative(root, options.directory || projectName);

try {
await createProject(projectName, directoryName, version, options);

const projectFolder = path.join(rootFolder, projectName);
const projectFolder = path.join(root, projectName);
printRunInstructions(projectFolder, projectName);
} catch (e) {
logger.error(e.message);
Expand Down
30 changes: 18 additions & 12 deletions packages/cli/src/commands/init/initCompat.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -56,27 +56,33 @@ async function generateProject(
const pkgJson = require('react-native/package.json');
const reactVersion = pkgJson.peerDependencies.react;

PackageManager.setProjectDir(destinationRoot);
await createProjectFromTemplate(
destinationRoot,
newProjectName,
options.template,
);

logger.info('Adding required dependencies');
await PackageManager.install([`react@${reactVersion}`]);
await PackageManager.install([`react@${reactVersion}`], {
root: destinationRoot,
});

logger.info('Adding required dev dependencies');
await PackageManager.installDev([
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
]);
await PackageManager.installDev(
[
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
],
{
root: destinationRoot,
},
);

addJestToPackageJson(destinationRoot);

Expand Down
Loading
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
44 commits
Select commit Hold shift + click to select a range
b3b09ef
Improve handling of files in monorepo
grabbou Oct 3, 2019
440f166
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
1ffc0c2
Remove note about monorepo from the docs
grabbou Oct 3, 2019
391505d
wat
grabbou Oct 3, 2019
e0722c3
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
f85186f
Fix Ruby tests
grabbou Oct 3, 2019
435d314
Always resolve correct root
grabbou Oct 4, 2019
78065e0
Move files around
grabbou Oct 4, 2019
80be9d2
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
3495fe5
Fix tests
grabbou Oct 4, 2019
7e46d77
Assert it works from the same level
grabbou Oct 4, 2019
68639b7
Warn if the root is passed
grabbou Oct 7, 2019
f8de995
Implement monorepo support for Android
grabbou Oct 8, 2019
5041be8
Note custom paths
grabbou Oct 8, 2019
53f59d1
Add quiet flag
grabbou Oct 8, 2019
9dd0ce1
Improve handling of files in monorepo
grabbou Oct 3, 2019
3be7ea4
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
4091c4c
Remove note about monorepo from the docs
grabbou Oct 3, 2019
27fac31
wat
grabbou Oct 3, 2019
0cbe32d
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
e362dc6
Fix Ruby tests
grabbou Oct 3, 2019
19fd10e
Always resolve correct root
grabbou Oct 4, 2019
366b7c4
Move files around
grabbou Oct 4, 2019
553df50
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
858ac79
Fix tests
grabbou Oct 4, 2019
883068f
Assert it works from the same level
grabbou Oct 4, 2019
7733cb2
Warn if the root is passed
grabbou Oct 7, 2019
c4c1745
Implement monorepo support for Android
grabbou Oct 8, 2019
a13e47f
Note custom paths
grabbou Oct 8, 2019
bdcc9fa
Add quiet flag
grabbou Oct 8, 2019
07bd62e
update locfile
thymikee Oct 10, 2019
858ea5e
Fix init - make detachedCommands and remove ugly setProjectDir hack
grabbou Oct 10, 2019
94d8bba
Resolve conflicts
grabbou Oct 10, 2019
81e7b10
Merge branch 'fix/paths' of github.com:react-native-community/react-n…
grabbou Oct 10, 2019
beca41b
Fix remainig uses or root and get rid of cwd
grabbou Oct 10, 2019
cc8c80c
Update paths
grabbou Oct 10, 2019
6661421
Remove unused func
grabbou Oct 10, 2019
781c0e6
Update templates.ts
grabbou Oct 10, 2019
46b0cd3
Fix unit tests
grabbou Oct 10, 2019
5033e50
Better logger
grabbou Oct 10, 2019
cc4b5bf
Debug
grabbou Oct 10, 2019
7402931
Add deprecations
grabbou Oct 10, 2019
90bacbc
Fix a typo
grabbou Oct 10, 2019
d0bd034
Better deprecation message
grabbou Oct 10, 2019
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 11 additions & 47 deletions docs/autolinking.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -36,28 +36,6 @@ The implementation ensures that a library is imported only once. If you need to

See example usage in React Native template's [Podfile](https://github.com/facebook/react-native/blob/0.60-stable/template/ios/Podfile).

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking script assume your project root to be `".."`, relative to `ios` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
ios/
```

you'll need to set a custom root. Pass it as an argument to `use_native_modules!` function inside the targets and adjust the relatively required `native_modules` path accordingly:

```rb
# example/ios/Podfile
require_relative '../../node_modules/@react-native-community/cli-platform-ios/native_modules'
target 'RNapp' do
# React pods and custom pods here...
use_native_modules!("../..")
end
```

## Platform Android

The [native_modules.gradle](https://github.com/react-native-community/cli/blob/master/packages/platform-android/native_modules.gradle) script is included in your project's `settings.gradle` and `app/build.gradle` files and:
Expand All@@ -76,31 +54,6 @@ See example usage in React Native template:
- [app/build.gradle](https://github.com/facebook/react-native/blob/0.60-stable/template/android/app/build.gradle#L185)
- [MainApplication.java](https://github.com/facebook/react-native/blob/769e35ba5f4c31ef913035a5cc8bc0e88546ca55/template/android/app/src/main/java/com/helloworld/MainApplication.java#L22-L28)

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking scripts assume your project root to be `".."`, relative to `android` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
android/
```

you'll need to set a custom root. Pass it as a second argument to `applyNativeModulesSettingsGradle` and `applyNativeModulesAppBuildGradle` methods and adjust the `native_modules.gradle` path accordingly:

```groovy
// example/android/settings.gradle
apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesSettingsGradle(settings, "../..")
```

```groovy
// example/android/app/build.gradle
apply from: file("../../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesAppBuildGradle(project, "../..")
```

## What do I need to have in my package to make it work?

You’re already using Gradle, so Android support will work by default.
Expand DownExpand Up@@ -142,3 +95,14 @@ module.exports = {
},
};
```

## How can I use autolinking in a monorepo?

There is nothing extra you need to do - monorepos are supported by default.

Please note that in certain scenarios, such as when using Yarn workspaces, your packages might be hoisted to the root of the repository. If that is the case, please make sure that the following paths are pointing to the
correct location and update them accordingly:

- path to `native_modules.rb` in your `ios/Podfile`
- path to `native_modules.gradle` in your `android/settings.gradle`
- path to `native_modules.gradle` in your `android/app/build.gradle`
Comment thread
grabbou marked this conversation as resolved.
10 changes: 10 additions & 0 deletions packages/cli-types/src/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -39,6 +39,16 @@ export interface Command<Args = Object> {
}>;
}

export type DetachedCommandFunction<Args = Object> = (
argv: Array<string>,
args: Args,
) => Promise<void> | void;

export type DetachedCommand<Args = Object> = Command<Args> & {
detached: true;
func: DetachedCommandFunction<Args>;
};

interface PlatformConfig<
ProjectConfig,
ProjectParams,
Expand Down
3 changes: 2 additions & 1 deletion packages/cli/package.json
Original file line numberDiff line numberDiff line change
Expand Up@@ -42,6 +42,7 @@
"envinfo": "^7.1.0",
"errorhandler": "^1.5.0",
"execa": "^1.0.0",
"find-up": "^4.1.0",
"fs-extra": "^7.0.1",
"glob": "^7.1.1",
"graceful-fs": "^4.1.3",
Expand DownExpand Up@@ -71,8 +72,8 @@
},
"devDependencies": {
"@types/command-exists": "^1.2.0",
"@types/graceful-fs": "^4.1.3",
"@types/cosmiconfig": "^5.0.3",
"@types/graceful-fs": "^4.1.3",
"@types/hapi__joi": "^15.0.4",
"@types/minimist": "^1.2.0",
"@types/mkdirp": "^0.5.2",
Expand Down
43 changes: 28 additions & 15 deletions packages/cli/src/cliEntry.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -14,14 +14,12 @@ import path from 'path';

import type {CommandT, ConfigT} from 'types';
// $FlowFixMe - converted to TS
import commands from './commands';
import {detachedCommands, projectCommands} from './commands';
// $FlowFixMe - converted to TS
import init from './commands/init/initCompat';
// $FlowFixMe - converted to TS
import assertRequiredOptions from './tools/assertRequiredOptions';
import {logger} from '@react-native-community/cli-tools';
// $FlowFixMe - converted to TS
import {setProjectDir} from './tools/packageManager';
import pkgJson from '../package.json';
// $FlowFixMe - converted to TS
import loadConfig from './tools/config';
Expand DownExpand Up@@ -117,7 +115,11 @@ const addCommand = (command: CommandT, ctx: ConfigT) => {

try {
assertRequiredOptions(options, passedOptions);
await command.func(argv, ctx, passedOptions);
if (command.detached) {
await command.func(argv, passedOptions);
} else {
await command.func(argv, ctx, passedOptions);
}
} catch (error) {
handleError(error);
}
Expand DownExpand Up@@ -149,6 +151,9 @@ async function run() {
}

async function setupAndRun() {
// Commander is not available yet
logger.setVerbose(process.argv.includes('--verbose'));

// We only have a setup script for UNIX envs currently
if (process.platform !== 'win32') {
const scriptName = 'setup_env.sh';
Expand All@@ -168,19 +173,29 @@ async function setupAndRun() {
}
}

// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}
detachedCommands.forEach(addCommand);

const ctx = loadConfig();
try {
// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}

logger.enable();
const ctx = loadConfig();
Comment thread
grabbou marked this conversation as resolved.

setProjectDir(ctx.root);
logger.enable();

[...commands, ...ctx.commands].forEach(command => addCommand(command, ctx));
[...projectCommands, ...ctx.commands].forEach(command =>
addCommand(command, ctx),
);
} catch (e) {
logger.enable();
logger.debug(e.message);
logger.debug(
'Failed to load configuration of your project. Only a subset of commands will be available.',
);
}

commander.parse(process.argv);

Expand All@@ -194,8 +209,6 @@ async function setupAndRun() {
if (commander.args.length === 0 && commander.rawArgs.includes('--version')) {
console.log(pkgJson.version);
}

logger.setVerbose(commander.verbose);
}

export default {
Expand Down
7 changes: 4 additions & 3 deletions packages/cli/src/commands/index.ts
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
import {Command} from '@react-native-community/cli-types';
import {DetachedCommand, Command} from '@react-native-community/cli-types';

// @ts-ignore - JS file
import server from './server/server';
Expand All@@ -15,7 +15,7 @@ import init from './init';
// @ts-ignore - JS file
import doctor from './doctor';

export default [
export const projectCommands = [
server,
bundle,
ramBundle,
Expand All@@ -26,6 +26,7 @@ export default [
upgrade,
info,
config,
init,
doctor,
] as Command[];

export const detachedCommands = [init] as DetachedCommand[];
2 changes: 1 addition & 1 deletion packages/cli/src/commands/init/__tests__/template.test.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -26,7 +26,7 @@ test('installTemplatePackage', async () => {
expect(PackageManger.install).toHaveBeenCalledWith([TEMPLATE_NAME], {
preferYarn: false,
silent: true,
cwd: TEMPLATE_SOURCE_DIR,
root: TEMPLATE_SOURCE_DIR,
});
});

Expand Down
1 change: 1 addition & 0 deletions packages/cli/src/commands/init/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,7 @@ import init from './init';

export default {
func: init,
detached: true,
name: 'init <projectName>',
description:
'Initialize a new React Native project named <projectName> in a directory of the same name.',
Expand Down
35 changes: 15 additions & 20 deletions packages/cli/src/commands/init/init.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,6 @@ import {validateProjectName} from './validate';
import DirectoryAlreadyExistsError from './errors/DirectoryAlreadyExistsError';
import printRunInstructions from './printRunInstructions';
import {CLIError, logger} from '@react-native-community/cli-tools';
import {Config} from '@react-native-community/cli-types';
import {
installTemplatePackage,
getTemplateConfig,
Expand DownExpand Up@@ -47,16 +46,6 @@ function doesDirectoryExist(dir: string) {
return fs.existsSync(dir);
}

function getProjectDirectory({
projectName,
directory,
}: {
projectName: string;
directory: string;
}): string {
return path.relative(process.cwd(), directory || projectName);
}

async function setProjectDirectory(directory: string) {
const directoryExists = doesDirectoryExist(directory);
if (directoryExists) {
Expand DownExpand Up@@ -87,6 +76,8 @@ async function setProjectDirectory(directory: string) {
error,
);
}

return process.cwd();
}

function adjustNameIfUrl(name: string, cwd: string) {
Expand All@@ -112,7 +103,7 @@ async function createFromTemplate({
logger.debug('Initializing new project');
logger.log(banner);

await setProjectDirectory(directory);
const projectDirectory = await setProjectDirectory(directory);

const Loader = getLoader();
const loader = new Loader({text: 'Downloading template'});
Expand DownExpand Up@@ -152,7 +143,12 @@ async function createFromTemplate({
loader.succeed();
}

await installDependencies({projectName, npm, loader});
await installDependencies({
projectName,
npm,
loader,
root: projectDirectory,
});
} catch (e) {
loader.fail();
throw new Error(e);
Expand All@@ -165,16 +161,19 @@ async function installDependencies({
projectName,
npm,
loader,
root,
}: {
projectName: string;
npm?: boolean;
loader: ora.Ora;
root: string;
}) {
loader.start('Installing dependencies');

await PackageManager.installAll({
preferYarn: !npm,
silent: true,
root,
});

if (process.platform === 'darwin') {
Expand DownExpand Up@@ -213,10 +212,9 @@ async function createProject(

export default (async function initialize(
[projectName]: Array<string>,
context: Config,
options: Options,
) {
const rootFolder = context.root;
const root = process.cwd();

validateProjectName(projectName);

Expand All@@ -226,15 +224,12 @@ export default (async function initialize(
*/
const version: string = minimist(process.argv).version || DEFAULT_VERSION;

const directoryName = getProjectDirectory({
projectName,
directory: options.directory || projectName,
});
const directoryName = path.relative(root, options.directory || projectName);

try {
await createProject(projectName, directoryName, version, options);

const projectFolder = path.join(rootFolder, projectName);
const projectFolder = path.join(root, projectName);
printRunInstructions(projectFolder, projectName);
} catch (e) {
logger.error(e.message);
Expand Down
30 changes: 18 additions & 12 deletions packages/cli/src/commands/init/initCompat.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -56,27 +56,33 @@ async function generateProject(
const pkgJson = require('react-native/package.json');
const reactVersion = pkgJson.peerDependencies.react;

PackageManager.setProjectDir(destinationRoot);
await createProjectFromTemplate(
destinationRoot,
newProjectName,
options.template,
);

logger.info('Adding required dependencies');
await PackageManager.install([`react@${reactVersion}`]);
await PackageManager.install([`react@${reactVersion}`], {
root: destinationRoot,
});

logger.info('Adding required dev dependencies');
await PackageManager.installDev([
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
]);
await PackageManager.installDev(
[
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
],
{
root: destinationRoot,
},
);

addJestToPackageJson(destinationRoot);

Expand Down
Loading
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
44 commits
Select commit Hold shift + click to select a range
b3b09ef
Improve handling of files in monorepo
grabbou Oct 3, 2019
440f166
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
1ffc0c2
Remove note about monorepo from the docs
grabbou Oct 3, 2019
391505d
wat
grabbou Oct 3, 2019
e0722c3
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
f85186f
Fix Ruby tests
grabbou Oct 3, 2019
435d314
Always resolve correct root
grabbou Oct 4, 2019
78065e0
Move files around
grabbou Oct 4, 2019
80be9d2
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
3495fe5
Fix tests
grabbou Oct 4, 2019
7e46d77
Assert it works from the same level
grabbou Oct 4, 2019
68639b7
Warn if the root is passed
grabbou Oct 7, 2019
f8de995
Implement monorepo support for Android
grabbou Oct 8, 2019
5041be8
Note custom paths
grabbou Oct 8, 2019
53f59d1
Add quiet flag
grabbou Oct 8, 2019
9dd0ce1
Improve handling of files in monorepo
grabbou Oct 3, 2019
3be7ea4
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
4091c4c
Remove note about monorepo from the docs
grabbou Oct 3, 2019
27fac31
wat
grabbou Oct 3, 2019
0cbe32d
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
e362dc6
Fix Ruby tests
grabbou Oct 3, 2019
19fd10e
Always resolve correct root
grabbou Oct 4, 2019
366b7c4
Move files around
grabbou Oct 4, 2019
553df50
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
858ac79
Fix tests
grabbou Oct 4, 2019
883068f
Assert it works from the same level
grabbou Oct 4, 2019
7733cb2
Warn if the root is passed
grabbou Oct 7, 2019
c4c1745
Implement monorepo support for Android
grabbou Oct 8, 2019
a13e47f
Note custom paths
grabbou Oct 8, 2019
bdcc9fa
Add quiet flag
grabbou Oct 8, 2019
07bd62e
update locfile
thymikee Oct 10, 2019
858ea5e
Fix init - make detachedCommands and remove ugly setProjectDir hack
grabbou Oct 10, 2019
94d8bba
Resolve conflicts
grabbou Oct 10, 2019
81e7b10
Merge branch 'fix/paths' of github.com:react-native-community/react-n…
grabbou Oct 10, 2019
beca41b
Fix remainig uses or root and get rid of cwd
grabbou Oct 10, 2019
cc8c80c
Update paths
grabbou Oct 10, 2019
6661421
Remove unused func
grabbou Oct 10, 2019
781c0e6
Update templates.ts
grabbou Oct 10, 2019
46b0cd3
Fix unit tests
grabbou Oct 10, 2019
5033e50
Better logger
grabbou Oct 10, 2019
cc4b5bf
Debug
grabbou Oct 10, 2019
7402931
Add deprecations
grabbou Oct 10, 2019
90bacbc
Fix a typo
grabbou Oct 10, 2019
d0bd034
Better deprecation message
grabbou Oct 10, 2019
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 11 additions & 47 deletions docs/autolinking.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -36,28 +36,6 @@ The implementation ensures that a library is imported only once. If you need to

See example usage in React Native template's [Podfile](https://github.com/facebook/react-native/blob/0.60-stable/template/ios/Podfile).

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking script assume your project root to be `".."`, relative to `ios` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
ios/
```

you'll need to set a custom root. Pass it as an argument to `use_native_modules!` function inside the targets and adjust the relatively required `native_modules` path accordingly:

```rb
# example/ios/Podfile
require_relative '../../node_modules/@react-native-community/cli-platform-ios/native_modules'
target 'RNapp' do
# React pods and custom pods here...
use_native_modules!("../..")
end
```

## Platform Android

The [native_modules.gradle](https://github.com/react-native-community/cli/blob/master/packages/platform-android/native_modules.gradle) script is included in your project's `settings.gradle` and `app/build.gradle` files and:
Expand All@@ -76,31 +54,6 @@ See example usage in React Native template:
- [app/build.gradle](https://github.com/facebook/react-native/blob/0.60-stable/template/android/app/build.gradle#L185)
- [MainApplication.java](https://github.com/facebook/react-native/blob/769e35ba5f4c31ef913035a5cc8bc0e88546ca55/template/android/app/src/main/java/com/helloworld/MainApplication.java#L22-L28)

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking scripts assume your project root to be `".."`, relative to `android` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
android/
```

you'll need to set a custom root. Pass it as a second argument to `applyNativeModulesSettingsGradle` and `applyNativeModulesAppBuildGradle` methods and adjust the `native_modules.gradle` path accordingly:

```groovy
// example/android/settings.gradle
apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesSettingsGradle(settings, "../..")
```

```groovy
// example/android/app/build.gradle
apply from: file("../../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesAppBuildGradle(project, "../..")
```

## What do I need to have in my package to make it work?

You’re already using Gradle, so Android support will work by default.
Expand DownExpand Up@@ -142,3 +95,14 @@ module.exports = {
},
};
```

## How can I use autolinking in a monorepo?

There is nothing extra you need to do - monorepos are supported by default.

Please note that in certain scenarios, such as when using Yarn workspaces, your packages might be hoisted to the root of the repository. If that is the case, please make sure that the following paths are pointing to the
correct location and update them accordingly:

- path to `native_modules.rb` in your `ios/Podfile`
- path to `native_modules.gradle` in your `android/settings.gradle`
- path to `native_modules.gradle` in your `android/app/build.gradle`
Comment thread
grabbou marked this conversation as resolved.
10 changes: 10 additions & 0 deletions packages/cli-types/src/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -39,6 +39,16 @@ export interface Command<Args = Object> {
}>;
}

export type DetachedCommandFunction<Args = Object> = (
argv: Array<string>,
args: Args,
) => Promise<void> | void;

export type DetachedCommand<Args = Object> = Command<Args> & {
detached: true;
func: DetachedCommandFunction<Args>;
};

interface PlatformConfig<
ProjectConfig,
ProjectParams,
Expand Down
3 changes: 2 additions & 1 deletion packages/cli/package.json
Original file line numberDiff line numberDiff line change
Expand Up@@ -42,6 +42,7 @@
"envinfo": "^7.1.0",
"errorhandler": "^1.5.0",
"execa": "^1.0.0",
"find-up": "^4.1.0",
"fs-extra": "^7.0.1",
"glob": "^7.1.1",
"graceful-fs": "^4.1.3",
Expand DownExpand Up@@ -71,8 +72,8 @@
},
"devDependencies": {
"@types/command-exists": "^1.2.0",
"@types/graceful-fs": "^4.1.3",
"@types/cosmiconfig": "^5.0.3",
"@types/graceful-fs": "^4.1.3",
"@types/hapi__joi": "^15.0.4",
"@types/minimist": "^1.2.0",
"@types/mkdirp": "^0.5.2",
Expand Down
43 changes: 28 additions & 15 deletions packages/cli/src/cliEntry.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -14,14 +14,12 @@ import path from 'path';

import type {CommandT, ConfigT} from 'types';
// $FlowFixMe - converted to TS
import commands from './commands';
import {detachedCommands, projectCommands} from './commands';
// $FlowFixMe - converted to TS
import init from './commands/init/initCompat';
// $FlowFixMe - converted to TS
import assertRequiredOptions from './tools/assertRequiredOptions';
import {logger} from '@react-native-community/cli-tools';
// $FlowFixMe - converted to TS
import {setProjectDir} from './tools/packageManager';
import pkgJson from '../package.json';
// $FlowFixMe - converted to TS
import loadConfig from './tools/config';
Expand DownExpand Up@@ -117,7 +115,11 @@ const addCommand = (command: CommandT, ctx: ConfigT) => {

try {
assertRequiredOptions(options, passedOptions);
await command.func(argv, ctx, passedOptions);
if (command.detached) {
await command.func(argv, passedOptions);
} else {
await command.func(argv, ctx, passedOptions);
}
} catch (error) {
handleError(error);
}
Expand DownExpand Up@@ -149,6 +151,9 @@ async function run() {
}

async function setupAndRun() {
// Commander is not available yet
logger.setVerbose(process.argv.includes('--verbose'));

// We only have a setup script for UNIX envs currently
if (process.platform !== 'win32') {
const scriptName = 'setup_env.sh';
Expand All@@ -168,19 +173,29 @@ async function setupAndRun() {
}
}

// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}
detachedCommands.forEach(addCommand);

const ctx = loadConfig();
try {
// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}

logger.enable();
const ctx = loadConfig();
Comment thread
grabbou marked this conversation as resolved.

setProjectDir(ctx.root);
logger.enable();

[...commands, ...ctx.commands].forEach(command => addCommand(command, ctx));
[...projectCommands, ...ctx.commands].forEach(command =>
addCommand(command, ctx),
);
} catch (e) {
logger.enable();
logger.debug(e.message);
logger.debug(
'Failed to load configuration of your project. Only a subset of commands will be available.',
);
}

commander.parse(process.argv);

Expand All@@ -194,8 +209,6 @@ async function setupAndRun() {
if (commander.args.length === 0 && commander.rawArgs.includes('--version')) {
console.log(pkgJson.version);
}

logger.setVerbose(commander.verbose);
}

export default {
Expand Down
7 changes: 4 additions & 3 deletions packages/cli/src/commands/index.ts
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
import {Command} from '@react-native-community/cli-types';
import {DetachedCommand, Command} from '@react-native-community/cli-types';

// @ts-ignore - JS file
import server from './server/server';
Expand All@@ -15,7 +15,7 @@ import init from './init';
// @ts-ignore - JS file
import doctor from './doctor';

export default [
export const projectCommands = [
server,
bundle,
ramBundle,
Expand All@@ -26,6 +26,7 @@ export default [
upgrade,
info,
config,
init,
doctor,
] as Command[];

export const detachedCommands = [init] as DetachedCommand[];
2 changes: 1 addition & 1 deletion packages/cli/src/commands/init/__tests__/template.test.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -26,7 +26,7 @@ test('installTemplatePackage', async () => {
expect(PackageManger.install).toHaveBeenCalledWith([TEMPLATE_NAME], {
preferYarn: false,
silent: true,
cwd: TEMPLATE_SOURCE_DIR,
root: TEMPLATE_SOURCE_DIR,
});
});

Expand Down
1 change: 1 addition & 0 deletions packages/cli/src/commands/init/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,7 @@ import init from './init';

export default {
func: init,
detached: true,
name: 'init <projectName>',
description:
'Initialize a new React Native project named <projectName> in a directory of the same name.',
Expand Down
35 changes: 15 additions & 20 deletions packages/cli/src/commands/init/init.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,6 @@ import {validateProjectName} from './validate';
import DirectoryAlreadyExistsError from './errors/DirectoryAlreadyExistsError';
import printRunInstructions from './printRunInstructions';
import {CLIError, logger} from '@react-native-community/cli-tools';
import {Config} from '@react-native-community/cli-types';
import {
installTemplatePackage,
getTemplateConfig,
Expand DownExpand Up@@ -47,16 +46,6 @@ function doesDirectoryExist(dir: string) {
return fs.existsSync(dir);
}

function getProjectDirectory({
projectName,
directory,
}: {
projectName: string;
directory: string;
}): string {
return path.relative(process.cwd(), directory || projectName);
}

async function setProjectDirectory(directory: string) {
const directoryExists = doesDirectoryExist(directory);
if (directoryExists) {
Expand DownExpand Up@@ -87,6 +76,8 @@ async function setProjectDirectory(directory: string) {
error,
);
}

return process.cwd();
}

function adjustNameIfUrl(name: string, cwd: string) {
Expand All@@ -112,7 +103,7 @@ async function createFromTemplate({
logger.debug('Initializing new project');
logger.log(banner);

await setProjectDirectory(directory);
const projectDirectory = await setProjectDirectory(directory);

const Loader = getLoader();
const loader = new Loader({text: 'Downloading template'});
Expand DownExpand Up@@ -152,7 +143,12 @@ async function createFromTemplate({
loader.succeed();
}

await installDependencies({projectName, npm, loader});
await installDependencies({
projectName,
npm,
loader,
root: projectDirectory,
});
} catch (e) {
loader.fail();
throw new Error(e);
Expand All@@ -165,16 +161,19 @@ async function installDependencies({
projectName,
npm,
loader,
root,
}: {
projectName: string;
npm?: boolean;
loader: ora.Ora;
root: string;
}) {
loader.start('Installing dependencies');

await PackageManager.installAll({
preferYarn: !npm,
silent: true,
root,
});

if (process.platform === 'darwin') {
Expand DownExpand Up@@ -213,10 +212,9 @@ async function createProject(

export default (async function initialize(
[projectName]: Array<string>,
context: Config,
options: Options,
) {
const rootFolder = context.root;
const root = process.cwd();

validateProjectName(projectName);

Expand All@@ -226,15 +224,12 @@ export default (async function initialize(
*/
const version: string = minimist(process.argv).version || DEFAULT_VERSION;

const directoryName = getProjectDirectory({
projectName,
directory: options.directory || projectName,
});
const directoryName = path.relative(root, options.directory || projectName);

try {
await createProject(projectName, directoryName, version, options);

const projectFolder = path.join(rootFolder, projectName);
const projectFolder = path.join(root, projectName);
printRunInstructions(projectFolder, projectName);
} catch (e) {
logger.error(e.message);
Expand Down
30 changes: 18 additions & 12 deletions packages/cli/src/commands/init/initCompat.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -56,27 +56,33 @@ async function generateProject(
const pkgJson = require('react-native/package.json');
const reactVersion = pkgJson.peerDependencies.react;

PackageManager.setProjectDir(destinationRoot);
await createProjectFromTemplate(
destinationRoot,
newProjectName,
options.template,
);

logger.info('Adding required dependencies');
await PackageManager.install([`react@${reactVersion}`]);
await PackageManager.install([`react@${reactVersion}`], {
root: destinationRoot,
});

logger.info('Adding required dev dependencies');
await PackageManager.installDev([
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
]);
await PackageManager.installDev(
[
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
],
{
root: destinationRoot,
},
);

addJestToPackageJson(destinationRoot);

Expand Down
Loading
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
44 commits
Select commit Hold shift + click to select a range
b3b09ef
Improve handling of files in monorepo
grabbou Oct 3, 2019
440f166
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
1ffc0c2
Remove note about monorepo from the docs
grabbou Oct 3, 2019
391505d
wat
grabbou Oct 3, 2019
e0722c3
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
f85186f
Fix Ruby tests
grabbou Oct 3, 2019
435d314
Always resolve correct root
grabbou Oct 4, 2019
78065e0
Move files around
grabbou Oct 4, 2019
80be9d2
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
3495fe5
Fix tests
grabbou Oct 4, 2019
7e46d77
Assert it works from the same level
grabbou Oct 4, 2019
68639b7
Warn if the root is passed
grabbou Oct 7, 2019
f8de995
Implement monorepo support for Android
grabbou Oct 8, 2019
5041be8
Note custom paths
grabbou Oct 8, 2019
53f59d1
Add quiet flag
grabbou Oct 8, 2019
9dd0ce1
Improve handling of files in monorepo
grabbou Oct 3, 2019
3be7ea4
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
4091c4c
Remove note about monorepo from the docs
grabbou Oct 3, 2019
27fac31
wat
grabbou Oct 3, 2019
0cbe32d
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
e362dc6
Fix Ruby tests
grabbou Oct 3, 2019
19fd10e
Always resolve correct root
grabbou Oct 4, 2019
366b7c4
Move files around
grabbou Oct 4, 2019
553df50
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
858ac79
Fix tests
grabbou Oct 4, 2019
883068f
Assert it works from the same level
grabbou Oct 4, 2019
7733cb2
Warn if the root is passed
grabbou Oct 7, 2019
c4c1745
Implement monorepo support for Android
grabbou Oct 8, 2019
a13e47f
Note custom paths
grabbou Oct 8, 2019
bdcc9fa
Add quiet flag
grabbou Oct 8, 2019
07bd62e
update locfile
thymikee Oct 10, 2019
858ea5e
Fix init - make detachedCommands and remove ugly setProjectDir hack
grabbou Oct 10, 2019
94d8bba
Resolve conflicts
grabbou Oct 10, 2019
81e7b10
Merge branch 'fix/paths' of github.com:react-native-community/react-n…
grabbou Oct 10, 2019
beca41b
Fix remainig uses or root and get rid of cwd
grabbou Oct 10, 2019
cc8c80c
Update paths
grabbou Oct 10, 2019
6661421
Remove unused func
grabbou Oct 10, 2019
781c0e6
Update templates.ts
grabbou Oct 10, 2019
46b0cd3
Fix unit tests
grabbou Oct 10, 2019
5033e50
Better logger
grabbou Oct 10, 2019
cc4b5bf
Debug
grabbou Oct 10, 2019
7402931
Add deprecations
grabbou Oct 10, 2019
90bacbc
Fix a typo
grabbou Oct 10, 2019
d0bd034
Better deprecation message
grabbou Oct 10, 2019
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 11 additions & 47 deletions docs/autolinking.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -36,28 +36,6 @@ The implementation ensures that a library is imported only once. If you need to

See example usage in React Native template's [Podfile](https://github.com/facebook/react-native/blob/0.60-stable/template/ios/Podfile).

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking script assume your project root to be `".."`, relative to `ios` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
ios/
```

you'll need to set a custom root. Pass it as an argument to `use_native_modules!` function inside the targets and adjust the relatively required `native_modules` path accordingly:

```rb
# example/ios/Podfile
require_relative '../../node_modules/@react-native-community/cli-platform-ios/native_modules'
target 'RNapp' do
# React pods and custom pods here...
use_native_modules!("../..")
end
```

## Platform Android

The [native_modules.gradle](https://github.com/react-native-community/cli/blob/master/packages/platform-android/native_modules.gradle) script is included in your project's `settings.gradle` and `app/build.gradle` files and:
Expand All@@ -76,31 +54,6 @@ See example usage in React Native template:
- [app/build.gradle](https://github.com/facebook/react-native/blob/0.60-stable/template/android/app/build.gradle#L185)
- [MainApplication.java](https://github.com/facebook/react-native/blob/769e35ba5f4c31ef913035a5cc8bc0e88546ca55/template/android/app/src/main/java/com/helloworld/MainApplication.java#L22-L28)

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking scripts assume your project root to be `".."`, relative to `android` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
android/
```

you'll need to set a custom root. Pass it as a second argument to `applyNativeModulesSettingsGradle` and `applyNativeModulesAppBuildGradle` methods and adjust the `native_modules.gradle` path accordingly:

```groovy
// example/android/settings.gradle
apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesSettingsGradle(settings, "../..")
```

```groovy
// example/android/app/build.gradle
apply from: file("../../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesAppBuildGradle(project, "../..")
```

## What do I need to have in my package to make it work?

You’re already using Gradle, so Android support will work by default.
Expand DownExpand Up@@ -142,3 +95,14 @@ module.exports = {
},
};
```

## How can I use autolinking in a monorepo?

There is nothing extra you need to do - monorepos are supported by default.

Please note that in certain scenarios, such as when using Yarn workspaces, your packages might be hoisted to the root of the repository. If that is the case, please make sure that the following paths are pointing to the
correct location and update them accordingly:

- path to `native_modules.rb` in your `ios/Podfile`
- path to `native_modules.gradle` in your `android/settings.gradle`
- path to `native_modules.gradle` in your `android/app/build.gradle`
Comment thread
grabbou marked this conversation as resolved.
10 changes: 10 additions & 0 deletions packages/cli-types/src/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -39,6 +39,16 @@ export interface Command<Args = Object> {
}>;
}

export type DetachedCommandFunction<Args = Object> = (
argv: Array<string>,
args: Args,
) => Promise<void> | void;

export type DetachedCommand<Args = Object> = Command<Args> & {
detached: true;
func: DetachedCommandFunction<Args>;
};

interface PlatformConfig<
ProjectConfig,
ProjectParams,
Expand Down
3 changes: 2 additions & 1 deletion packages/cli/package.json
Original file line numberDiff line numberDiff line change
Expand Up@@ -42,6 +42,7 @@
"envinfo": "^7.1.0",
"errorhandler": "^1.5.0",
"execa": "^1.0.0",
"find-up": "^4.1.0",
"fs-extra": "^7.0.1",
"glob": "^7.1.1",
"graceful-fs": "^4.1.3",
Expand DownExpand Up@@ -71,8 +72,8 @@
},
"devDependencies": {
"@types/command-exists": "^1.2.0",
"@types/graceful-fs": "^4.1.3",
"@types/cosmiconfig": "^5.0.3",
"@types/graceful-fs": "^4.1.3",
"@types/hapi__joi": "^15.0.4",
"@types/minimist": "^1.2.0",
"@types/mkdirp": "^0.5.2",
Expand Down
43 changes: 28 additions & 15 deletions packages/cli/src/cliEntry.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -14,14 +14,12 @@ import path from 'path';

import type {CommandT, ConfigT} from 'types';
// $FlowFixMe - converted to TS
import commands from './commands';
import {detachedCommands, projectCommands} from './commands';
// $FlowFixMe - converted to TS
import init from './commands/init/initCompat';
// $FlowFixMe - converted to TS
import assertRequiredOptions from './tools/assertRequiredOptions';
import {logger} from '@react-native-community/cli-tools';
// $FlowFixMe - converted to TS
import {setProjectDir} from './tools/packageManager';
import pkgJson from '../package.json';
// $FlowFixMe - converted to TS
import loadConfig from './tools/config';
Expand DownExpand Up@@ -117,7 +115,11 @@ const addCommand = (command: CommandT, ctx: ConfigT) => {

try {
assertRequiredOptions(options, passedOptions);
await command.func(argv, ctx, passedOptions);
if (command.detached) {
await command.func(argv, passedOptions);
} else {
await command.func(argv, ctx, passedOptions);
}
} catch (error) {
handleError(error);
}
Expand DownExpand Up@@ -149,6 +151,9 @@ async function run() {
}

async function setupAndRun() {
// Commander is not available yet
logger.setVerbose(process.argv.includes('--verbose'));

// We only have a setup script for UNIX envs currently
if (process.platform !== 'win32') {
const scriptName = 'setup_env.sh';
Expand All@@ -168,19 +173,29 @@ async function setupAndRun() {
}
}

// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}
detachedCommands.forEach(addCommand);

const ctx = loadConfig();
try {
// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}

logger.enable();
const ctx = loadConfig();
Comment thread
grabbou marked this conversation as resolved.

setProjectDir(ctx.root);
logger.enable();

[...commands, ...ctx.commands].forEach(command => addCommand(command, ctx));
[...projectCommands, ...ctx.commands].forEach(command =>
addCommand(command, ctx),
);
} catch (e) {
logger.enable();
logger.debug(e.message);
logger.debug(
'Failed to load configuration of your project. Only a subset of commands will be available.',
);
}

commander.parse(process.argv);

Expand All@@ -194,8 +209,6 @@ async function setupAndRun() {
if (commander.args.length === 0 && commander.rawArgs.includes('--version')) {
console.log(pkgJson.version);
}

logger.setVerbose(commander.verbose);
}

export default {
Expand Down
7 changes: 4 additions & 3 deletions packages/cli/src/commands/index.ts
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
import {Command} from '@react-native-community/cli-types';
import {DetachedCommand, Command} from '@react-native-community/cli-types';

// @ts-ignore - JS file
import server from './server/server';
Expand All@@ -15,7 +15,7 @@ import init from './init';
// @ts-ignore - JS file
import doctor from './doctor';

export default [
export const projectCommands = [
server,
bundle,
ramBundle,
Expand All@@ -26,6 +26,7 @@ export default [
upgrade,
info,
config,
init,
doctor,
] as Command[];

export const detachedCommands = [init] as DetachedCommand[];
2 changes: 1 addition & 1 deletion packages/cli/src/commands/init/__tests__/template.test.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -26,7 +26,7 @@ test('installTemplatePackage', async () => {
expect(PackageManger.install).toHaveBeenCalledWith([TEMPLATE_NAME], {
preferYarn: false,
silent: true,
cwd: TEMPLATE_SOURCE_DIR,
root: TEMPLATE_SOURCE_DIR,
});
});

Expand Down
1 change: 1 addition & 0 deletions packages/cli/src/commands/init/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,7 @@ import init from './init';

export default {
func: init,
detached: true,
name: 'init <projectName>',
description:
'Initialize a new React Native project named <projectName> in a directory of the same name.',
Expand Down
35 changes: 15 additions & 20 deletions packages/cli/src/commands/init/init.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,6 @@ import {validateProjectName} from './validate';
import DirectoryAlreadyExistsError from './errors/DirectoryAlreadyExistsError';
import printRunInstructions from './printRunInstructions';
import {CLIError, logger} from '@react-native-community/cli-tools';
import {Config} from '@react-native-community/cli-types';
import {
installTemplatePackage,
getTemplateConfig,
Expand DownExpand Up@@ -47,16 +46,6 @@ function doesDirectoryExist(dir: string) {
return fs.existsSync(dir);
}

function getProjectDirectory({
projectName,
directory,
}: {
projectName: string;
directory: string;
}): string {
return path.relative(process.cwd(), directory || projectName);
}

async function setProjectDirectory(directory: string) {
const directoryExists = doesDirectoryExist(directory);
if (directoryExists) {
Expand DownExpand Up@@ -87,6 +76,8 @@ async function setProjectDirectory(directory: string) {
error,
);
}

return process.cwd();
}

function adjustNameIfUrl(name: string, cwd: string) {
Expand All@@ -112,7 +103,7 @@ async function createFromTemplate({
logger.debug('Initializing new project');
logger.log(banner);

await setProjectDirectory(directory);
const projectDirectory = await setProjectDirectory(directory);

const Loader = getLoader();
const loader = new Loader({text: 'Downloading template'});
Expand DownExpand Up@@ -152,7 +143,12 @@ async function createFromTemplate({
loader.succeed();
}

await installDependencies({projectName, npm, loader});
await installDependencies({
projectName,
npm,
loader,
root: projectDirectory,
});
} catch (e) {
loader.fail();
throw new Error(e);
Expand All@@ -165,16 +161,19 @@ async function installDependencies({
projectName,
npm,
loader,
root,
}: {
projectName: string;
npm?: boolean;
loader: ora.Ora;
root: string;
}) {
loader.start('Installing dependencies');

await PackageManager.installAll({
preferYarn: !npm,
silent: true,
root,
});

if (process.platform === 'darwin') {
Expand DownExpand Up@@ -213,10 +212,9 @@ async function createProject(

export default (async function initialize(
[projectName]: Array<string>,
context: Config,
options: Options,
) {
const rootFolder = context.root;
const root = process.cwd();

validateProjectName(projectName);

Expand All@@ -226,15 +224,12 @@ export default (async function initialize(
*/
const version: string = minimist(process.argv).version || DEFAULT_VERSION;

const directoryName = getProjectDirectory({
projectName,
directory: options.directory || projectName,
});
const directoryName = path.relative(root, options.directory || projectName);

try {
await createProject(projectName, directoryName, version, options);

const projectFolder = path.join(rootFolder, projectName);
const projectFolder = path.join(root, projectName);
printRunInstructions(projectFolder, projectName);
} catch (e) {
logger.error(e.message);
Expand Down
30 changes: 18 additions & 12 deletions packages/cli/src/commands/init/initCompat.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -56,27 +56,33 @@ async function generateProject(
const pkgJson = require('react-native/package.json');
const reactVersion = pkgJson.peerDependencies.react;

PackageManager.setProjectDir(destinationRoot);
await createProjectFromTemplate(
destinationRoot,
newProjectName,
options.template,
);

logger.info('Adding required dependencies');
await PackageManager.install([`react@${reactVersion}`]);
await PackageManager.install([`react@${reactVersion}`], {
root: destinationRoot,
});

logger.info('Adding required dev dependencies');
await PackageManager.installDev([
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
]);
await PackageManager.installDev(
[
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
],
{
root: destinationRoot,
},
);

addJestToPackageJson(destinationRoot);

Expand Down
Loading
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
44 commits
Select commit Hold shift + click to select a range
b3b09ef
Improve handling of files in monorepo
grabbou Oct 3, 2019
440f166
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
1ffc0c2
Remove note about monorepo from the docs
grabbou Oct 3, 2019
391505d
wat
grabbou Oct 3, 2019
e0722c3
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
f85186f
Fix Ruby tests
grabbou Oct 3, 2019
435d314
Always resolve correct root
grabbou Oct 4, 2019
78065e0
Move files around
grabbou Oct 4, 2019
80be9d2
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
3495fe5
Fix tests
grabbou Oct 4, 2019
7e46d77
Assert it works from the same level
grabbou Oct 4, 2019
68639b7
Warn if the root is passed
grabbou Oct 7, 2019
f8de995
Implement monorepo support for Android
grabbou Oct 8, 2019
5041be8
Note custom paths
grabbou Oct 8, 2019
53f59d1
Add quiet flag
grabbou Oct 8, 2019
9dd0ce1
Improve handling of files in monorepo
grabbou Oct 3, 2019
3be7ea4
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
4091c4c
Remove note about monorepo from the docs
grabbou Oct 3, 2019
27fac31
wat
grabbou Oct 3, 2019
0cbe32d
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
e362dc6
Fix Ruby tests
grabbou Oct 3, 2019
19fd10e
Always resolve correct root
grabbou Oct 4, 2019
366b7c4
Move files around
grabbou Oct 4, 2019
553df50
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
858ac79
Fix tests
grabbou Oct 4, 2019
883068f
Assert it works from the same level
grabbou Oct 4, 2019
7733cb2
Warn if the root is passed
grabbou Oct 7, 2019
c4c1745
Implement monorepo support for Android
grabbou Oct 8, 2019
a13e47f
Note custom paths
grabbou Oct 8, 2019
bdcc9fa
Add quiet flag
grabbou Oct 8, 2019
07bd62e
update locfile
thymikee Oct 10, 2019
858ea5e
Fix init - make detachedCommands and remove ugly setProjectDir hack
grabbou Oct 10, 2019
94d8bba
Resolve conflicts
grabbou Oct 10, 2019
81e7b10
Merge branch 'fix/paths' of github.com:react-native-community/react-n…
grabbou Oct 10, 2019
beca41b
Fix remainig uses or root and get rid of cwd
grabbou Oct 10, 2019
cc8c80c
Update paths
grabbou Oct 10, 2019
6661421
Remove unused func
grabbou Oct 10, 2019
781c0e6
Update templates.ts
grabbou Oct 10, 2019
46b0cd3
Fix unit tests
grabbou Oct 10, 2019
5033e50
Better logger
grabbou Oct 10, 2019
cc4b5bf
Debug
grabbou Oct 10, 2019
7402931
Add deprecations
grabbou Oct 10, 2019
90bacbc
Fix a typo
grabbou Oct 10, 2019
d0bd034
Better deprecation message
grabbou Oct 10, 2019
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 11 additions & 47 deletions docs/autolinking.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -36,28 +36,6 @@ The implementation ensures that a library is imported only once. If you need to

See example usage in React Native template's [Podfile](https://github.com/facebook/react-native/blob/0.60-stable/template/ios/Podfile).

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking script assume your project root to be `".."`, relative to `ios` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
ios/
```

you'll need to set a custom root. Pass it as an argument to `use_native_modules!` function inside the targets and adjust the relatively required `native_modules` path accordingly:

```rb
# example/ios/Podfile
require_relative '../../node_modules/@react-native-community/cli-platform-ios/native_modules'
target 'RNapp' do
# React pods and custom pods here...
use_native_modules!("../..")
end
```

## Platform Android

The [native_modules.gradle](https://github.com/react-native-community/cli/blob/master/packages/platform-android/native_modules.gradle) script is included in your project's `settings.gradle` and `app/build.gradle` files and:
Expand All@@ -76,31 +54,6 @@ See example usage in React Native template:
- [app/build.gradle](https://github.com/facebook/react-native/blob/0.60-stable/template/android/app/build.gradle#L185)
- [MainApplication.java](https://github.com/facebook/react-native/blob/769e35ba5f4c31ef913035a5cc8bc0e88546ca55/template/android/app/src/main/java/com/helloworld/MainApplication.java#L22-L28)

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking scripts assume your project root to be `".."`, relative to `android` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
android/
```

you'll need to set a custom root. Pass it as a second argument to `applyNativeModulesSettingsGradle` and `applyNativeModulesAppBuildGradle` methods and adjust the `native_modules.gradle` path accordingly:

```groovy
// example/android/settings.gradle
apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesSettingsGradle(settings, "../..")
```

```groovy
// example/android/app/build.gradle
apply from: file("../../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesAppBuildGradle(project, "../..")
```

## What do I need to have in my package to make it work?

You’re already using Gradle, so Android support will work by default.
Expand DownExpand Up@@ -142,3 +95,14 @@ module.exports = {
},
};
```

## How can I use autolinking in a monorepo?

There is nothing extra you need to do - monorepos are supported by default.

Please note that in certain scenarios, such as when using Yarn workspaces, your packages might be hoisted to the root of the repository. If that is the case, please make sure that the following paths are pointing to the
correct location and update them accordingly:

- path to `native_modules.rb` in your `ios/Podfile`
- path to `native_modules.gradle` in your `android/settings.gradle`
- path to `native_modules.gradle` in your `android/app/build.gradle`
Comment thread
grabbou marked this conversation as resolved.
10 changes: 10 additions & 0 deletions packages/cli-types/src/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -39,6 +39,16 @@ export interface Command<Args = Object> {
}>;
}

export type DetachedCommandFunction<Args = Object> = (
argv: Array<string>,
args: Args,
) => Promise<void> | void;

export type DetachedCommand<Args = Object> = Command<Args> & {
detached: true;
func: DetachedCommandFunction<Args>;
};

interface PlatformConfig<
ProjectConfig,
ProjectParams,
Expand Down
3 changes: 2 additions & 1 deletion packages/cli/package.json
Original file line numberDiff line numberDiff line change
Expand Up@@ -42,6 +42,7 @@
"envinfo": "^7.1.0",
"errorhandler": "^1.5.0",
"execa": "^1.0.0",
"find-up": "^4.1.0",
"fs-extra": "^7.0.1",
"glob": "^7.1.1",
"graceful-fs": "^4.1.3",
Expand DownExpand Up@@ -71,8 +72,8 @@
},
"devDependencies": {
"@types/command-exists": "^1.2.0",
"@types/graceful-fs": "^4.1.3",
"@types/cosmiconfig": "^5.0.3",
"@types/graceful-fs": "^4.1.3",
"@types/hapi__joi": "^15.0.4",
"@types/minimist": "^1.2.0",
"@types/mkdirp": "^0.5.2",
Expand Down
43 changes: 28 additions & 15 deletions packages/cli/src/cliEntry.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -14,14 +14,12 @@ import path from 'path';

import type {CommandT, ConfigT} from 'types';
// $FlowFixMe - converted to TS
import commands from './commands';
import {detachedCommands, projectCommands} from './commands';
// $FlowFixMe - converted to TS
import init from './commands/init/initCompat';
// $FlowFixMe - converted to TS
import assertRequiredOptions from './tools/assertRequiredOptions';
import {logger} from '@react-native-community/cli-tools';
// $FlowFixMe - converted to TS
import {setProjectDir} from './tools/packageManager';
import pkgJson from '../package.json';
// $FlowFixMe - converted to TS
import loadConfig from './tools/config';
Expand DownExpand Up@@ -117,7 +115,11 @@ const addCommand = (command: CommandT, ctx: ConfigT) => {

try {
assertRequiredOptions(options, passedOptions);
await command.func(argv, ctx, passedOptions);
if (command.detached) {
await command.func(argv, passedOptions);
} else {
await command.func(argv, ctx, passedOptions);
}
} catch (error) {
handleError(error);
}
Expand DownExpand Up@@ -149,6 +151,9 @@ async function run() {
}

async function setupAndRun() {
// Commander is not available yet
logger.setVerbose(process.argv.includes('--verbose'));

// We only have a setup script for UNIX envs currently
if (process.platform !== 'win32') {
const scriptName = 'setup_env.sh';
Expand All@@ -168,19 +173,29 @@ async function setupAndRun() {
}
}

// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}
detachedCommands.forEach(addCommand);

const ctx = loadConfig();
try {
// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}

logger.enable();
const ctx = loadConfig();
Comment thread
grabbou marked this conversation as resolved.

setProjectDir(ctx.root);
logger.enable();

[...commands, ...ctx.commands].forEach(command => addCommand(command, ctx));
[...projectCommands, ...ctx.commands].forEach(command =>
addCommand(command, ctx),
);
} catch (e) {
logger.enable();
logger.debug(e.message);
logger.debug(
'Failed to load configuration of your project. Only a subset of commands will be available.',
);
}

commander.parse(process.argv);

Expand All@@ -194,8 +209,6 @@ async function setupAndRun() {
if (commander.args.length === 0 && commander.rawArgs.includes('--version')) {
console.log(pkgJson.version);
}

logger.setVerbose(commander.verbose);
}

export default {
Expand Down
7 changes: 4 additions & 3 deletions packages/cli/src/commands/index.ts
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
import {Command} from '@react-native-community/cli-types';
import {DetachedCommand, Command} from '@react-native-community/cli-types';

// @ts-ignore - JS file
import server from './server/server';
Expand All@@ -15,7 +15,7 @@ import init from './init';
// @ts-ignore - JS file
import doctor from './doctor';

export default [
export const projectCommands = [
server,
bundle,
ramBundle,
Expand All@@ -26,6 +26,7 @@ export default [
upgrade,
info,
config,
init,
doctor,
] as Command[];

export const detachedCommands = [init] as DetachedCommand[];
2 changes: 1 addition & 1 deletion packages/cli/src/commands/init/__tests__/template.test.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -26,7 +26,7 @@ test('installTemplatePackage', async () => {
expect(PackageManger.install).toHaveBeenCalledWith([TEMPLATE_NAME], {
preferYarn: false,
silent: true,
cwd: TEMPLATE_SOURCE_DIR,
root: TEMPLATE_SOURCE_DIR,
});
});

Expand Down
1 change: 1 addition & 0 deletions packages/cli/src/commands/init/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,7 @@ import init from './init';

export default {
func: init,
detached: true,
name: 'init <projectName>',
description:
'Initialize a new React Native project named <projectName> in a directory of the same name.',
Expand Down
35 changes: 15 additions & 20 deletions packages/cli/src/commands/init/init.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,6 @@ import {validateProjectName} from './validate';
import DirectoryAlreadyExistsError from './errors/DirectoryAlreadyExistsError';
import printRunInstructions from './printRunInstructions';
import {CLIError, logger} from '@react-native-community/cli-tools';
import {Config} from '@react-native-community/cli-types';
import {
installTemplatePackage,
getTemplateConfig,
Expand DownExpand Up@@ -47,16 +46,6 @@ function doesDirectoryExist(dir: string) {
return fs.existsSync(dir);
}

function getProjectDirectory({
projectName,
directory,
}: {
projectName: string;
directory: string;
}): string {
return path.relative(process.cwd(), directory || projectName);
}

async function setProjectDirectory(directory: string) {
const directoryExists = doesDirectoryExist(directory);
if (directoryExists) {
Expand DownExpand Up@@ -87,6 +76,8 @@ async function setProjectDirectory(directory: string) {
error,
);
}

return process.cwd();
}

function adjustNameIfUrl(name: string, cwd: string) {
Expand All@@ -112,7 +103,7 @@ async function createFromTemplate({
logger.debug('Initializing new project');
logger.log(banner);

await setProjectDirectory(directory);
const projectDirectory = await setProjectDirectory(directory);

const Loader = getLoader();
const loader = new Loader({text: 'Downloading template'});
Expand DownExpand Up@@ -152,7 +143,12 @@ async function createFromTemplate({
loader.succeed();
}

await installDependencies({projectName, npm, loader});
await installDependencies({
projectName,
npm,
loader,
root: projectDirectory,
});
} catch (e) {
loader.fail();
throw new Error(e);
Expand All@@ -165,16 +161,19 @@ async function installDependencies({
projectName,
npm,
loader,
root,
}: {
projectName: string;
npm?: boolean;
loader: ora.Ora;
root: string;
}) {
loader.start('Installing dependencies');

await PackageManager.installAll({
preferYarn: !npm,
silent: true,
root,
});

if (process.platform === 'darwin') {
Expand DownExpand Up@@ -213,10 +212,9 @@ async function createProject(

export default (async function initialize(
[projectName]: Array<string>,
context: Config,
options: Options,
) {
const rootFolder = context.root;
const root = process.cwd();

validateProjectName(projectName);

Expand All@@ -226,15 +224,12 @@ export default (async function initialize(
*/
const version: string = minimist(process.argv).version || DEFAULT_VERSION;

const directoryName = getProjectDirectory({
projectName,
directory: options.directory || projectName,
});
const directoryName = path.relative(root, options.directory || projectName);

try {
await createProject(projectName, directoryName, version, options);

const projectFolder = path.join(rootFolder, projectName);
const projectFolder = path.join(root, projectName);
printRunInstructions(projectFolder, projectName);
} catch (e) {
logger.error(e.message);
Expand Down
30 changes: 18 additions & 12 deletions packages/cli/src/commands/init/initCompat.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -56,27 +56,33 @@ async function generateProject(
const pkgJson = require('react-native/package.json');
const reactVersion = pkgJson.peerDependencies.react;

PackageManager.setProjectDir(destinationRoot);
await createProjectFromTemplate(
destinationRoot,
newProjectName,
options.template,
);

logger.info('Adding required dependencies');
await PackageManager.install([`react@${reactVersion}`]);
await PackageManager.install([`react@${reactVersion}`], {
root: destinationRoot,
});

logger.info('Adding required dev dependencies');
await PackageManager.installDev([
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
]);
await PackageManager.installDev(
[
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
],
{
root: destinationRoot,
},
);

addJestToPackageJson(destinationRoot);

Expand Down
Loading
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
44 commits
Select commit Hold shift + click to select a range
b3b09ef
Improve handling of files in monorepo
grabbou Oct 3, 2019
440f166
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
1ffc0c2
Remove note about monorepo from the docs
grabbou Oct 3, 2019
391505d
wat
grabbou Oct 3, 2019
e0722c3
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
f85186f
Fix Ruby tests
grabbou Oct 3, 2019
435d314
Always resolve correct root
grabbou Oct 4, 2019
78065e0
Move files around
grabbou Oct 4, 2019
80be9d2
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
3495fe5
Fix tests
grabbou Oct 4, 2019
7e46d77
Assert it works from the same level
grabbou Oct 4, 2019
68639b7
Warn if the root is passed
grabbou Oct 7, 2019
f8de995
Implement monorepo support for Android
grabbou Oct 8, 2019
5041be8
Note custom paths
grabbou Oct 8, 2019
53f59d1
Add quiet flag
grabbou Oct 8, 2019
9dd0ce1
Improve handling of files in monorepo
grabbou Oct 3, 2019
3be7ea4
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
4091c4c
Remove note about monorepo from the docs
grabbou Oct 3, 2019
27fac31
wat
grabbou Oct 3, 2019
0cbe32d
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
e362dc6
Fix Ruby tests
grabbou Oct 3, 2019
19fd10e
Always resolve correct root
grabbou Oct 4, 2019
366b7c4
Move files around
grabbou Oct 4, 2019
553df50
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
858ac79
Fix tests
grabbou Oct 4, 2019
883068f
Assert it works from the same level
grabbou Oct 4, 2019
7733cb2
Warn if the root is passed
grabbou Oct 7, 2019
c4c1745
Implement monorepo support for Android
grabbou Oct 8, 2019
a13e47f
Note custom paths
grabbou Oct 8, 2019
bdcc9fa
Add quiet flag
grabbou Oct 8, 2019
07bd62e
update locfile
thymikee Oct 10, 2019
858ea5e
Fix init - make detachedCommands and remove ugly setProjectDir hack
grabbou Oct 10, 2019
94d8bba
Resolve conflicts
grabbou Oct 10, 2019
81e7b10
Merge branch 'fix/paths' of github.com:react-native-community/react-n…
grabbou Oct 10, 2019
beca41b
Fix remainig uses or root and get rid of cwd
grabbou Oct 10, 2019
cc8c80c
Update paths
grabbou Oct 10, 2019
6661421
Remove unused func
grabbou Oct 10, 2019
781c0e6
Update templates.ts
grabbou Oct 10, 2019
46b0cd3
Fix unit tests
grabbou Oct 10, 2019
5033e50
Better logger
grabbou Oct 10, 2019
cc4b5bf
Debug
grabbou Oct 10, 2019
7402931
Add deprecations
grabbou Oct 10, 2019
90bacbc
Fix a typo
grabbou Oct 10, 2019
d0bd034
Better deprecation message
grabbou Oct 10, 2019
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 11 additions & 47 deletions docs/autolinking.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -36,28 +36,6 @@ The implementation ensures that a library is imported only once. If you need to

See example usage in React Native template's [Podfile](https://github.com/facebook/react-native/blob/0.60-stable/template/ios/Podfile).

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking script assume your project root to be `".."`, relative to `ios` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
ios/
```

you'll need to set a custom root. Pass it as an argument to `use_native_modules!` function inside the targets and adjust the relatively required `native_modules` path accordingly:

```rb
# example/ios/Podfile
require_relative '../../node_modules/@react-native-community/cli-platform-ios/native_modules'
target 'RNapp' do
# React pods and custom pods here...
use_native_modules!("../..")
end
```

## Platform Android

The [native_modules.gradle](https://github.com/react-native-community/cli/blob/master/packages/platform-android/native_modules.gradle) script is included in your project's `settings.gradle` and `app/build.gradle` files and:
Expand All@@ -76,31 +54,6 @@ See example usage in React Native template:
- [app/build.gradle](https://github.com/facebook/react-native/blob/0.60-stable/template/android/app/build.gradle#L185)
- [MainApplication.java](https://github.com/facebook/react-native/blob/769e35ba5f4c31ef913035a5cc8bc0e88546ca55/template/android/app/src/main/java/com/helloworld/MainApplication.java#L22-L28)

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking scripts assume your project root to be `".."`, relative to `android` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
android/
```

you'll need to set a custom root. Pass it as a second argument to `applyNativeModulesSettingsGradle` and `applyNativeModulesAppBuildGradle` methods and adjust the `native_modules.gradle` path accordingly:

```groovy
// example/android/settings.gradle
apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesSettingsGradle(settings, "../..")
```

```groovy
// example/android/app/build.gradle
apply from: file("../../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesAppBuildGradle(project, "../..")
```

## What do I need to have in my package to make it work?

You’re already using Gradle, so Android support will work by default.
Expand DownExpand Up@@ -142,3 +95,14 @@ module.exports = {
},
};
```

## How can I use autolinking in a monorepo?

There is nothing extra you need to do - monorepos are supported by default.

Please note that in certain scenarios, such as when using Yarn workspaces, your packages might be hoisted to the root of the repository. If that is the case, please make sure that the following paths are pointing to the
correct location and update them accordingly:

- path to `native_modules.rb` in your `ios/Podfile`
- path to `native_modules.gradle` in your `android/settings.gradle`
- path to `native_modules.gradle` in your `android/app/build.gradle`
Comment thread
grabbou marked this conversation as resolved.
10 changes: 10 additions & 0 deletions packages/cli-types/src/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -39,6 +39,16 @@ export interface Command<Args = Object> {
}>;
}

export type DetachedCommandFunction<Args = Object> = (
argv: Array<string>,
args: Args,
) => Promise<void> | void;

export type DetachedCommand<Args = Object> = Command<Args> & {
detached: true;
func: DetachedCommandFunction<Args>;
};

interface PlatformConfig<
ProjectConfig,
ProjectParams,
Expand Down
3 changes: 2 additions & 1 deletion packages/cli/package.json
Original file line numberDiff line numberDiff line change
Expand Up@@ -42,6 +42,7 @@
"envinfo": "^7.1.0",
"errorhandler": "^1.5.0",
"execa": "^1.0.0",
"find-up": "^4.1.0",
"fs-extra": "^7.0.1",
"glob": "^7.1.1",
"graceful-fs": "^4.1.3",
Expand DownExpand Up@@ -71,8 +72,8 @@
},
"devDependencies": {
"@types/command-exists": "^1.2.0",
"@types/graceful-fs": "^4.1.3",
"@types/cosmiconfig": "^5.0.3",
"@types/graceful-fs": "^4.1.3",
"@types/hapi__joi": "^15.0.4",
"@types/minimist": "^1.2.0",
"@types/mkdirp": "^0.5.2",
Expand Down
43 changes: 28 additions & 15 deletions packages/cli/src/cliEntry.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -14,14 +14,12 @@ import path from 'path';

import type {CommandT, ConfigT} from 'types';
// $FlowFixMe - converted to TS
import commands from './commands';
import {detachedCommands, projectCommands} from './commands';
// $FlowFixMe - converted to TS
import init from './commands/init/initCompat';
// $FlowFixMe - converted to TS
import assertRequiredOptions from './tools/assertRequiredOptions';
import {logger} from '@react-native-community/cli-tools';
// $FlowFixMe - converted to TS
import {setProjectDir} from './tools/packageManager';
import pkgJson from '../package.json';
// $FlowFixMe - converted to TS
import loadConfig from './tools/config';
Expand DownExpand Up@@ -117,7 +115,11 @@ const addCommand = (command: CommandT, ctx: ConfigT) => {

try {
assertRequiredOptions(options, passedOptions);
await command.func(argv, ctx, passedOptions);
if (command.detached) {
await command.func(argv, passedOptions);
} else {
await command.func(argv, ctx, passedOptions);
}
} catch (error) {
handleError(error);
}
Expand DownExpand Up@@ -149,6 +151,9 @@ async function run() {
}

async function setupAndRun() {
// Commander is not available yet
logger.setVerbose(process.argv.includes('--verbose'));

// We only have a setup script for UNIX envs currently
if (process.platform !== 'win32') {
const scriptName = 'setup_env.sh';
Expand All@@ -168,19 +173,29 @@ async function setupAndRun() {
}
}

// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}
detachedCommands.forEach(addCommand);

const ctx = loadConfig();
try {
// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}

logger.enable();
const ctx = loadConfig();
Comment thread
grabbou marked this conversation as resolved.

setProjectDir(ctx.root);
logger.enable();

[...commands, ...ctx.commands].forEach(command => addCommand(command, ctx));
[...projectCommands, ...ctx.commands].forEach(command =>
addCommand(command, ctx),
);
} catch (e) {
logger.enable();
logger.debug(e.message);
logger.debug(
'Failed to load configuration of your project. Only a subset of commands will be available.',
);
}

commander.parse(process.argv);

Expand All@@ -194,8 +209,6 @@ async function setupAndRun() {
if (commander.args.length === 0 && commander.rawArgs.includes('--version')) {
console.log(pkgJson.version);
}

logger.setVerbose(commander.verbose);
}

export default {
Expand Down
7 changes: 4 additions & 3 deletions packages/cli/src/commands/index.ts
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
import {Command} from '@react-native-community/cli-types';
import {DetachedCommand, Command} from '@react-native-community/cli-types';

// @ts-ignore - JS file
import server from './server/server';
Expand All@@ -15,7 +15,7 @@ import init from './init';
// @ts-ignore - JS file
import doctor from './doctor';

export default [
export const projectCommands = [
server,
bundle,
ramBundle,
Expand All@@ -26,6 +26,7 @@ export default [
upgrade,
info,
config,
init,
doctor,
] as Command[];

export const detachedCommands = [init] as DetachedCommand[];
2 changes: 1 addition & 1 deletion packages/cli/src/commands/init/__tests__/template.test.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -26,7 +26,7 @@ test('installTemplatePackage', async () => {
expect(PackageManger.install).toHaveBeenCalledWith([TEMPLATE_NAME], {
preferYarn: false,
silent: true,
cwd: TEMPLATE_SOURCE_DIR,
root: TEMPLATE_SOURCE_DIR,
});
});

Expand Down
1 change: 1 addition & 0 deletions packages/cli/src/commands/init/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,7 @@ import init from './init';

export default {
func: init,
detached: true,
name: 'init <projectName>',
description:
'Initialize a new React Native project named <projectName> in a directory of the same name.',
Expand Down
35 changes: 15 additions & 20 deletions packages/cli/src/commands/init/init.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,6 @@ import {validateProjectName} from './validate';
import DirectoryAlreadyExistsError from './errors/DirectoryAlreadyExistsError';
import printRunInstructions from './printRunInstructions';
import {CLIError, logger} from '@react-native-community/cli-tools';
import {Config} from '@react-native-community/cli-types';
import {
installTemplatePackage,
getTemplateConfig,
Expand DownExpand Up@@ -47,16 +46,6 @@ function doesDirectoryExist(dir: string) {
return fs.existsSync(dir);
}

function getProjectDirectory({
projectName,
directory,
}: {
projectName: string;
directory: string;
}): string {
return path.relative(process.cwd(), directory || projectName);
}

async function setProjectDirectory(directory: string) {
const directoryExists = doesDirectoryExist(directory);
if (directoryExists) {
Expand DownExpand Up@@ -87,6 +76,8 @@ async function setProjectDirectory(directory: string) {
error,
);
}

return process.cwd();
}

function adjustNameIfUrl(name: string, cwd: string) {
Expand All@@ -112,7 +103,7 @@ async function createFromTemplate({
logger.debug('Initializing new project');
logger.log(banner);

await setProjectDirectory(directory);
const projectDirectory = await setProjectDirectory(directory);

const Loader = getLoader();
const loader = new Loader({text: 'Downloading template'});
Expand DownExpand Up@@ -152,7 +143,12 @@ async function createFromTemplate({
loader.succeed();
}

await installDependencies({projectName, npm, loader});
await installDependencies({
projectName,
npm,
loader,
root: projectDirectory,
});
} catch (e) {
loader.fail();
throw new Error(e);
Expand All@@ -165,16 +161,19 @@ async function installDependencies({
projectName,
npm,
loader,
root,
}: {
projectName: string;
npm?: boolean;
loader: ora.Ora;
root: string;
}) {
loader.start('Installing dependencies');

await PackageManager.installAll({
preferYarn: !npm,
silent: true,
root,
});

if (process.platform === 'darwin') {
Expand DownExpand Up@@ -213,10 +212,9 @@ async function createProject(

export default (async function initialize(
[projectName]: Array<string>,
context: Config,
options: Options,
) {
const rootFolder = context.root;
const root = process.cwd();

validateProjectName(projectName);

Expand All@@ -226,15 +224,12 @@ export default (async function initialize(
*/
const version: string = minimist(process.argv).version || DEFAULT_VERSION;

const directoryName = getProjectDirectory({
projectName,
directory: options.directory || projectName,
});
const directoryName = path.relative(root, options.directory || projectName);

try {
await createProject(projectName, directoryName, version, options);

const projectFolder = path.join(rootFolder, projectName);
const projectFolder = path.join(root, projectName);
printRunInstructions(projectFolder, projectName);
} catch (e) {
logger.error(e.message);
Expand Down
30 changes: 18 additions & 12 deletions packages/cli/src/commands/init/initCompat.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -56,27 +56,33 @@ async function generateProject(
const pkgJson = require('react-native/package.json');
const reactVersion = pkgJson.peerDependencies.react;

PackageManager.setProjectDir(destinationRoot);
await createProjectFromTemplate(
destinationRoot,
newProjectName,
options.template,
);

logger.info('Adding required dependencies');
await PackageManager.install([`react@${reactVersion}`]);
await PackageManager.install([`react@${reactVersion}`], {
root: destinationRoot,
});

logger.info('Adding required dev dependencies');
await PackageManager.installDev([
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
]);
await PackageManager.installDev(
[
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
],
{
root: destinationRoot,
},
);

addJestToPackageJson(destinationRoot);

Expand Down
Loading
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
44 commits
Select commit Hold shift + click to select a range
b3b09ef
Improve handling of files in monorepo
grabbou Oct 3, 2019
440f166
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
1ffc0c2
Remove note about monorepo from the docs
grabbou Oct 3, 2019
391505d
wat
grabbou Oct 3, 2019
e0722c3
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
f85186f
Fix Ruby tests
grabbou Oct 3, 2019
435d314
Always resolve correct root
grabbou Oct 4, 2019
78065e0
Move files around
grabbou Oct 4, 2019
80be9d2
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
3495fe5
Fix tests
grabbou Oct 4, 2019
7e46d77
Assert it works from the same level
grabbou Oct 4, 2019
68639b7
Warn if the root is passed
grabbou Oct 7, 2019
f8de995
Implement monorepo support for Android
grabbou Oct 8, 2019
5041be8
Note custom paths
grabbou Oct 8, 2019
53f59d1
Add quiet flag
grabbou Oct 8, 2019
9dd0ce1
Improve handling of files in monorepo
grabbou Oct 3, 2019
3be7ea4
Fix tests with my poor Ruby haha
grabbou Oct 3, 2019
4091c4c
Remove note about monorepo from the docs
grabbou Oct 3, 2019
27fac31
wat
grabbou Oct 3, 2019
0cbe32d
Okay, this is how you do tests in Ruby
grabbou Oct 3, 2019
e362dc6
Fix Ruby tests
grabbou Oct 3, 2019
19fd10e
Always resolve correct root
grabbou Oct 4, 2019
366b7c4
Move files around
grabbou Oct 4, 2019
553df50
Add tests - one is failing, need to check why
grabbou Oct 4, 2019
858ac79
Fix tests
grabbou Oct 4, 2019
883068f
Assert it works from the same level
grabbou Oct 4, 2019
7733cb2
Warn if the root is passed
grabbou Oct 7, 2019
c4c1745
Implement monorepo support for Android
grabbou Oct 8, 2019
a13e47f
Note custom paths
grabbou Oct 8, 2019
bdcc9fa
Add quiet flag
grabbou Oct 8, 2019
07bd62e
update locfile
thymikee Oct 10, 2019
858ea5e
Fix init - make detachedCommands and remove ugly setProjectDir hack
grabbou Oct 10, 2019
94d8bba
Resolve conflicts
grabbou Oct 10, 2019
81e7b10
Merge branch 'fix/paths' of github.com:react-native-community/react-n…
grabbou Oct 10, 2019
beca41b
Fix remainig uses or root and get rid of cwd
grabbou Oct 10, 2019
cc8c80c
Update paths
grabbou Oct 10, 2019
6661421
Remove unused func
grabbou Oct 10, 2019
781c0e6
Update templates.ts
grabbou Oct 10, 2019
46b0cd3
Fix unit tests
grabbou Oct 10, 2019
5033e50
Better logger
grabbou Oct 10, 2019
cc4b5bf
Debug
grabbou Oct 10, 2019
7402931
Add deprecations
grabbou Oct 10, 2019
90bacbc
Fix a typo
grabbou Oct 10, 2019
d0bd034
Better deprecation message
grabbou Oct 10, 2019
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 11 additions & 47 deletions docs/autolinking.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -36,28 +36,6 @@ The implementation ensures that a library is imported only once. If you need to

See example usage in React Native template's [Podfile](https://github.com/facebook/react-native/blob/0.60-stable/template/ios/Podfile).

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking script assume your project root to be `".."`, relative to `ios` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
ios/
```

you'll need to set a custom root. Pass it as an argument to `use_native_modules!` function inside the targets and adjust the relatively required `native_modules` path accordingly:

```rb
# example/ios/Podfile
require_relative '../../node_modules/@react-native-community/cli-platform-ios/native_modules'
target 'RNapp' do
# React pods and custom pods here...
use_native_modules!("../..")
end
```

## Platform Android

The [native_modules.gradle](https://github.com/react-native-community/cli/blob/master/packages/platform-android/native_modules.gradle) script is included in your project's `settings.gradle` and `app/build.gradle` files and:
Expand All@@ -76,31 +54,6 @@ See example usage in React Native template:
- [app/build.gradle](https://github.com/facebook/react-native/blob/0.60-stable/template/android/app/build.gradle#L185)
- [MainApplication.java](https://github.com/facebook/react-native/blob/769e35ba5f4c31ef913035a5cc8bc0e88546ca55/template/android/app/src/main/java/com/helloworld/MainApplication.java#L22-L28)

### Custom root (monorepos)

The project root is where `node_modules` with `react-native` is. Autolinking scripts assume your project root to be `".."`, relative to `android` directory. If you're in a project with custom structure, like this:

```
root/
node_modules
example/
android/
```

you'll need to set a custom root. Pass it as a second argument to `applyNativeModulesSettingsGradle` and `applyNativeModulesAppBuildGradle` methods and adjust the `native_modules.gradle` path accordingly:

```groovy
// example/android/settings.gradle
apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesSettingsGradle(settings, "../..")
```

```groovy
// example/android/app/build.gradle
apply from: file("../../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
applyNativeModulesAppBuildGradle(project, "../..")
```

## What do I need to have in my package to make it work?

You’re already using Gradle, so Android support will work by default.
Expand DownExpand Up@@ -142,3 +95,14 @@ module.exports = {
},
};
```

## How can I use autolinking in a monorepo?

There is nothing extra you need to do - monorepos are supported by default.

Please note that in certain scenarios, such as when using Yarn workspaces, your packages might be hoisted to the root of the repository. If that is the case, please make sure that the following paths are pointing to the
correct location and update them accordingly:

- path to `native_modules.rb` in your `ios/Podfile`
- path to `native_modules.gradle` in your `android/settings.gradle`
- path to `native_modules.gradle` in your `android/app/build.gradle`
Comment thread
grabbou marked this conversation as resolved.
10 changes: 10 additions & 0 deletions packages/cli-types/src/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -39,6 +39,16 @@ export interface Command<Args = Object> {
}>;
}

export type DetachedCommandFunction<Args = Object> = (
argv: Array<string>,
args: Args,
) => Promise<void> | void;

export type DetachedCommand<Args = Object> = Command<Args> & {
detached: true;
func: DetachedCommandFunction<Args>;
};

interface PlatformConfig<
ProjectConfig,
ProjectParams,
Expand Down
3 changes: 2 additions & 1 deletion packages/cli/package.json
Original file line numberDiff line numberDiff line change
Expand Up@@ -42,6 +42,7 @@
"envinfo": "^7.1.0",
"errorhandler": "^1.5.0",
"execa": "^1.0.0",
"find-up": "^4.1.0",
"fs-extra": "^7.0.1",
"glob": "^7.1.1",
"graceful-fs": "^4.1.3",
Expand DownExpand Up@@ -71,8 +72,8 @@
},
"devDependencies": {
"@types/command-exists": "^1.2.0",
"@types/graceful-fs": "^4.1.3",
"@types/cosmiconfig": "^5.0.3",
"@types/graceful-fs": "^4.1.3",
"@types/hapi__joi": "^15.0.4",
"@types/minimist": "^1.2.0",
"@types/mkdirp": "^0.5.2",
Expand Down
43 changes: 28 additions & 15 deletions packages/cli/src/cliEntry.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -14,14 +14,12 @@ import path from 'path';

import type {CommandT, ConfigT} from 'types';
// $FlowFixMe - converted to TS
import commands from './commands';
import {detachedCommands, projectCommands} from './commands';
// $FlowFixMe - converted to TS
import init from './commands/init/initCompat';
// $FlowFixMe - converted to TS
import assertRequiredOptions from './tools/assertRequiredOptions';
import {logger} from '@react-native-community/cli-tools';
// $FlowFixMe - converted to TS
import {setProjectDir} from './tools/packageManager';
import pkgJson from '../package.json';
// $FlowFixMe - converted to TS
import loadConfig from './tools/config';
Expand DownExpand Up@@ -117,7 +115,11 @@ const addCommand = (command: CommandT, ctx: ConfigT) => {

try {
assertRequiredOptions(options, passedOptions);
await command.func(argv, ctx, passedOptions);
if (command.detached) {
await command.func(argv, passedOptions);
} else {
await command.func(argv, ctx, passedOptions);
}
} catch (error) {
handleError(error);
}
Expand DownExpand Up@@ -149,6 +151,9 @@ async function run() {
}

async function setupAndRun() {
// Commander is not available yet
logger.setVerbose(process.argv.includes('--verbose'));

// We only have a setup script for UNIX envs currently
if (process.platform !== 'win32') {
const scriptName = 'setup_env.sh';
Expand All@@ -168,19 +173,29 @@ async function setupAndRun() {
}
}

// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}
detachedCommands.forEach(addCommand);

const ctx = loadConfig();
try {
// when we run `config`, we don't want to output anything to the console. We
// expect it to return valid JSON
if (process.argv.includes('config')) {
logger.disable();
}

logger.enable();
const ctx = loadConfig();
Comment thread
grabbou marked this conversation as resolved.

setProjectDir(ctx.root);
logger.enable();

[...commands, ...ctx.commands].forEach(command => addCommand(command, ctx));
[...projectCommands, ...ctx.commands].forEach(command =>
addCommand(command, ctx),
);
} catch (e) {
logger.enable();
logger.debug(e.message);
logger.debug(
'Failed to load configuration of your project. Only a subset of commands will be available.',
);
}

commander.parse(process.argv);

Expand All@@ -194,8 +209,6 @@ async function setupAndRun() {
if (commander.args.length === 0 && commander.rawArgs.includes('--version')) {
console.log(pkgJson.version);
}

logger.setVerbose(commander.verbose);
}

export default {
Expand Down
7 changes: 4 additions & 3 deletions packages/cli/src/commands/index.ts
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
import {Command} from '@react-native-community/cli-types';
import {DetachedCommand, Command} from '@react-native-community/cli-types';

// @ts-ignore - JS file
import server from './server/server';
Expand All@@ -15,7 +15,7 @@ import init from './init';
// @ts-ignore - JS file
import doctor from './doctor';

export default [
export const projectCommands = [
server,
bundle,
ramBundle,
Expand All@@ -26,6 +26,7 @@ export default [
upgrade,
info,
config,
init,
doctor,
] as Command[];

export const detachedCommands = [init] as DetachedCommand[];
2 changes: 1 addition & 1 deletion packages/cli/src/commands/init/__tests__/template.test.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -26,7 +26,7 @@ test('installTemplatePackage', async () => {
expect(PackageManger.install).toHaveBeenCalledWith([TEMPLATE_NAME], {
preferYarn: false,
silent: true,
cwd: TEMPLATE_SOURCE_DIR,
root: TEMPLATE_SOURCE_DIR,
});
});

Expand Down
1 change: 1 addition & 0 deletions packages/cli/src/commands/init/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,7 @@ import init from './init';

export default {
func: init,
detached: true,
name: 'init <projectName>',
description:
'Initialize a new React Native project named <projectName> in a directory of the same name.',
Expand Down
35 changes: 15 additions & 20 deletions packages/cli/src/commands/init/init.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,6 @@ import {validateProjectName} from './validate';
import DirectoryAlreadyExistsError from './errors/DirectoryAlreadyExistsError';
import printRunInstructions from './printRunInstructions';
import {CLIError, logger} from '@react-native-community/cli-tools';
import {Config} from '@react-native-community/cli-types';
import {
installTemplatePackage,
getTemplateConfig,
Expand DownExpand Up@@ -47,16 +46,6 @@ function doesDirectoryExist(dir: string) {
return fs.existsSync(dir);
}

function getProjectDirectory({
projectName,
directory,
}: {
projectName: string;
directory: string;
}): string {
return path.relative(process.cwd(), directory || projectName);
}

async function setProjectDirectory(directory: string) {
const directoryExists = doesDirectoryExist(directory);
if (directoryExists) {
Expand DownExpand Up@@ -87,6 +76,8 @@ async function setProjectDirectory(directory: string) {
error,
);
}

return process.cwd();
}

function adjustNameIfUrl(name: string, cwd: string) {
Expand All@@ -112,7 +103,7 @@ async function createFromTemplate({
logger.debug('Initializing new project');
logger.log(banner);

await setProjectDirectory(directory);
const projectDirectory = await setProjectDirectory(directory);

const Loader = getLoader();
const loader = new Loader({text: 'Downloading template'});
Expand DownExpand Up@@ -152,7 +143,12 @@ async function createFromTemplate({
loader.succeed();
}

await installDependencies({projectName, npm, loader});
await installDependencies({
projectName,
npm,
loader,
root: projectDirectory,
});
} catch (e) {
loader.fail();
throw new Error(e);
Expand All@@ -165,16 +161,19 @@ async function installDependencies({
projectName,
npm,
loader,
root,
}: {
projectName: string;
npm?: boolean;
loader: ora.Ora;
root: string;
}) {
loader.start('Installing dependencies');

await PackageManager.installAll({
preferYarn: !npm,
silent: true,
root,
});

if (process.platform === 'darwin') {
Expand DownExpand Up@@ -213,10 +212,9 @@ async function createProject(

export default (async function initialize(
[projectName]: Array<string>,
context: Config,
options: Options,
) {
const rootFolder = context.root;
const root = process.cwd();

validateProjectName(projectName);

Expand All@@ -226,15 +224,12 @@ export default (async function initialize(
*/
const version: string = minimist(process.argv).version || DEFAULT_VERSION;

const directoryName = getProjectDirectory({
projectName,
directory: options.directory || projectName,
});
const directoryName = path.relative(root, options.directory || projectName);

try {
await createProject(projectName, directoryName, version, options);

const projectFolder = path.join(rootFolder, projectName);
const projectFolder = path.join(root, projectName);
printRunInstructions(projectFolder, projectName);
} catch (e) {
logger.error(e.message);
Expand Down
30 changes: 18 additions & 12 deletions packages/cli/src/commands/init/initCompat.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -56,27 +56,33 @@ async function generateProject(
const pkgJson = require('react-native/package.json');
const reactVersion = pkgJson.peerDependencies.react;

PackageManager.setProjectDir(destinationRoot);
await createProjectFromTemplate(
destinationRoot,
newProjectName,
options.template,
);

logger.info('Adding required dependencies');
await PackageManager.install([`react@${reactVersion}`]);
await PackageManager.install([`react@${reactVersion}`], {
root: destinationRoot,
});

logger.info('Adding required dev dependencies');
await PackageManager.installDev([
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
]);
await PackageManager.installDev(
[
'@babel/core',
'@babel/runtime',
'@react-native-community/eslint-config',
'eslint',
'jest',
'babel-jest',
'metro-react-native-babel-preset',
`react-test-renderer@${reactVersion}`,
],
{
root: destinationRoot,
},
);

addJestToPackageJson(destinationRoot);

Expand Down
Loading