바벨에 추가된 코드를 재사용해서 코드 크기를 줄일 수 있는 플러그인이다.
Installation
개발용을 설치해주자.
npm install --save-dev @babel/plugin-transform-runtime
Plain Text
복사
pr용이 필요하다면 이것도 설치해주자.
npm install --save @babel/runtime
Plain Text
복사
Why?
Babel에서 사용되는 중복코드들이 @babel/plugin-transform-runtime 플러그인이 @babel/runtime 모듈을 참조해서 중복되지 않도록 처리해준다.
Usage
With a configuration file(추천) - 옵션은 기본 값이다.
{
"plugins": [
[
"@babel/plugin-transform-runtime",
{
"absoluteRuntime": false,
"corejs": false,
"helpers": true,
"regenerator": true,
"version": "7.0.0-beta.0"
}
]
]
}
JavaScript
복사
CLI
babel --plugins @babel/plugin-transform-runtime script.js
JavaScript
복사
Node API
require("@babel/core").transformSync("code", {
plugins: ["@babel/plugin-transform-runtime"],
});
JavaScript
복사
Options
"plugins": [["@babel/plugin-transform-runtime",
{
// "polyfill": v7에서는 기본적으로 추가되도록 됨
// "useBuiltIns": v7에서는 기본적으로 추가되도록 됨
"corejs": false,
// 각자 필요한 버전을 지정하면 된다.
// 2 : 글로벌 변수(Promise)와 정적 속성(ex. Array.from)을 지원
// 3 : instance properites를 지원 - proposals : true옵션을 사용하여 polyfill 제안사항들을 polyfill할 수 있다.
"helpers": true,
// inlined Babel helper들이 moduleName과 함께 호출 할지 안 할지 결정한다.(ex. classCallCheck, extends)
// babel이 사용하는 helper코드들이 불필요한 중복까지 추가될 수 있다. 이러한 것들을 대체할 지 여부에 대한 토글이다.
"regenerator": true,
// 현재 환경을 중복되어 오염시키는 코드들을 제거하기 위해서 사용된다.
"useEsModules": false,
// 7.13.0부터 제거된다.
// commonJs 문법을 유지할 필요 없기 때문에 @babel/plugin-transform-modules-commonjs에서 실행되지 않는 helper들을 사용한다.
// exports.default = function 이것이 export default function 이렇게 사용 가능해진다.
"absoluteRuntime": false,
// 변환 실행시간을 크게 가질 수 있다.
// 런타임에 대한 절대 경로를 미리 설정 한 후 출력코드를 삽입할 수 있다.
// 파일이 컴파일된 다음 즉시 사용되는 상황에서 사용 할 수 있다.
"version": "7.0.0-beta.0"
// 더 높은 버전을 사용하고 싶다면, 설정하면 된다.
}
]]
JavaScript
복사