1"use strict";(self.webpackChunkrenative_docs=self.webpackChunkrenative_docs||[]).push([[1632],{1022:(e,n,i)=>{i.r(n),i.d(n,{assets:()=>a,contentTitle:()=>t,default:()=>h,frontMatter:()=>o,metadata:()=>d,toc:()=>c});var r=i(4848),s=i(8453);const o={id:"1.0",title:"Upgrade to 1.0.x Guide",sidebar_label:"1.0.x",original_id:"1.0",sidebar_position:1},t=void 0,d={id:"upgrades/1.0",title:"Upgrade to 1.0.x Guide",description:"--\x3e",source:"@site/docs/upgrades/1.0.md",sourceDirName:"upgrades",slug:"/upgrades/1.0",permalink:"/docs/upgrades/1.0",draft:!1,unlisted:!1,editUrl:"https://github.com/facebook/docusaurus/edit/main/website/docs/upgrades/1.0.md",tags:[],version:"current",sidebarPosition:1,frontMatter:{id:"1.0",title:"Upgrade to 1.0.x Guide",sidebar_label:"1.0.x",original_id:"1.0",sidebar_position:1},sidebar:"guidesSidebar",previous:{title:"Workspaces",permalink:"/docs/concepts/workspaces"},next:{title:"0.37.x",permalink:"/docs/upgrades/0.37"}},a={},c=[{value:"Requirements",id:"requirements",level:2},{value:"Important Links",id:"important-links",level:2},{value:"Dependencies",id:"dependencies",level:2},{value:"Hooks",id:"hooks",level:2},{value:"renative.json",id:"renativejson",level:2},{value:"Plugins",id:"plugins",level:2},{value:"Config files key changes",id:"config-files-key-changes",level:2},{value:"Common props",id:"common-props",level:3},{value:"IOS common props",id:"ios-common-props",level:3},{value:"Android common props",id:"android-common-props",level:3},{value:"App configs",id:"app-configs",level:2},{value:"Config files",id:"config-files",level:2},{value:"Misc changes",id:"misc-changes",level:2},{value:"Overrides",id:"overrides",level:2},{value:"Engine tasks",id:"engine-tasks",level:2},{value:"Next.js web changes",id:"nextjs-web-changes",level:2},{value:"iOS",id:"ios",level:2},{value:"Common Errors",id:"common-errors",level:2},{value:"<code>[ info ] could not find suitable task for {task}. GETTING OPTIONS...</code>",id:"-info--could-not-find-suitable-task-for-task-getting-options",level:4},{value:"<code>error Cannot find module 'metro-runtime/src/modules/empty-module.js'</code>",id:"error-cannot-find-module-metro-runtimesrcmodulesempty-modulejs",level:4},{value:"<code>General error during semantic analysis: Unsupported class file major version 61</code>",id:"general-error-during-semantic-analysis-unsupported-class-file-major-version-61",level:3},{value:"<code>Dependency 'XXXXXX' requires libraries and applications that depend on it to compile against version 34 or later of the Android APIs.</code>",id:"dependency-xxxxxx-requires-libraries-and-applications-that-depend-on-it-to-compile-against-version-34-or-later-of-the-android-apis",level:3},{value:"<code>General error during semantic analysis: Unsupported class file major version 61</code>",id:"general-error-during-semantic-analysis-unsupported-class-file-major-version-61-1",level:4},{value:"<code>Dependency 'XXXXXX' requires libraries and applications that depend on it to compile against version 34 or later of the Android APIs.</code>",id:"dependency-xxxxxx-requires-libraries-and-applications-that-depend-on-it-to-compile-against-version-34-or-later-of-the-android-apis-1",level:4},{value:"<code>error: \u2a2f Error: Cannot find module '@rnv/core'</code>",id:"error--error-cannot-find-module-rnvcore",level:4}];function l(e){const n={a:"a",blockquote:"blockquote",code:"code",h2:"h2",h3:"h3",h4:"h4",hr:"hr",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,s.R)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(n.hr,{}),"\n",(0,r.jsx)(n.h2,{id:"requirements",children:"Requirements"}),"\n",(0,r.jsxs)(n.p,{children:["Node: ",(0,r.jsx)(n.code,{children:">=18.0.0"}),"\nXcode: ",(0,r.jsx)(n.code,{children:">=15.0"}),"\nRuby: ",(0,r.jsx)(n.code,{children:">=3.0.0"}),"\nJava: ",(0,r.jsx)(n.code,{children:">=17.0.0"})]}),"\n",(0,r.jsx)(n.h2,{id:"important-links",children:"Important Links"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsx)(n.li,{children:(0,r.jsx)(n.a,{href:"https://github.com/flexn-io/renative-upgrade-example/pull/1",children:"Pull request in template starter based example project documenting the changes needed in code form"})}),"\n"]}),"\n",(0,r.jsx)(n.h2,{id:"dependencies",children:"Dependencies"}),"\n",(0,r.jsx)(n.p,{children:"Start by updating all the ReNative dependencies in your project package.json:"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-json",children:'"devDependencies": {\n "@rnv/template-starter": "1.0.0",\n "@rnv/engine-rn": "1.0.0",\n "@rnv/engine-rn-tvos": "1.0.0",\n "@rnv/engine-rn-next": "1.0.0",\n "@rnv/engine-rn-web": "1.0.0",\n "@rnv/engine-rn-electron": "1.0.0",\n "@rnv/core": "1.0.0",\n "@rnv/cli": "1.0.0",\n "@rnv/config-templates": "1.0.0"\n},\n"dependencies": {\n "@rnv/renative": "1.0.0",\n}\n'})}),"\n",(0,r.jsx)(n.p,{children:"When doing so, make sure to add 2 new depen
1dencies, that split out some of older functionality:"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsx)(n.li,{children:"@rnv/core"}),"\n",(0,r.jsx)(n.li,{children:"@rnv/config-templates"}),"\n"]}),"\n",(0,r.jsxs)(n.blockquote,{children:["\n",(0,r.jsx)(n.p,{children:'Also note dependency change of rnv CLI. You should remove "rnv" and instead use "@rnv/cli"'}),"\n"]}),"\n",(0,r.jsx)(n.p,{children:"Then update versions of other packages:"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-json",children:'"devDependencies": {\n "@flexn/assets-renative-outline": "0.3.5",\n "@types/react": "18.2.52",\n "@types/react-dom": "18.2.18",\n "@types/react-native": "0.72.3",\n "babel-loader": "9.1.3",\n},\n"dependencies": {\n "react-native-web": "0.19.12",\n "react": "18.2.0",\n "react-art": "18.2.0",\n "react-dom": "18.2.0",\n "react-native-gesture-handler": "2.14.1",\n "react-native": "0.73.4"\n}\n'})}),"\n",(0,r.jsx)(n.p,{children:"Remove these packages:"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-json",children:'"dependencies": {\n "@react-native-community/cli-platform-ios": "^6.0.0",\n "@react-native-community/cli": "^6.0.0"\n}\n'})}),"\n",(0,r.jsx)(n.p,{children:"Move these dependencies from devDependencies to dependencies:"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-json",children:'"@rnv/renative": "1.0.0-rc.19",\n"react": "18.2.0",\n"react-art": "18.2.0",\n"react-dom": "18.2.0",\n"react-native-gesture-handler": "2.14.1",\n"react-native": "0.73.4",\n'})}),"\n",(0,r.jsxs)(n.p,{children:["Make sure any renative versions referenced in your ",(0,r.jsx)(n.code,{children:"renative.json"})," are updated to ",(0,r.jsx)(n.code,{children:"1.0.0"})," as well."]}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-json",children:' "templateConfig": {\n "name": "@rnv/template-starter",\n "version": "1.0.0"\n },\n'})}),"\n",(0,r.jsx)(n.p,{children:"After the update first thing you should do is to include a reference to JSON schema provided by ReNative at the top of your renative.json file:"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-json",children:'"$schema": ".rnv/schema/rnv.project.json",\n'})}),"\n",(0,r.jsx)(n.p,{children:"This should immediately help with further steps by highlighting the properties that are no longer supported, or which names have changed."}),"\n",(0,r.jsx)("table",{children:(0,r.jsx)("tr",{children:(0,r.jsx)("th",{children:(0,r.jsx)("img",{src:"/img/small_autocomplete.gif"})})})}),"\n",(0,r.jsx)(n.h2,{id:"hooks",children:"Hooks"}),"\n",(0,r.jsxs)(n.p,{children:["Update your hooks to use the new imports. Imports have been moved to ",(0,r.jsx)(n.code,{children:"@rnv/core"})," package. For more information you can reffer to ",(0,r.jsx)(n.a,{href:"api/node/rnv-core/modules",children:"Core's Node API Documentation"}),". For example, change"]}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"import { Logger, executeAsync } from 'rnv';\n...\nLogger.logTask('Hello World');\n\n"})}),"\n",(0,r.jsx)(n.p,{children:"to"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"import { logTask, executeAsync } from '@rnv/core';\nlogTask('Hello World');\n"})}),"\n",(0,r.jsxs)(n.p,{children:["Also, in the new version of ReNative TypeScript hooks are supported, so if you are using TypeScript in your project make sure to remove the old directories(not only the .js files) ",(0,r.jsx)(n.code,{children:"buildHooks/src"})," and ",(0,r.jsx)(n.code,{children:"buildHooks/dist"})," even if you haven't and don't plan on using the hooks. If you have not used the hooks, new renative version will try to add a ts file."]}),"\n",(0,r.jsx)(n.h2,{id:"renativejson",children:"renative.json"}),"\n",(0,r.jsx)(n.p,{children:"As mentioned earlier, start with by adding JSON schema provided by ReNative at the top of your renative.json file:"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-json",children:'"$schema": ".rnv/schema/rnv.project.json",\n'})}),"\n",(0,r.jsxs)(n.p,{children:["This should highlight properties, such as ",(0,r.jsx)(n.code,{children:"defaults.title"}),", ",(0,r.jsx)(n.code,{children:"templates"})," as not supported, most likely there will be more. Please find the new configuration names and structure for each of the changed things. Moving from the default template based application on 0.37.4 to 1.0, changes are:"]}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"templates"})," and ",(0,r.jsx)(n.code,{children:"currentTemplate"})," changed to ",(0,r.jsx)(n.code,{children:"templateConfig"})]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"title"})," and ",(0,r.jsx)(n.code,{children:"id"})," in ",(0,r.jsx)(n.code,{children:"defaults"})," are no longer supported and should be removed"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"entryDir"})," in ",(0,r.jsx)(n.code,{children:"paths"})," also should be removed"]}),"\n"]}),"\n",(0,r.jsxs)(n.p,{children:["If your project ",(0,r.jsx)(n.code,{children:"renative.json"})," extends a template (for example ",(0,r.jsx)(n.code,{children:"@rnv/template-starter"}),"), make sure the plugins section does not contain any overrides that might impede the upgrade. For example, if you have a plugin override like this:"]}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-json",children:'"plugins": {\n "@react-native-community/cli-platform-ios": "source:rnv",\n "@react-native-community/cli": "source:rnv",\n "react-native-tvos": "source:rnv",\n "react-native-web": "source:rnv",\n "next": "source:rnv"\n}\n'})}),"\n",(0,r.jsx)(n.p,{children:"You should remove it, as the new versions of the plugins will be inherited from the template. If you have added any custom plugins now is a good time to see if you can update these as well but that is something outside the scope of this guide."}),"\n",(0,r.jsxs)(n.blockquote,{children:["\n",(0,r.jsx)(n.p,{children:"The 1.0 version of ReNative uses the 0.73.4 of React Native, 0.73.6-0 of React Native tvOS and v14 of Next.js, so make sure that the versions of plugins you are using, if any are custom specified that is, are compatible with newer versions of the various updated frameworks."}),"\n"]}),"\n",(0,r.jsx)(n.h2,{id:"plugins",children:"Plugins"}),"\n",(0,r.jsxs)(n.p,{children:["The plugin definition structure has changed in 1.0.0. If you have plugins defined in your ",(0,r.jsx)(n.code,{children:"renative.json"})," you should update the structure to the new format. For example, if you have a plugin defined like this:"]}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-json",children:'"plugins": {\n "@mapbox/react-native-mapbox-gl": {\n "android": {\
1n "implementation": " implementation (project(\':mapbox-react-native-mapbox-gl\')) {\\n implementation (\'com.squareup.okhttp3:okhttp:3.6.0\') {\\n force = true\\n }\\n }",\n "package": "com.mapbox.rctmgl.RCTMGLPackage",\n "path": "{{PLUGIN_ROOT}}/android/rctmgl",\n "projectName": "mapbox-react-native-mapbox-gl"\n },\n "ios": {\n "appDelegateImports": ["RNCPushNotificationIOS"],\n "appDelegateMethods": {\n "application": {\n "didFailToRegisterForRemoteNotificationsWithError": [\n "RNCPushNotificationIOS.didFailToRegisterForRemoteNotificationsWithError(error)"\n ],\n "didReceive": null,\n "didReceive": ["RNCPushNotificationIOS.didReceive(notification)"],\n "didReceiveRemoteNotification": [\n "RNCPushNotificationIOS.didReceiveRemoteNotification(userInfo, fetchCompletionHandler: completionHandler)"\n ],\n "didRegister": ["RNCPushNotificationIOS.didRegister(notificationSettings)"],\n "didRegisterForRemoteNotificationsWithDeviceToken": [\n "RNCPushNotificationIOS.didRegisterForRemoteNotifications(withDeviceToken: deviceToken)"\n ]\n },\n "userNotificationCenter": {\n "willPresent": ["completionHandler([.alert, .badge, .sound])"]\n }\n },\n "path": "{{PLUGIN_ROOT}}",\n "podName": "RNCPushNotificationIOS"\n },\n }\n}\n\n'})}),"\n",(0,r.jsxs)(n.p,{children:["Both ",(0,r.jsx)(n.code,{children:"ios"})," and ",(0,r.jsx)(n.code,{children:"android"})," platforms have suffered some changes to the structure. Most properties are now nested under ",(0,r.jsx)(n.code,{children:"templateAndroid"})," or ",(0,r.jsx)(n.code,{children:"templateXcode"}),". For example, the above plugin definition should be updated to:"]}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-json",children:'"plugins": {\n "@mapbox/react-native-mapbox-gl": {\n "android": {\n "templateAndroid": {\n "implementation": " implementation (project(\':mapbox-react-native-mapbox-gl\')) {\\n implementation (\'com.squareup.okhttp3:okhttp:3.6.0\') {\\n force = true\\n }\\n }",\n },\n "package": "com.mapbox.rctmgl.RCTMGLPackage",\n "path": "{{PLUGIN_ROOT}}/android/rctmgl",\n "projectName": "mapbox-react-native-mapbox-gl"\n },\n "ios": {\n "templateXcode": {\n "appDelegateImports": ["RNCPushNotificationIOS"],\n "appDelegateMethods": {\n "application": {\n "didFailToRegisterForRemoteNotificationsWithError": [\n "RNCPushNotificationIOS.didFailToRegisterForRemoteNotificationsWithError(error)"\n ],\n "didReceive": null,\n "didReceive": ["RNCPushNotificationIOS.didReceive(notification)"],\n "didReceiveRemoteNotification": [\n "RNCPushNotificationIOS.didReceiveRemoteNotification(userInfo, fetchCompletionHandler: completionHandler)"\n ],\n "didRegister": ["RNCPushNotificationIOS.didRegister(notificationSettings)"],\n "didRegisterForRemoteNotificationsWithDeviceToken": [\n "RNCPushNotificationIOS.didRegisterForRemoteNotifications(withDeviceToken: deviceToken)"\n ]\n },\n "userNotificationCenter": {\n "willPresent": ["completionHandler([.alert, .badge, .sound])"]\n }\n },\n },\n "path": "{{PLUGIN_ROOT}}",\n "podName": "RNCPushNotificationIOS"\n },\n }\n}\n'})}),"\n",(0,r.jsxs)(n.p,{children:["For a full overview of the new plugin definition structure, you can refer to the ",(0,r.jsx)(n.a,{href:"api/schemas/rnv.plugin",children:"Plugin Definition Documentation"}),"."]}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.strong,{children:"Important"})," For iOS and tvOS platforms we migrated from Swift to Objective-C. If you have any Swift code injections in your project you should migrate it to Objective-C."]}),"\n",(0,r.jsx)(n.h2,{id:"config-files-key-changes",children:"Config files key changes"}),"\n",(0,r.jsx)(n.p,{children:"Here is a list of main changes in ReNative schema."}),"\n",(0,r.jsxs)("table",{children:[(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Old key"})})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"New key"})})})]}),(0,r.jsx)("tr",{children:(0,r.jsx)("th",{colspan:"2",children:(0,r.jsx)(n.h3,{id:"common-props",children:"Common props"})})}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"timestampAssets"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"timestampBuildFiles"})})]}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"versionedAssets"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"deprecated"})})]}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"deploy"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"deprecated"})})]}),(0,r.jsx)("tr",{children:(0,r.jsx)("th",{colspan:"2",children:(0,r.jsx)(n.h3,{id:"ios-common-props",children:"IOS common props"})})}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"Podfile"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"[nested in templateXcode]"})})]}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"xcodeproj"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"project_pbxproj [nested in templateXcode]"})})]}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"plist"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"Info_plist [nested in templateXcode]"})})]}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"appDelegateApplicationMethods"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"appDelegateMethods [nested in AppDelegate_mm/AppDelegate_h]"})})]}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"appDelegateMethods"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"[nested in AppDelegate_mm/AppDelegate_h]"})})]}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"appDelegateExtensions"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"[nested in AppDelegate_h]"})})]}),(0,r.jsx)("tr",{children:(0,r.jsx)("th",{colspan:"2",children:(0,r.jsx)(n.h3,{id:"android-common-props",children:"Android common props"})})}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"gradle.properties"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"gradle_properties[nested in templateAndroid]"})})]}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"build.gradle"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"build_gradle[nested in templateAndroid]"})})]}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"app/build.gradle"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"app_build_gradle[nested in templateAndroid]"})})]}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"AndroidManifest"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"AndroidManifest_xml[nested in templateAndroid]"})})]}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"applyPlugin"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"includedPlugins"})})]}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"BuildGradle"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"build_gradle[nested in templateAndroid]"})})]}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"mainActivity"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"MainActivity_kt"})})]}),(0,r.jsxs)("tr",{children:[(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"no-npm"})}),(0,r.jsx)("th",{children:(0,r.jsx)(n.p,{children:"disableNpm"})})]})]}),"\n",(0,r.jsx)(n.h2,{id:"app-configs",children:"App configs"}),"\n",(0,r.jsxs)(n.p,{children:["Add ",(0,r.jsx)(n.code,{children:"rnv.json"})," in appConfigs/app:"]}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-json",children:'{\n "$schema": "../../.rnv/schema/renative-1.0.schema.json",\n "app": {\n "extendsTemplate": "@rnv/template-starter/appConfigs/base/rnv.json",\n "id": "app"\n },\n "project": {}\n}\n'})}),"\n",(0,r.jsxs)(n.p,{children:["Extent the schema in your ",(0,r.jsx)(n.code,{children:"appConfigs/app/renative.json"})," to highlight any other changes like this at the top of the file:"]}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-json",children:'"$schema": "../../.rnv/schema/rnv.app.json",\n'})}),"\n",(0,r.jsx)(n.h2,{id:"config-files",children:"Config files"}),"\n",(0,r.jsx)(n.p,{children:"change metro.config.js file from"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"const { withRNVMetro } = require('rnv');\n\nmodule.exports = withRNVMetro({});\n"})}),"\n",(0,r.jsx)(n.p,{children:"to"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"const { withRNVMetro } = require('@rnv/adapter');\n\nmodule.exports = withRNVMetro({});\n"})}),"\n",(0,r.jsx)(n.p,{children:"Create a react-native.config.js file and add:"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"const { withRNVRNConfig } = require('@rnv/adapter');\n\nconst config = withRNVRNConfig({});\n\nmodule.exports = config;\n"})}),"\n",(0,r.jsx)(n.p,{children:"Create a webpack.config.js file and add:"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"const { withRNVWebpack } = require('@rnv/adapter');\n\nmodule.exports = withRNVWebpack({});\n"})}),"\n",(0,r.jsx)(n.h2,{id:"misc-changes",children:"Misc changes"}),"\n",(0,r.jsx)(n.p,{children:"Change src/entry/index.ts from:"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"import 'react-native/Libraries/Core/InitializeCore'; //https://github.com/flexn-io/renative/issues/876\nimport { AppRegistry } from 'react-native';\nimport App from '../app';\n\nAppRegistry.registerComponent('App', () => App);\n"})}),"\n",(0,r.jsx)(n.p,{children:"to"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"import { AppRegistry } from 'react-native';\nimport App from '../app';\n\nAppRegistry.registerComponent('RNVApp', () => App);\n"})}),"\n",(0,r.jsx)(n.p,{children:"Create typings/assets.d.ts file for image recognition and add:"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"declare module '*.png';\ndeclare module '*.jpg';\n"})}),"\n",(0,r.jsx)(n.p,{children:"Previously by default in src/config.ts this line existed, which crashed the apps. Remove it if it exists."}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"console.disableYellowBox = true; // eslint-disable-line\n"})}),"\n",(0,r.jsx)(n.p,{children:"Update src/entry/index.lng.ts from:"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"import { Launch } from '@lightningjs/sdk';\nimport App from '../app';\n\nconst Main = (...args) => Launch(App, ...args);\n\nexport default Main;\n"})}),"\n",(0,r.jsx)(n.p,{children:"to"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"import { Launch } from '@lightningjs/sdk';\nimport App from '../app';\n\nconst app: any = App; //Temp lng.ts type workaround\n\nconst Main = (appSettings, platformSettings, appData) =>
1 Launch(app, appSettings, platformSettings, appData);\n\nexport default Main;\n"})}),"\n",(0,r.jsx)(n.p,{children:"Change src/entry/index.web.ts file from .ts to .tsx structure:"}),"\n",(0,r.jsx)(n.p,{children:"From index.web.ts:"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"import React from 'react';\nimport ReactDOM from 'react-dom';\nimport App from '../app';\n\nReactDOM.render(React.createElement(App), document.getElementById('root'));\n"})}),"\n",(0,r.jsx)(n.p,{children:"To index.web.tsx:"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"import React from 'react';\nimport ReactDOM from 'react-dom/client';\nimport App from '../app';\n\nconst root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement);\nroot.render(\n <React.StrictMode>\n <App />\n </React.StrictMode>\n);\n"})}),"\n",(0,r.jsx)(n.h2,{id:"overrides",children:"Overrides"}),"\n",(0,r.jsxs)(n.p,{children:["Make sure you doublecheck your overrides to make sure you still need them. For example if you override the whole Podfile from ",(0,r.jsx)(n.code,{children:"appConfigs/{config}/builds/{platform}/Podfile"})," from version 0.37 it will break the build. A better approach would be to remove the override (rename it for backup) and see if the build still works. If it does, you can remove the override. If it doesn't, you can check the new Podfile from ",(0,r.jsx)(n.code,{children:"platformBuilds"})," and use that as a baseline for overriding."]}),"\n",(0,r.jsx)(n.h2,{id:"engine-tasks",children:"Engine tasks"}),"\n",(0,r.jsxs)(n.p,{children:["Some of the engine tasks have been removed. Previously there were tasks on certain engines that were more or less aliases for another task. For example, ",(0,r.jsx)(n.code,{children:"export"})," was an alias for ",(0,r.jsx)(n.code,{children:"build"})," on the ",(0,r.jsx)(n.code,{children:"@rnv/engine-rn-web"})," engine. These aliases have been removed and you should use the tasks from the engine directly. For more information on the tasks available for each engine you can refer to the ",(0,r.jsx)(n.a,{href:"api/cli#commands",children:"RNV CLI Documentation"}),"."]}),"\n",(0,r.jsx)(n.h2,{id:"nextjs-web-changes",children:"Next.js web changes"}),"\n",(0,r.jsxs)(n.p,{children:["Update ",(0,r.jsx)(n.code,{children:"next.config.js"})," imported rnv function. ",(0,r.jsx)(n.code,{children:"withRNV"})," has been changed to ",(0,r.jsx)(n.code,{children:"withRNVNext"})," from ",(0,r.jsx)(n.code,{children:"@rnv/adapter"}),"."]}),"\n",(0,r.jsxs)(n.p,{children:["Another change you need to do is updating the ",(0,r.jsx)(n.code,{children:"babel.config"}),". ",(0,r.jsx)(n.code,{children:"withRNVBabel"})," is now imported from ",(0,r.jsx)(n.code,{children:"@rnv/adapter"})," as well."]}),"\n",(0,r.jsx)(n.p,{children:"Finally, you might need to take make changes to your code as with v14 of Next.js, prerendering is done server side, so some code might break. One way to solve this is that you can add checks by using useEffect and state:"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-typescript",children:" const [isClient, setIsClient] = useState(false);\n\n useEffect(() => {\n setIsClient(true);\n }, []);\n"})}),"\n",(0,r.jsx)(n.h2,{id:"ios",children:"iOS"}),"\n",(0,r.jsx)(n.p,{children:"Add missing Gemfile in the root of your project."}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-Gemfile",children:"source 'https://rubygems.org'\n\n# You may use http://rbenv.org/ or https://rvm.io/ to install and use this version\nruby \">= 2.6.10\"\n\ngem 'cocoapods', '~> 1.13', '< 1.15'\ngem 'activesupport', '>= 6.1.7.3', '< 7.1.0'\n"})}),"\n",(0,r.jsx)(n.h2,{id:"common-errors",children:"Common Errors"}),"\n",(0,r.jsx)(n.h4,{id:"-info--could-not-find-suitable-task-for-task-getting-options",children:(0,r.jsx)(n.code,{children:"[ info ] could not find suitable task for {task}. GETTING OPTIONS..."})}),"\n",(0,r.jsxs)(n.p,{children:["see ",(0,r.jsx)(n.a,{href:"#engine-tasks",children:"Engine tasks"})]}),"\n",(0,r.jsx)(n.h4,{id:"error-cannot-find-module-metro-runtimesrcmodulesempty-modulejs",children:(0,r.jsx)(n.code,{children:"error Cannot find module 'metro-runtime/src/modules/empty-module.js'"})}),"\n",(0,r.jsxs)(n.p,{children:["You most likely have some old dependencies that force your project to use an older version of ",(0,r.jsx)(n.code,{children:"metro"})," or ",(0,r.jsx)(n.code,{children:"metro-config"}),". These dependencies can be ",(0,r.jsx)(n.code,{children:"react-native-tvos"}),", ",(0,r.jsx)(n.code,{children:"react-native"}),". Make sure you are not forcing any resolutions in your ",(0,r.jsx)(n.code,{children:"package.json"})," and that you are using the versions that RNV comes with. In order for you to get more information on what is causing the issue you can run ",(0,r.jsx)(n.code,{children:"yarn why metro-runtime"})," and ",(0,r.jsx)(n.code,{children:"yarn why metro-config"}
1)," to see which dependencies are forcing the older versions."]}),"\n",(0,r.jsx)(n.h3,{id:"general-error-during-semantic-analysis-unsupported-class-file-major-version-61",children:(0,r.jsx)(n.code,{children:"General error during semantic analysis: Unsupported class file major version 61"})}),"\n",(0,r.jsxs)(n.p,{children:["Check your ",(0,r.jsx)(n.code,{children:"renative.json"})," files for ",(0,r.jsx)(n.code,{children:"gradleWrapperVersion"})," and ",(0,r.jsx)(n.code,{children:"kotlinVersion"})," and make sure they are set to ",(0,r.jsx)(n.code,{children:"8.3"})," and ",(0,r.jsx)(n.code,{children:"1.8.0"})," respectively or greater."]}),"\n",(0,r.jsx)(n.h3,{id:"dependency-xxxxxx-requires-libraries-and-applications-that-depend-on-it-to-compile-against-version-34-or-later-of-the-android-apis",children:(0,r.jsx)(n.code,{children:"Dependency 'XXXXXX' requires libraries and applications that depend on it to compile against version 34 or later of the Android APIs."})}),"\n",(0,r.jsxs)(n.p,{children:["Check your ",(0,r.jsx)(n.code,{children:"renative.json"})," files for ",(0,r.jsx)(n.code,{children:"targetSdkVersion"})," and ",(0,r.jsx)(n.code,{children:"compileSdkVersion"})," and make sure they are set to the correct version."]}),"\n",(0,r.jsx)(n.h4,{id:"general-error-during-semantic-analysis-unsupported-class-file-major-version-61-1",children:(0,r.jsx)(n.code,{children:"General error during semantic analysis: Unsupported class file major version 61"})}),"\n",(0,r.jsxs)(n.p,{children:["Check your ",(0,r.jsx)(n.code,{children:"renative.json"})," files for ",(0,r.jsx)(n.code,{children:"gradleWrapperVersion"})," and ",(0,r.jsx)(n.code,{children:"kotlinVersion"})," and make sure they are set to ",(0,r.jsx)(n.code,{children:"8.3"})," and ",(0,r.jsx)(n.code,{children:"1.8.0"})," respectively or greater."]}),"\n",(0,r.jsx)(n.h4,{id:"dependency-xxxxxx-requires-libraries-and-applications-that-depend-on-it-to-compile-against-version-34-or-later-of-the-android-apis-1",children:(0,r.jsx)(n.code,{children:"Dependency 'XXXXXX' requires libraries and applications that depend on it to compile against version 34 or later of the Android APIs."})}),"\n",(0,r.jsxs)(n.p,{children:["Check your ",(0,r.jsx)(n.code,{children:"renative.json"})," files for ",(0,r.jsx)(n.code,{children:"targetSdkVersion"})," and ",(0,r.jsx)(n.code,{children:"compileSdkVersion"})," and make sure they are set to the correct version."]}),"\n",(0,r.jsx)(n.h4,{id:"error--error-cannot-find-module-rnvcore",children:(0,r.jsx)(n.code,{children:"error: \u2a2f Error: Cannot find module '@rnv/core'"})}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.code,{children:"@rnv/core"})," package is a ",(0,r.jsx)(n.code,{children:"peerDependency"})," that needs to be added as a dependency in your project. Make sure you have it in your ",(0,r.jsx)(n.code,{children:"package.json"})," file, set it's version to the same as the other ",(0,r.jsx)(n.code,{children:"@rnv"})," packages and run ",(0,r.jsx)(n.code,{children:"yarn"})," to install it."]})]})}function h(e={}){const{wrapper:n}={...(0,s.R)(),...e.components};return n?(0,r.jsx)(n,{...e,children:(0,r.jsx)(l,{...e})}):l(e)}},8453:(e,n,i)=>{i.d(n,{R:()=>t,x:()=>d});var r=i(6540);const s={},o=r.createContext(s);function t(e){const n=r.useContext(o);return r.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}function d(e){let n;return n=e.disableParentContext?"function"==typeof e.components?e.components(s):e.components||s:t(e.components),r.createElement(o.Provider,{value:n},e.children)}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.