윈도우에서 베가 에디터 빌드하기

Jake Seo·2020년 4월 22일
0

vega-chart

목록 보기
2/4
post-thumbnail

윈도우에서 베가 에디터 빌드하기

베가 에디터란?

대략 https://vega.github.io/editor/#/examples/vega/bar-chart 이러한 것이다. 차트에 대한 json을 입력해보면, json을 기반으로 차트가 실시간 업데이트 된다.

빌드하는 방법?

리드미에 나와있듯이, git clone을 한 이후에 yarn을 치고 yarn start를 하면 된다. (원래는)
근데, 빌드 과정 중에 쉘 스크립트를 수행하는 부분이 있다. 그 부분 때문에 에러가 난다.
에러를 해결하기 위해 무언가 좀 설치해주고 쉘스크립트의 코드를 약간 바꾸어주어야 한다.

  1. git bash를 설치하자.
    • git bash는 윈도우를 위한 깃 커멘드 창인데, 여러가지 리눅스 기본 명령어를 지원한다. 그리고 쉘파일의 실행도 가능하다.
  2. wget을 설치해야 한다.
    • wget은 리눅스에서는 기본으로 제공되는 명령어인데, windows에는 없다. 그래서 설치해야 한다. 설치방법은 여기에 있다.
  3. 쉘파일의 내용을 좀 바꾸자

우리가 바꿔야 할 쉘 파일은 scripts/vendor.sh이다.

기존의 내용은 아래와 같다.

set -e

DATA=public/data
SPEC=public/spec
SCHEMA=schema

CWD=$(pwd)

echo "Copying data to '$DATA'."

if [ ! -d "$DATA" ]; then
  mkdir $DATA
fi

eval rsync -r "$CWD/node_modules/vega-datasets/data/*" $DATA

echo "Copy examples to '$SPEC'."

if [ ! -d "$SPEC" ]; then
  mkdir $SPEC
fi

# without v!
VEGA_VERSION=$(scripts/version.sh vega)
VEGA_LITE_VERSION=$(scripts/version.sh vega-lite)

pushd /tmp
wget https://github.com/vega/vega/archive/v$VEGA_VERSION.tar.gz -O vega.tar.gz
wget https://github.com/vega/vega-lite/archive/v$VEGA_LITE_VERSION.tar.gz -O vl.tar.gz
tar xzf vega.tar.gz vega-$VEGA_VERSION/docs
tar xzf vl.tar.gz vega-lite-$VEGA_LITE_VERSION/examples vega-lite-$VEGA_LITE_VERSION/site/_data
popd

eval rsync -r "/tmp/vega-$VEGA_VERSION/docs/examples/*.vg.json" "$SPEC/vega"
eval rsync -r "/tmp/vega-lite-$VEGA_LITE_VERSION/examples/specs/*.vl.json" "$SPEC/vega-lite/"

cp "/tmp/vega-lite-$VEGA_LITE_VERSION/site/_data/examples.json" "$SPEC/vega-lite/index.json"
cp "/tmp/vega-$VEGA_VERSION/docs/_data/examples.json" "$SPEC/vega/index.json"

바뀐 버전은 아래와 같다.

#!/usr/bin/env bash

set -e

DATA=public/data
SPEC=public/spec
TMP=tmp
SCHEMA=schema

CWD=$(pwd)

echo "Copying data to '$DATA'."

if [ ! -d "$DATA" ]; then
  mkdir $DATA
  mkdir $TMP
fi

eval cp -r "$CWD/node_modules/vega-datasets/data/*" $DATA

echo "Copy examples to '$SPEC'."

if [ ! -d "$SPEC" ]; then
  mkdir $SPEC
fi

# without v!
VEGA_VERSION=$(scripts/version.sh vega)
VEGA_LITE_VERSION=$(scripts/version.sh vega-lite)

cd ./tmp
wget https://github.com/vega/vega/archive/v$VEGA_VERSION.tar.gz -O vega.tar.gz
wget https://github.com/vega/vega-lite/archive/v$VEGA_LITE_VERSION.tar.gz -O vl.tar.gz
tar xzf vega.tar.gz vega-$VEGA_VERSION/docs
tar xzf vl.tar.gz vega-lite-$VEGA_LITE_VERSION/examples vega-lite-$VEGA_LITE_VERSION/site/_data
cd ..

eval cp -r "./tmp/vega-$VEGA_VERSION/docs/examples/*.vg.json" "$SPEC/vega"
eval cp -r "./tmp/vega-lite-$VEGA_LITE_VERSION/examples/specs/*.vl.json" "$SPEC/vega-lite/"

cp "./tmp/vega-lite-$VEGA_LITE_VERSION/site/_data/examples.json" "$SPEC/vega-lite/index.json"
cp "./tmp/vega-$VEGA_VERSION/docs/_data/examples.json" "$SPEC/vega/index.json"

윈도우와 git bash에는 rsync가 없기 때문에, 그와 유사한 역할을 하는 cp로 바꾸자.
pushd와 같은 명령어는 있긴 하지만, 제대로 지원하는지 불확실하기 때문에 cd로 대체해주었다.

이렇게 하면 무사히 빌드가 잘 된다.

이거 빌드하느라 삽질 좀 했다. 끝.

profile
풀스택 웹개발자로 일하고 있는 Jake Seo입니다. 주로 Jake Seo라는 닉네임을 많이 씁니다. 프론트엔드: Javascript, React 백엔드: Spring Framework에 관심이 있습니다.

0개의 댓글