Programing

less.js가 크롬에서 작동하지 않습니다.

lottogame 2020. 12. 15. 08:10
반응형

less.js가 크롬에서 작동하지 않습니다.


나는 것으로 나타났습니다 less.js가 파이어 폭스에서 아니지만 크롬에서 일하고, 아니면 내가 실수를하기 때문에 무엇입니까?

<link rel="stylesheet/less" href="css/style.less" />
<script src="http://lesscss.googlecode.com/files/less-1.0.21.min.js"></script>

@highlight: #cb1e16;
@shade1: #cb1e16;
@tone1: #5c6f7d;
@grad1: #e6edf3;
@grad2: #8a8d92;
@text1: #333e44;

header, footer, section, article, nav, aside { display: block; }

.grad {
  background: @grad2;
  background: -moz-linear-gradient(top, @grad1, @grad2 1200px);
  background: -webkit-gradient(linear, 0 0, 0 1200, from(#e6edf3), to(#8a8d92));
}

html {
  .grad;
  min-height: 100%;
}

시도해 html { background: red; }도 여전히 크롬에서 작동하지 않습니다. 어딘가에서 실수하고 있습니까?


제공 한 링크에서 : 현재 Less.js 브라우저 스크립트는 Chrome을 사용 중이고 알려진 Chrome 문제로 인해 페이지 경로가 'file : ///'로 시작하는 경우 작동하지 않습니다.


리튬이 올 바르며 로컬 자바 스크립트 파일을로드하는 데 알려진 Chrome 문제가 있습니다. 이것은 Chrome의 보안 "기능"입니다. 내가 아는 두 가지 해결 방법이 있습니다.

  1. 웹 서버로 로컬 프로젝트를 개발하십시오. 구성에는 약간의 인내가 필요하지만 Apache를 매우 쉽게 설치하고 사용할 수 있습니다. Windows를 사용하는 경우 IIS를 설치할 수 있습니다. 이렇게하면 HTML 파일을 두 번 클릭하는 대신 http : // localhost / 에서 찾아 볼 수 있습니다 .

  2. -allow-file-access-from-files바로 가기에 명령 줄 스위치 추가하면 Chrome에서 번거 로움없이 LESS.JS를로드 할 수 있습니다.

루비 lessc버전이나 PHP 또는 .NET 포트 중 하나 와 같은 덜 변환기의 다른 버전을 사용하는 것을 언급 하고 싶지만 less.js가 더 최신 버전이므로 계속 유지해야한다고 생각합니다.


다른 사람이 Mac OS X (Lion에서 테스트 됨)에서 이에 대한 빠른 솔루션이 필요한 경우

"입문자를위한 안내"



특별한 thx to Lithium , Nathan Strutz + Superuser에 대한이 게시물 의 사람들



AppleScript 생성

Apple 스크립트 편집기

다음 명령으로


do shell script "/Applications/Google\\ Chrome.app/Contents/MacOS/Google\\ Chrome-allow-file-access-from-files"

AppleScript

그런 다음 응용 프로그램으로 저장

응용 프로그램으로 저장

( 나는 이것을 내 독에 넣고 빠른 액세스를 위해 대체 Chrome 아이콘을 추가했습니다. )

Dock에 추가

중요 :스크립트 (앱) 가 작동 하려면 Chrome을 닫아야 합니다.


실제로 허용되는 답변과 달리 이것은 잘 작동합니다. 저는 Chrome 19, Mac OS X를 사용하고 있으며 컨텍스트는 Chrome 확장 프로그램입니다. 나는 같은 문제를 경험했습니다. 나는 그것을 포함하는 다양한 방법으로 실험을 시작했고, rel, type, href 등의 텍스트를 전환했습니다.

이것은 작동하며 키는 href = "css / styles.css입니다 (.less가 아닌 .css 사용).

<link rel="stylesheet/less" type="text/css" href="css/styles.css" />
<script src="libs/less-1.3.0.min.js" type="text/javascript"></script>

Styles are nicely applied and the JavaScript console in Chrome has the following to say (slightly stripped for clarity):

less: parsed /css/styles.css successfully. less-1.3.0.min.js:8
less: css generated in 33ms

I know one aren't supposed to use compiled CSS client side, but in the context of a Chrome Extension there is no alternative other than regular CSS (eww). You can't request the stylesheet from a server either because the client will be offline every now and then.


I recommend you to use a compiled vesion of the LESS file. You can do this for example in windows with WinLess or SimpLESS.

I'm using winless. It automatically compiles my .css files when I save my code.

You also need to run your example on a webserver like IIS / tomcat / Jboss

I hope it helps


링크 태그를 다음과 같이 편집하면 파일 내에서 Less 구문을 사용하지 않는 경우 에만 모든 브라우저에서 작동 합니다.

<link rel="stylesheet" type="text/less" href="css/styles.less" />

그렇다면 왜 적은 파일에서 일반 CSS를 사용합니까? 모르겠지만 알다시피.


이 작은 앱이 file : // 문제를 피하는 데 매우 유용하다는 것을 알았습니다 : Mac 용 Anvil. 1 분이면 http://myapp.dev 와 같은 URL을 통해 원하는만큼 많은 사이트를 실행할 수 있습니다 .

http://anvilformac.com/


-allow-file-access-from-files를 사용하지 않거나 wamp, lamp 등을 실행하고 싶지 않다면이 확장 기능을 사용할 수 있습니다. 링크

참조 URL : https://stackoverflow.com/questions/3084892/less-js-not-working-in-chrome

반응형