[RN] react-native + react-native-web + typescript = 멀티디바이스

하나의 코드로 멀티디바이스를 만들어 보겠다고

세팅을 하다보니

이제야 사전준비 완료!

 

 

마지막으로 작어을 한부분은 App.web.tsx 파일을 App.tsx로 변경.

이렇게 되면 (app) index.js 파일에 App 과 index.web.js 파일에 App이 같은걸 바라보게 된다.

 

 그럼끝!

 

 

// index.js

/**
 * @format
 */

import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';

AppRegistry.registerComponent(appName, () => App);

// index.web.js

import React from 'react';
import App from './App';
import {createRoot} from 'react-dom/client';
const container = document.getElementById('app');
const root = createRoot(container); // createRoot(container!) if you use TypeScript
root.render(<App />);

 

하나의 코드로 web, ios를 실행시킨 화면

 

 

지금까지 작성한 [RN] 세팅 관련 코드를 작성해보면 이런 결과물을 얻을수 있었다.

당연히 워닝도 없다.

후훗! 난 사실 워닝이 싫다..