React Typescript IE11에서 지원하기

ES6 문법을 ES5로 변환해야 함 / 타입 스크립트 컴파일 소스가 ES5로 나와야 함

• tsconfig.js에서 target을 es5로 변경

  // tsconfig.json
  
  {
  	"compilerOptions": {
  	    "target": "es5",
  			...
  	}
  }

• 앱 초기화 시킬 때 enableES5() 실행 - index.ts에서

graphQL 통신 관련 이슈 해결(Apollo Client)

• 패키지

  • cross-fetch

    // @api/client.ts
    ...
    import {
    	...
      HttpOptions,
      ...
    } from "@apollo/client";
    import fetch from "cross-fetch";
    
    const httpLink = new HttpLink({ uri: API_URL + "/graphql", fetch: fetch } as HttpOptions);

IE에서 리액트를 작동시켜야 함(ES6에만 있는 메서드를 ES5에서도 사용 가능하게)

• 패키지

  • @babel/polyfill
    - regenerator-runtime
    - core-js

    // index.ts
    
    ...
    import 'core-js/stable';
    import 'regenerator-runtime/runtime';
    
    enableES5();
    ...

• package.json - browserlist 수정

  • development와 production에 "ie 11" 추가

    // package.json
    
    {
    	...
    	"browserslist": {
    	  "production": [
    			...
    	    "ie 11"
    	  ],
    	  "development": [
    			...
    	    "ie 11",
    	  ]
    	},
    	...
    }

• 혹시 안 될 경우 node_modules/.cache 삭제