npm 스크립트를 실행할 때, 환경변수를 넘기는 방법이다.
방법은 간단하다.

> {변수이름}={변수값} npm run {명령어}

예제

package.json

{
  //...
  "scripts": {
    "start": "node app.js; node app2.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  //...
}

app.js

console.log("Hello!");
console.log(process.env.NAME);

app2.js

console.log("Hello2");
console.log(process.env.NAME);

실행

> NAME=chun npm run start

결과

Hello!
chun
Hello2
chun

사용사례

AWS 코드파이프라인으로 프로젝트를 빌드할 때,
AWS가 생성하는 환경변수중 하나인 AWS_BUILD_HASH값을 npm 프로젝트내에서 사용할 수 있다.

아래예시는 vite로 생성한 프로젝트다.

buildspec.yml

version: 0.2
  #env:
  #variables:
  # key: "value"
  # key: "value"
  #parameter-store:
  # key: "value"
  # key: "value"
phases:
  install:
    runtime-versions:
      nodejs: 14
    commands:
      - echo node version check
      - node -v
      - npm -v
      # To handle 'not get uid/gid'
      - npm config set unsafe-perm true
      - npm install -g npm chalk
      - echo ========== NODE $(node -v) / NPM $(npm -v) ==========
      # https://stackoverflow.com/questions/46584324/code-build-continues-after-build-fails
      # Codebuild's post_build always run regardless of build's success or failure!
      - echo '#!/bin/sh' > /usr/local/bin/ok; echo 'if [[ "$CODEBUILD_BUILD_SUCCEEDING" == "0" ]]; then exit 1; else exit 0; fi' >> /usr/local/bin/ok; chmod +x /usr/local/bin/ok
  pre_build:
    commands:
      - npm cache clean --force
      - npm install
  build:
    commands:
      - AWS_BUILD_HASH=$CODEBUILD_RESOLVED_SOURCE_VERSION npm run build
      # - command
  post_build:
    commands:
      - aws s3 sync --cache-control max-age=0 --include=index.html ./dist/ s3://{S3_주소}/

vite.config.ts

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import path from 'path';

export default defineConfig(({ mode }) => {
  return {
    plugins: [vue()],
    resolve: {
      alias: {
        '@': path.resolve(__dirname, 'src'),
      },
    },
    build: {
      target: 'es2015',
      lib: {
        entry: path.resolve(__dirname, 'src/utils/widget/index.ts'),
        fileName: (format) => {
          if (mode === 'local') {
            return `widget.${format}.js`;
          } else {
            return `widget.${process.env.AWS_BUILD_HASH}.${format}.js`;
          }
        },
      },
      outDir: 'dist/widget',
      rollupOptions: {
        // external에 추가하면 vue 런타임이 번들에 포함되지 않는 이슈가 있어 주석 처리
        // external: ['vue'],
        output: {
          globals: {
            vue: 'Vue',
          },
        },
      },
    },
  };
});