Young Blog

| sass

Sass Map의 Key 값으로 숫자를 넣을 때 주의할 점

작업하던 도중에 스프라이트 이미지 부분이 계속 에러가 나서 소스를 살펴봤더니 Sass Map의 Key 부분이 대략 다음과 같이 적혀있었다.

1
2
3
4
5
6
7
8
9
$sass-map-example: (
	1: some-value,
	2: some-value,
	3: some-value,
	5: some-value,
	10: some-value,
	12: some-value,
	13: some-value
)

위와 같이 key 값에 숫자가 들어갈 경우, 1~9 사이의 숫자 앞에 0을 붙여주지 않으면 컴파일 시 순서가 순차적으로 먹지 않고 뒤죽박죽 되어버린다.

예전에 파일명인가 폴더명을 변경했을 때 비슷하게 순서가 뒤바뀐 경험이 있어서 1~9 사이의 숫자 앞에 0을 붙여서 다시 컴파일 해봤다.

1
2
3
4
5
6
7
8
9
$sass-map-example: (
	01: some-value,
	02: some-value,
	03: some-value,
	05: some-value,
	10: some-value,
	12: some-value,
	13: some-value
)

결과는 깔끔하게 잘된다! 루비 버전 2.0.0에서는 처음 코드처럼 0을 붙이지 않아도 순서대로 잘 나왔으나, 2.3으로 업그레이드 하니까 0을 꼭 붙여줘야 순서대로 나온다. 다른 버전에서는 아직 테스트를 해보지 않았다.

Comments