gating
๊ฒ์ดํ ๋ชจ๋์ ์ค์ ์ ๊ฒ์ฆํฉ๋๋ค.
๊ท์น ์ธ๋ถ ์ฌํญ
๊ฒ์ดํ ๋ชจ๋๋ ํน์ ์ปดํฌ๋ํธ๋ฅผ ์ต์ ํ ๋์์ผ๋ก ํ์ํ์ฌ React ์ปดํ์ผ๋ฌ๋ฅผ ์ ์ง์ ์ผ๋ก ๋์ ํ ์ ์๊ฒ ํด์ค๋๋ค. ์ด ๊ท์น์ ์ปดํ์ผ๋ฌ๊ฐ ์ด๋ค ์ปดํฌ๋ํธ๋ฅผ ์ฒ๋ฆฌํ ์ง ์ ์ ์๋๋ก ๊ฒ์ดํ ์ค์ ์ด ์ ํจํ์ง ํ์ธํฉ๋๋ค.
์๋ชป๋ ์์
์ด ๊ท์น์ ๋ํ ์๋ชป๋ ์ฝ๋ ์์์ ๋๋ค.
// โ ํ์ ํ๋ ๋๋ฝ
module.exports = {
plugins: [
['babel-plugin-react-compiler', {
gating: {
importSpecifierName: '__experimental_useCompiler'
// 'source' ํ๋ ๋๋ฝ
}
}]
]
};
// โ ์ ํจํ์ง ์์ ๊ฒ์ดํ
ํ์
module.exports = {
plugins: [
['babel-plugin-react-compiler', {
gating: '__experimental_useCompiler' // ๊ฐ์ฒด์ฌ์ผ ํจ
}]
]
};์ฌ๋ฐ๋ฅธ ์์
์ด ๊ท์น์ ๋ํ ์ฌ๋ฐ๋ฅธ ์ฝ๋ ์์์ ๋๋ค.
// โ
์์ ํ ๊ฒ์ดํ
์ค์
module.exports = {
plugins: [
['babel-plugin-react-compiler', {
gating: {
importSpecifierName: 'isCompilerEnabled', // ๋ด๋ณด๋ธ ํจ์ ์ด๋ฆ
source: 'featureFlags' // ๋ชจ๋ ์ด๋ฆ
}
}]
]
};
// featureFlags.js
export function isCompilerEnabled() {
// ...
}
// โ
๊ฒ์ดํ
์์ (๋ชจ๋ ๊ฒ์ ์ปดํ์ผ)
module.exports = {
plugins: [
['babel-plugin-react-compiler', {
// gating ํ๋ ์์ - ๋ชจ๋ ์ปดํฌ๋ํธ๋ฅผ ์ปดํ์ผ
}]
]
};