Rollup - alias 플러그인 (4)

이번에는 Rollup 의 alias 플러그인에 대해서 알아보도록 하겠습니다.

@rollup/plugin-alias

@rollup/plugin-alias 은 Rollup 패키지 번들링시 별칭을 정의하기위한 plugin 입니다.

Alias 101

가상 파일에 다음과 같은 가져 오기가 정의되어 있다고 가정합니다.

import batman from '../../../batman';

아마도 그 자체로는 그리 나쁘지 않을 것입니다. 그러나 이것은 코드베이스의 유일한 인스턴스가 아닐 수 있으며, 리팩토링 후에는 올바르지 않을 수 있습니다. 이 플러그인을 사용하면 가독성과 유지관리를 위해 ../../../batman과 batman의 별명을 지정할 수 있습니다. 리팩터의 경우 코드베이스를 탐색하고 모든 가져오기를 변경하는 대신 별명만 변경하면 됩니다.

import batman from 'batman';

이것이 web pack 사용자에게 친숙합니다. 이 플러그인은 webpack의 resolve.extensions 및 resolve.alias 기능을 모방한 플러그인입니다.

사용방법

rollup.config.js 구성 파일을 작성하고 플러그인을 불러옵니다.

import alias from '@rollup/plugin-alias';

export default {
  input: 'src/index.js',
  output: {
    dir: 'output',
    format: 'cjs'
  },
  plugins: [
    alias({
      entries: [
        { find: 'utils', replacement: '../../../utils' }
        { find: 'batman-1.0.0', replacement: './jocker-1.5.0' }
      ]
    }),
  ]
}

그런다음, CLI 또는 API를 통해 rollup을 호출하세요. 빌드에서 오류가 발생하면 플러그인은 ‘별칭’ 문자를 stderr에 기록합니다.

Options

customResolver

Type: Function | Object Default: null

Rollup remover 대신 대체 해결 알고리즘을 사용하도록 플러그인에 지시합니다. Resolved hook에 대한 자세한 내용은 rollup 설명서를 참조하세요. 자세한 예는 사용자 정의 해결 프로그램을 참조하세요.

entries

Type: Object | Array[…Object] Default: null

import 또는 require 문의 값을 바꾸는데 사용되는 별칭을 정의하는 Object 또는 Object의 Array를 지정합니다. 어떤 형식이든 첫 번째로 정의된 규칙이 먼저 적용되므로 항목의 순서가 중요합니다. 이 옵션은 정규식 별명 일치도 지원합니다.

Object Format

객체 형식을 사용하면 별칭을 키로 지정하고, 해당 값을 실제 가져오기 값으로 지정할 수 있습니다. 얘를 들면 다음과 같습니다.

alias({
  entries: {
    utils: '../../../utils',
    'batman-1.0.0': 'joker-1.5.0'
  }
});

Array[…Object] Format

Array [… Object] 형식을 사용하면 별칭을 객체로 지정할 수 있으며 복잡한 키 / 값 쌍에 유용합니다.

alias({
  entries: {
    { find: 'utils', replacement: '../../../utils' },
    { find: 'batman-1.0.0', replacement: './joker-1.5.0' },
  }
});

정규식을 사용한 별명처리

정규식을 사용하면 보다 명확하고 복잡한 방식으로 검색할 수 있습니다. 예) 하위 패턴 일치를 통해 부분 교체를 수행합니다.

가져오기 앞에서 무언가를 제거하고 확장을 추가하려면 다음과 같은 패텅을 사용하세요.

{ find: /^(.*)\.js$/, replacement: '$1.alias' }

이렇게하면 .js로 끝나는 모든 가져 오기의 파일 확장자가 .alias로 바뀝니다.

알고리즘 해결 (Resolving algorithm)

이 플러그인은 롤업 및 결국 롤업 기본 알고리즘에 지정된 resolver 플러그인을 사용합니다. 노드 특정 기능에 의존하는 경우 설정에서 @ rollup / plugin-node-resolve를 원할 것입니다.

사용자 정의 Resolvers

customResolver 옵션을 사용하여 개별 별명에 대해 별도의 모듈 분석을 제공 할 수 있습니다.

// rollup.config.js

import alias from '@rollup/plugin-alias';
import resolve from '@rollup/plugin-node-resolve';

const customResolver = resolve({
  extensions: ['.mjs', '.js', '.jsx', '.json', '.sass', '.scss']
});
const projectRootDir = path.resolve(__dirname);

export default {
  ...
  plugins: [
    alias({
      entries: [
        {
          find: 'src',
          replacement: path.resolve(projectRootDir, 'src')
          // OR place `customResolver` here. See explanation below.
        }
      ],
      customResolver
    }),
    resolve()
  ]
};

위의 예에서는 customResolver 옵션을 전달하여 src로 별칭이 지정된 파일에 대해 노드 확인 알고리즘을 사용하는 별칭 src가 사용됩니다. resolve () 플러그인은 src로 별칭이 지정되지 않은 다른 파일에 대한 플러그인 목록에서 별도로 유지됩니다. customResolver 옵션은 각 별명을 선호하는 해석자로 허용하는 분석을 세밀하게 제어하기 위해 각 항목 항목 안에 전달 될 수 있습니다.