[docker] COPY failed: Forbidden path outside the build context 오류 해결법

Docker를 활용해서 nginx위에 vue를 올리는 프로젝트 셋팅을 하다가 아래와 같은 에러를 만났다.
COPY failed: Forbidden path outside the build context ?? 으잉 이게 무슨에러일까
일단 나의 폴더구조는 아래와 같다.

폴더구조

텍스트로 표현하자면..
Vue project
    ㄴ docker
        ㄴ Dockerfile
    ㄴ src
vue.config.js
package.json

이런식이고 Dockerfile은 아래와 같다.

FROM nginx:1.13
COPY ../dist/ /usr/share/nginx/html/
COPY etc/nginx/nginx.conf /etc/nginx/
COPY etc/nginx/conf.d /etc/nginx/conf.d/

CMD ["nginx", "-g", "daemon off;"]

Vue porject/docker 의 경로에서 docker image build -t sample/nginx:latest 로 이미지를 만들려니 COPY failed: Forbidden path outside the build context 에러가 발생했다.
구글링을 해보니 ../dist/ 에서 ../(상위 컨텍스트)로 이동을 해서 나는 오류라고 한다.

해결책

해결책은 두가지이다.

1. Dockerfile 상위 디렉토리에서 docker image build를 실행시키기
   Dockerfile이 있는 경로(Vue project/docker)에서 명령어를 실행시키는 것이 아니라 상위인(Vue project)에서 명령어를 실행시키고 Dockerfile의 경로를 지정해주는 방법이다.

    docker image build -t sample/nginx:latest -f docker/Dockerfile
   
    FROM nginx:1.13
    COPY dist/ /usr/share/nginx/html/
    COPY docker/etc/nginx/nginx.conf /etc/nginx/
    COPY docker/etc/nginx/conf.d /etc/nginx/conf.d/
   
    CMD ["nginx", "-g", "daemon off;"]

   -f 옵션을 줘서 Dockerfile의 경로를 설정하고, 번들링 결과(dist)와 환경설정 파일의 경로를 다시 써주면 된다.

2. 복사할 파일들의 경로를 Dockerfile 경로 안으로 이동시키기
   위의 방법이 싫다면, 번들링 결과(dist, 컨테이너로 복사할 파일)의 경로를 Dockerfile이 존재하는 경로로 안에 넣고 위의 이미지 빌드를 하면 된다. (Dockerfile의 수정은 필요 없다. 그림과 같은 구조가 되겠다.)