bower에 웹component 노트를 등록했어요.

개요

Polymer를 사용하여 마름모rhombus-list를 촘촘하게 배열한 웹 페이지를 만들었다.
이미 bower에 등록bower i rhombus-list했으니 사용하세요.
웹 페이지 components의 Giithub 페이지 제작 및 bower 로그인 시 비망록
Polymer로 웹 Components 자체 제작 및 bower에 공개 및
Building and Publishing your Web Component in 9 Steps
참고로 하다.

먼저(동기)

Web Designing 2014년 9월호에 diamond-list라는 css 샘플이 공개됐다.

멋있어 보이지만.

마름모꼴의 크기를 간단하게 바꾸고 싶다

한 열의 수량을 간단하게 바꾸고 싶다

마름모꼴 틀의 폭을 간단하게 바꾸고 싶다

마름모 접촉틀 부분이 굵어짐

이런 기분이야 특별히 사용하진 않았지만
이번에 보워가 직접 만든 홈페이지component를 공개하기 전에 한번 해보고 싶을 때 상기 4가지 해결과 함께 소재로 삼고 싶습니다.

components로 가는 경로

my-component에 사용된 다른 구성 요소는 bower.json의 dependencies에 기재됩니다.
나는 이번 패스를 어떻게 해야 할지 매우 궁금하다.
my-component.html

...
<link rel="import" href="?path/to/components?/polymer/polymer.html">

<!-- (1) --><link rel="import" href="../polymer/polymer.html">
<!--  or -->
<!-- (2) --><link rel="import" href="bower_components/polymer/polymer.html">
...

실제 공개됐을 때는(1)my-component.html와 같은 층bower.json에서 거기bower i --save <tag>라면 반드시(2)...
왜냐하면 bower의 dependencies 설치 위치 지정하기에서처럼 설치 목적지를 설정할 수 있는지 몰라요.
2개의 상단으로 강제 복제bower.json

Giithub 페이지 만들기

my-component.html 이외에 제작해야 하는

index.html=> 문서 페이지(Giithub 페이지에 공개된 경우)

demo.html=> 데모 페이지(이름은 demo.html

나는 프레젠테이션 페이지가 이름 이외에 모두 자유롭게 제작될 수 있다고 생각하기 때문에 먼저 문서 페이지에 관한 것이다.

문서 페이지 만들기

core-component-page

Polymer의 구성 요소index.html를 보면
사용core-component-page 이거 완전 깔끔하게 끝났어요.
index.html

<!doctype html>
<html>
<head>

  <script src="../webcomponentsjs/webcomponents.js"></script>
  <link rel="import" href="../core-component-page/core-component-page.html">

</head>
<body unresolved>

  <core-component-page></core-component-page>

</body>
</html>

core-component-pagebower.json와 my-component.html로부터 정보를 얻으면 페이지를 마음대로 만들 수 있을 것 같습니다.
마음대로 하세요.
반드시 자신my-component.html의 평론 출력 중등@에 기재해야 한다.

기재 방법

이렇게 댓글 밖에서 설명을 잘 해주시면...
거기서 깨끗이 씻고 문서 페이지를 만들어 주세요.

<!--

  ここに説明を記載
  マークダウンでかけました

  @group ？？？
  @element タグ名
  @homepage ホームページのURL
-->

<polymer-element name="タグ名" attributes="要素達">
  <template>
    ...
  </template>
  <script>
    Polymer("タグ名", {

      /**
       * 要素の説明
       *
       * @attribute 要素名
       * @type 要素の型
       * @default デフォルト値
       */
      要素: デフォルト値,

    });
  </script>
</polymer-element>

bower에 로그인

라벨

bower.json 프로젝트 페이지 참조private boolean : Set to true if you want to keep the package private and do not want to register the package in the future.
이런 기록이 있기 때문에 공개하면 당연히 해야 한다고 생각합니다private: falsePolymer의 구성 요소를 참조했기 때문에 처음에는 truebower search <tag>해도 안 나와서 곤란해요.

결어(증정품)

이번에 제작된 rhombus-list 페이지와 캡처입니다.
문서 페이지
프레젠테이션 페이지
github

가능하면 땀으로 해주세요.

Reference

이 문제에 관하여(bower에 웹component 노트를 등록했어요.), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/sosuke/items/84df7cdddcca6a4c8520

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)