Environment Variables

webpack.config.js에서 development와 production의 빌드를 명확하게 구분하기 위해 환경 변수를 사용할 수 있습니다.

webpack 커맨드라인 환경 옵션인 --env 를 사용하면 원하는 만큼 많은 환경 변수를 전달할 수 있습니다. 환경 변수는 webpack.config.js에서 액세스 할 수 있습니다. 예를 들면, --env production 나 --env goal=local.

npx webpack --env goal=local --env production --progress

Webpack 설정에서 한 가지 변경 사항을 적용해야 합니다. 일반적으로 export default는 설정 객체를 가리킵니다. env 변수를 사용하려면 export default를 함수로 변환해야 합니다.

webpack.config.js

import path from "node:path";
import { fileURLToPath } from "node:url";

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);

export default (env) => {
  // 여기에서 env.<변수> 를 사용하세요.
  console.log("Goal:", env.goal); // 'local'
  console.log("Production:", env.production); // true

  return {
    entry: "./src/index.js",
    output: {
      filename: "bundle.js",
      path: path.resolve(__dirname, "dist"),
    },
  };
};

Edit this page·Print this page

« Previous

Authoring Libraries

Build Performance

8 Contributors

Translators

dkstyle