Polymer 2.0 사용자 정의 스타일 속성이 dom-module에서 작동하지 않습니다.

Question

폴리머 프로젝트를 2.0 버전으로 업그레이드했습니다. 그 후 div에서 일부 css 클래스가 누락되었습니다.

<link rel="import" href="bower_components/iron-flex-layout/iron-flex-layout.html"> 

그리고 내-home.html을에서 페이지는 다음과 같은 몇 가지 스타일이 내-home.html을에서 철 - 플렉스 - layout.html에 대한 링크가 있습니다

:

<dom-module id="my-home"> 
<template> 
<style is="custom-style"> 
.flex-vertical { 
    @apply --layout-vertical; 
    height: 100vh; 
} 

.flexchild-vertical { 
    @apply --layout-flex; 
    @apply --layout-horizontal; 
} 
</style> 
</template> 
</dom-module> 

이러한 스타일은 철 - 플렉스 - layout.html에서 호출

--layout-vertical 
--layout-flex 
--layout-horizontal 

하지만 내 출력에로드되지 않습니다.

올드 버전 :

업그레이드 된 버전 :

내가 문제가 있음이 수의 때문에 생각 여기 내 브라우저에서 스크린 샷입니다 #shadow-root이 생성되었습니다.

스타일 링크/HTML 링크 또는 다른 코드를 변경할 수 있습니까?

Answer 1

예! 여기에서 답변을 얻었습니다. https://www.polymer-project.org/2.0/docs/upgrade#class-based-elements-import-the-css-mixin-shim

iron-flex-layout의 버전 문제입니다. 방금 업데이트했는데 모든 것이 이제 괜찮습니다. https://github.com/PolymerElements/iron-flex-layout

:

최신 버전 (2.0) 여기 iron-flex-layout.html

최신 버전은 내부 스타일을 전체적으로 감싸는 <custom-style> 개체가