Page 43 -

new webpack.DefinePlugin(env.stringified) // 환경변수를 주입해 줍니다.
]
};

환경변수를 주입하면, 프로젝트 내에서 process.env.NODE_ENV 값을 참조하여 현재 개발 환경인지

아닌지를 알 수 있습니다.

20.3.3 빌드 스크립트 작성하기

이번에는 방금 만든 환경 설정을 사용하여 웹팩으로 프로젝트를 빌드하는 스크립트를 작성해 보
겠습니다. scripts 경로를 열어 보면 build.js라는 파일이 있습니다. 이 스크립트는 클라이언트에

서 사용할 빌드 파일을 만드는 작업을 합니다. 이 스크립트와 비슷한 형식으로 서버에서 사용할
빌드 파일을 만드는 build.server.js 스크립트를 작성해 보겠습니다.

scripts/build.server.js
process.env.BABEL_ENV = 'production';
process.env.NODE_ENV = 'production';

20
process.on('unhandledRejection', err => {
throw err;
}); 서버 사이드 렌더링

require('../config/env');
const fs = require('fs-extra');
const webpack = require('webpack');
const config = require('../config/webpack.config.server');
const paths = require('../config/paths');

function build() {
console.log('Creating server build...');
fs.emptyDirSync(paths.ssrBuild);
let compiler = webpack(config);
return new Promise((resolve, reject) => {
compiler.run((err, stats) => {
if (err) {
console.log(err);
return;
}

553

리액트를 다루는 기술_개정판(본문)최종출력용.indb 553 2019-08-20 오전 11:03:33