Rob Dodson의 stated으로 이제 웹 구성 요소에서 style 태그를 피할 수 없습니다. 나는 새로운 HTML 문서에 컴파일 된 CSS를 붙여 넣을 필요없이이 새로운 기술로 LESS를 사용하는 방법을 찾고있다. 거기에 어쨌든 달성 할 수 있습니까?웹 구성 요소 사용량 감소
나는 Polymer을 사용하고 있습니다.
감사합니다. 생산에 CSS에 직접 컴파일하는 것이 좋습니다
http://lesscss.org/#client-side-usage
:
로랑
클라이언트가 CSS에 LESS를 컴파일 할 수, 당신은 확실히 이것 좀해야 환경 그래도!
이 클라이언트 측을 수행하는 것은 특히 스케일에 따라 상당히 해결책이없는 것 같습니다. 예를 들어 LessCSS를 비롯하여 클라이언트 측에서 컴파일하는 등 앱의 1000 개 웹 구성 요소를 모두 원하십니까?
서버 측을 컴파일하고 HTML 가져 오기에 컴파일 된 버전을 포함하면됩니다. DocPad와 같은 응용 프로그램을 사용하면 훨씬 쉽게 작업 할 수 있습니다. 예 :
src/documents/components/my-component/my-component.css.less은 소스 파일이며 /compoennt/my-component/my-component.css에 액세스 할 수있는 out/components/my-component/my-component.css으로 컴파일됩니다.
우리는 coffeescript와 같은 자바 스크립트 전처리 기와 CSS 자동 접두사와 같은 후 처리기 및 Browserify와 같은 번들을 사용하기 위해이 워크 플로를 사용합니다. 자세한 내용은 https://stackoverflow.com/a/23050527/130638을 참조하십시오.
간단히 컴파일하고 생성 된 CSS 파일을 좋은 이전 링크 태그를 통해 포함 시키십시오.
나는 rob이 스타일 태그를 사용하는 것이 유일한 방법이라고 생각하지 않는다고 생각합니다. 항상 외부 스타일 시트에 링크 할 수 있습니다.
왜 PHP 컴파일러를 사용하여 서버 측에서 컴파일하지 않습니까? 여기 좀 봐 - http://leafo.net/lessphp/ - 내 프로젝트에서이 컴파일러를 사용하고 있습니다. 문제가없는 서버 측에서 !!!!!!! :) IMO, 서버 측에서 컴파일 작업을하는 것이 좋습니다. 나는 완전히 100 % 확실하지는 않지만 IE8이 텍스트/less를 인식하지 못한다고 생각한다.
나는 이것을하기 전에 각 구성 요소에 대해 개별 .less 또는 .scss 파일을 가지고 개인으로 컴파일해야한다. .css 파일은 각 구성 요소 파일로 호출됩니다. 마지막으로 모든 것을 단일 파일로 가황 처리합니다. 단일 CSS 파일을 사용하려는 경우 CSS의 // deep // combinator 또는 :: shadow pseudo 요소를 사용하십시오.
ShadowDOM을 사용하지 않고 사용자 지정 요소를 만들 수있는 경우 모든 간단한 병합을 단일 CSS로 병합 할 수 있습니다. 솔직히 말해서 폴리머에 shadowDOM이없는 wc를 만들 수 없었습니다. github에서 github에 대해 그림자없이 wc를 생성하는 방법에 대해 오랫동안 대화하고 있습니다. https://github.com/Polymer/polymer/issues/222
하나의 해결 방법은 .less 파일을로 변환하는 것입니다.css를 작성한 다음 공식 문서에 설명 된 것과 같이 폴리머 구성 요소 안에 연결합니다. https://www.polymer-project.org/1.0/docs/devguide/styling#external-stylesheets
불행히도이 기능은 사용되지 않습니다. 그래서 다른 방법은 preprocessor에서 생성 된 css 파일을 dom 모듈로 래핑하는 또 다른 단계가 될 수 있습니다.이 방법을 사용하면 구성 요소 내에 style 모듈을 포함하여 the Polymer way을 따라갈 수 있으며, 그렇지 않은 경우 컴파일 된 CSS 파일을 사용할 수 있습니다. 폴리머 구성 요소 외부에서 일을하십시오.
내 빌드 프로세스에 대한 꿀꺽를 사용하고 있는데 나는 매우 유용한이 모듈 발견
https://github.com/MaKleSoft/gulp-style-modules
그것은 내가 내 소스에있는 모든 .less 파일을 생성하는과 .html 파일을 dom-module을 감싸서 구성 요소 스타일에 포함 할 준비가되었습니다.
감사합니다. 도움이 될 수 있지만 실제로 필요한 것은 생산 및 개발 환경에서 사용할 수있는 솔루션입니다. 나는 기다려야 할 것 같아. –