2014-10-11 1 views
1

이것은 매우 기본적인 질문 일 수 있습니다. 나는 덜 새로운데 덜 자바 스크립트 객체의 dumpLineNumbers 속성을 이해하고 싶습니다. 을 html 파일에 추가했지만 브라우저 출력 또는 브라우저 디버깅 도구 에 차이점을 볼 수 없습니다. 어떻게 작동합니까?덜 : dumpLineNumbers 사용 방법

index.html을 :

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>Example Code</title> 
    <meta name="description" content="Example Code" /> 
    <meta name="author" content="John Doe" /> 
    <link rel="stylesheet/less" type="text/css" href="less/styles.less" /> 
    <script type="text/javascript">less = { env: 'development', dumpLineNumbers: 'mediaQuery' };</script> 
    <script type="text/javascript" src="less-1.6.0.js"></script> 
</head> 
<body> 
    <h1>Less is Cool!</h1> 
    <p>Hello World!</p> 
</body> 
</html> 

이하/styles.css가 :

.mixin { 
    color: green; 
} 

p { .mixin; } 

여기

내가 사용하고 소스 파일입니다 m에 오류가 발생하더라도 I는 dumpLineNumbers 속성을 제거 할 때

h1 {color:red; } 

.mixin { color: green; // closing brace omitted on purpose to cause an error 

p { .mixin; } 

제가 여전히 출력의 차이를 보이지 않는 : I 닫는 중괄호 제거 여기서 Y의 CSS는 예로써 다음과 같다.

감사합니다.

+1

이 옵션은 (특수 미디어 쿼리 블록 또는 옵션 값에 따라 CSS의 주석으로 인코딩) 고대 말대꾸 호환 디버그 정보를 생성합니다. 이 형식은 더 이상 널리 사용되지 않으며 "소스 맵"디버깅 형식을 선호하여 거의 사용되지 않습니다. 즉,이 옵션을 잊어 버리십시오. 곧 제거 될 것입니다. –

+0

답변 해 주셔서 감사합니다. 내가 말한 디버그 정보에 대해 더 자세히 알고 싶습니다. 어디서 Sass 호환 디버그 정보를 찾을 수 있습니까? 그것은 내 웹 브라우저에 나타나지 않습니다. "소스 맵"디버깅 형식은 어디서 볼 수 있습니까? 소스 맵이란 무엇입니까? 감사. –

+0

좋아하는 검색 엔진의 기본 검색어가 트릭을 수행해야합니다. –

답변

1

처음에는 mediaquery을 소문자로 작성해야하며, 버전 1.7.5 이상에서 작동하는 것보다 작습니다.

@media -sass - 디버그 정보 {파일 이름 {글꼴 - 가족 : 파일 : 당신은 같은 라인을 찾을 수 컴파일 된 CSS에서

///home/t.less} 라인 {글꼴 - 가족 : 당신의 index.html을에서

} 0,000,315 \ 당신은 사용해야

<script type="text/javascript"> 
less = { 
    env: "development", 
dumpLineNumbers: 'mediaquery' 
} 
</script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/less.js/1.7.5/less.min.js" type="text/javascript"></script> 

은 또한 당신이 URL에 #!dumpLineNumbers:mediaquery을 추가합니다. 다음 명령을 실행하여 서버 측을 컴파일 할 때 같은 작업을 수행 할 수 있습니다

주의 사항 :

lessc --line-numbers=mediaquery index.less 

가 두 번째로 당신이이 @media -sass-debug-info 라인을 읽을 수있는 도구를 찾아야한다. 파이어 폭스는 fireless이었습니다. 이제 막 다른 골목 인 것 같습니다. Fireless는 더 이상 지원되지 않거나 더 이상 지원되지 않는 LESS 패치 버전을 필요로했습니다.

또한 참조 :

Less/Sass debugging in Chrome Dev Tools/Firebug