굳이 jsx를 사용하고싶다.

vscode 에서 rn을 작성하고있다보면 보이는 이 js 파일 로고...

이걸 굳이 jsx로 확장자를 변경해보면 

이런 멋진! 리액트 로고가 된다.

굳이 해줄 필요는 없어 보이나

난 이 로고로 작성해나가고 싶어서 jsx 파일 지원에 대한 글을 작성해본다.

 

우선 rn프로젝트 루트에서 지원되는 확장자를 따로 작성해줘야한다.

 

metro.config.js 파일에 해당 내역을 작성해주면된다.

 

참고로 sourceExts영역은 md파일이라던가 뭔가 다른 확장자를 가진 애를 가져올때 적어주면된다.

 

module.exports = {
  transformer: {
  	...
  },
  resolver: {
    sourceExts: ['jsx', 'js'], //add here
  },
};

 

사실 이 metro설정에도 우선 적용되는 단계가 있다고한다만 그냥 여기다가 적자...

만약 해당 파일이 없으면

package.json 파일에 metro영역을 만들어 적용해주자

 

자세한 방법은 공식 도큐먼트를 봅시다...

https://facebook.github.io/metro/docs/configuration/#resolver-options

Configuring Metro | Metro

 

 

A Metro config can be created in these three ways (ordered by priority):

1. metro.config.js
2. metro.config.json
3. The metro field in package.json

You can also give a custom file to the configuration by specifying --config <path/to/config> when calling the CLI.