์ปดํŒŒ์ผ๋Ÿฌ ์„ค์ • ์˜ต์…˜์„ ๊ฒ€์ฆํ•ฉ๋‹ˆ๋‹ค.

๊ทœ์น™ ์„ธ๋ถ€ ์‚ฌํ•ญ

React ์ปดํŒŒ์ผ๋Ÿฌ๋Š” ๋™์ž‘์„ ์ œ์–ดํ•˜๊ธฐ ์œ„ํ•ด ๋‹ค์–‘ํ•œ ์„ค์ • ์˜ต์…˜์„ ๋ฐ›์Šต๋‹ˆ๋‹ค. ์ด ๊ทœ์น™์€ ์„ค์ •์ด ์˜ฌ๋ฐ”๋ฅธ ์˜ต์…˜ ์ด๋ฆ„๊ณผ ๊ฐ’ ํƒ€์ž…์„ ์‚ฌ์šฉํ•˜๋Š”์ง€ ๊ฒ€์ฆํ•˜์—ฌ ์˜คํƒ€๋‚˜ ์ž˜๋ชป๋œ ์„ค์ •์œผ๋กœ ์ธํ•œ ๋ฌด์‹œ๋˜๋Š” ์˜ค๋ฅ˜๋ฅผ ๋ฐฉ์ง€ํ•ฉ๋‹ˆ๋‹ค.

์ž˜๋ชป๋œ ์˜ˆ์‹œ

์ด ๊ทœ์น™์— ๋Œ€ํ•œ ์ž˜๋ชป๋œ ์ฝ”๋“œ ์˜ˆ์‹œ์ž…๋‹ˆ๋‹ค.

// โŒ ์•Œ ์ˆ˜ ์—†๋Š” ์˜ต์…˜ ์ด๋ฆ„
module.exports = {
plugins: [
['babel-plugin-react-compiler', {
compileMode: 'all' // ์˜คํƒ€: compilationMode์—ฌ์•ผ ํ•จ
}]
]
};

// โŒ ์œ ํšจํ•˜์ง€ ์•Š์€ ์˜ต์…˜ ๊ฐ’
module.exports = {
plugins: [
['babel-plugin-react-compiler', {
compilationMode: 'everything' // ์œ ํšจํ•˜์ง€ ์•Š์Œ: 'all' ๋˜๋Š” 'infer'๋ฅผ ์‚ฌ์šฉํ•˜์„ธ์š”
}]
]
};

์˜ฌ๋ฐ”๋ฅธ ์˜ˆ์‹œ

์ด ๊ทœ์น™์— ๋Œ€ํ•œ ์˜ฌ๋ฐ”๋ฅธ ์ฝ”๋“œ ์˜ˆ์‹œ์ž…๋‹ˆ๋‹ค.

// โœ… ์œ ํšจํ•œ ์ปดํŒŒ์ผ๋Ÿฌ ์„ค์ •
module.exports = {
plugins: [
['babel-plugin-react-compiler', {
compilationMode: 'infer',
panicThreshold: 'critical_errors'
}]
]
};

๋ฌธ์ œ ํ•ด๊ฒฐ

์„ค์ •์ด ์˜ˆ์ƒ๋Œ€๋กœ ์ž‘๋™ํ•˜์ง€ ์•Š๋Š” ๊ฒฝ์šฐ

์ปดํŒŒ์ผ๋Ÿฌ ์„ค์ •์— ์˜คํƒ€๋‚˜ ์ž˜๋ชป๋œ ๊ฐ’์ด ์žˆ์„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

// โŒ ์ž˜๋ชป๋œ ์˜ˆ: ์ผ๋ฐ˜์ ์ธ ์„ค์ • ์‹ค์ˆ˜
module.exports = {
plugins: [
['babel-plugin-react-compiler', {
// ์˜ต์…˜ ์ด๋ฆ„ ์˜คํƒ€
compilationMod: 'all',
// ์ž˜๋ชป๋œ ๊ฐ’ ํƒ€์ž…
panicThreshold: true,
// ์•Œ ์ˆ˜ ์—†๋Š” ์˜ต์…˜
optimizationLevel: 'max'
}]
]
};

์œ ํšจํ•œ ์˜ต์…˜์€ ์„ค์ • ๋ฌธ์„œ๋ฅผ ํ™•์ธํ•˜์„ธ์š”.

// โœ… ๋” ๋‚˜์€ ๋ฐฉ๋ฒ•: ์œ ํšจํ•œ ์„ค์ •
module.exports = {
plugins: [
['babel-plugin-react-compiler', {
compilationMode: 'all', // ๋˜๋Š” 'infer'
panicThreshold: 'none', // ๋˜๋Š” 'critical_errors', 'all_errors'
// ๋ฌธ์„œํ™”๋œ ์˜ต์…˜๋งŒ ์‚ฌ์šฉํ•˜์„ธ์š”
}]
]
};