<aside> 💡 import 할 때 루트 경로 사용하려면? (npm 패키지 쓰듯이)

</aside>

babel-plugin-module-resolver

https://github.com/tleunen/babel-plugin-module-resolver/blob/master/DOCS.md#alias

설치

yarn add --dev babel-plugin-module-resolver

사용

babel.config.js (or babelrc.js)

plugins: [
	[
    require.resolve('babel-plugin-module-resolver'),
    {
        root: ['./src'],
        alias: {
          'webos-service': './src/main/service/webos-service',
        },
      },
  ],
]

• ./src 아래 모듈들 모두 src로 부터 절대 경로로 입력 가능
• alias는 root의 값과는 무관함. 즉 ./src를 따로 적어줘야됨.
  • 이부분은 tsconfig의 baseUrl과 paths의 관계랑 다름

참고

• 에디터에서 typescript 등으로 import 할 때 빨간줄 안나오게 하는거랑 다름.
  • 그건 tsconfig.json에 baseUrl, paths를 설정하면 됨
• 다만 babel로 빌드한 후에는 그게 적용안되서 위에거가 필요