mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Riccardo Cipolleschi
e4257a4dfb
Summary: Pull Request resolved: https://github.com/facebook/react-native/pull/36335 This change depends on [this PR](https://github.com/react-native-community/cli/pull/1849) of the CLI that introduces the `unstable_reactLegacyComponent` field in the `react-native.config.js` file. This change introduce a JS script that reads that fields and generated a method in an object to return a list of components to be registered. The `RCTAppDelegate` has been updated to read those components and to automatically register them into the interop layer. Notice that a user can just update the `react-native.config.js` and rebuild the app to integrate these changes, there is no need to reinstall the pods. The idea behind this logic is to let the user know which components they are using with the interop layer, rather than rely on some black magic that could leave them blind to the need of actually migrate their apps. ## Changelog: [iOS][Changed] - Implement mechanism to register legacy components in the iOS Fabric interop layer Reviewed By: cortinico, dmytrorykun Differential Revision: D43665973 fbshipit-source-id: b4e8d71fa1bbed7a6130ee4f83a6221394d5306e
90 lines
2.2 KiB
JavaScript
90 lines
2.2 KiB
JavaScript
/**
|
|
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*
|
|
* @format
|
|
*/
|
|
|
|
'use strict';
|
|
|
|
const yargs = require('yargs');
|
|
const fs = require('fs');
|
|
|
|
const CONFIG_FILE_NAME = 'react-native.config.js';
|
|
const LEGACY_COMPONENTS_FIELD = 'unstable_reactLegacyComponent';
|
|
const OUTPUT_FILE_NAME = 'RCTLegacyInteropComponents.mm';
|
|
|
|
const argv = yargs
|
|
.option('p', {
|
|
alias: 'path',
|
|
description: 'Path to React Native application',
|
|
})
|
|
.option('o', {
|
|
alias: 'outputPath',
|
|
description: 'Path where generated artifacts will be output to',
|
|
})
|
|
.usage('Usage: $0 -p [path to app]')
|
|
.demandOption(['p']).argv;
|
|
|
|
const appRoot = argv.path;
|
|
const outputPath = argv.outputPath;
|
|
|
|
function fileBody(components) {
|
|
// eslint-disable duplicate-license-header
|
|
return `
|
|
/*
|
|
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*/
|
|
|
|
#import "RCTLegacyInteropComponents.h"
|
|
|
|
@implementation RCTLegacyInteropComponents
|
|
|
|
+ (NSArray<NSString *> *)legacyInteropComponents
|
|
{
|
|
return @[
|
|
${components}
|
|
];
|
|
}
|
|
|
|
@end
|
|
`;
|
|
// eslint-enable duplicate-license-header
|
|
}
|
|
|
|
function generateRCTLegacyInteropComponents() {
|
|
const configFilePath = `${appRoot}/${CONFIG_FILE_NAME}`;
|
|
let reactNativeConfig = null;
|
|
try {
|
|
reactNativeConfig = require(configFilePath);
|
|
} catch (error) {
|
|
console.log(`No ${configFilePath}. Skip LegacyInterop generation`);
|
|
}
|
|
|
|
if (reactNativeConfig && reactNativeConfig[LEGACY_COMPONENTS_FIELD]) {
|
|
let componentsArray = reactNativeConfig[LEGACY_COMPONENTS_FIELD].map(
|
|
name => `\t\t\t@"${name}",`,
|
|
);
|
|
// Remove the last comma
|
|
if (componentsArray.length > 0) {
|
|
componentsArray[componentsArray.length - 1] = componentsArray[
|
|
componentsArray.length - 1
|
|
].slice(0, -1);
|
|
}
|
|
|
|
const filePath = `${outputPath}/${OUTPUT_FILE_NAME}`;
|
|
fs.writeFileSync(filePath, fileBody(componentsArray.join('\n')));
|
|
} else {
|
|
console.log(
|
|
`No '${LEGACY_COMPONENTS_FIELD}' field. Skip LegacyInterop generation`,
|
|
);
|
|
}
|
|
}
|
|
|
|
generateRCTLegacyInteropComponents();
|