VUEのクイック&簡単なドキュメントの生成.jsコンポーネント


今まであなたのVUEアプリケーションのコンポーネントを監督を失うか?

その場合は、必ずコンポーネントをドキュメント化する必要があります.ここで最初のアイデアは何ですか?wikiでページを起動し、各コンポーネントが何をするかを書き留めてください.しかし、これは最良のアプローチではないかもしれません.なぜなら、人々はドキュメントを更新することを忘れる傾向があるからです.

それで、なぜあなたのコードから直接滑らかなドキュメンテーションページを自動的に生成しませんか?でもどうやって?

心配しないで!Vueseはあなたの背中を持っています.それはあなたのコンポーネントのドキュメントを自動生成し、きちんとした&シンプルなHTMLページとしてレンダリングできます.

ブーゼ / ブーゼ


🤗 VUEコンポーネントドキュメンテーションのためのワンストップ解決オリジナルorg :https://github.com/vuese


ブーゼ



VUEコンポーネントドキュメンテーションのためのワンストップ解決
このプロジェクトはBackers






書類


詳細についてはvuese.org

概要


Vuese ドキュメントを自動的に生成vue コンポーネントは、さまざまなニーズを満たすためにコンポーネントのドキュメントを生成するためのさまざまなソリューションを提供します.

ヴィーゼ/ CLI




@vuese/cli コマンドラインツールは非常に使いやすいです.あなたがすぐにあなたのためにドキュメンテーションサイトを構築したいならばvue またはコンポーネントを生成するだけですmarkdown あなたのドキュメントvue コンポーネントは、このツールは良い選択かもしれない.詳細はどうぞ.@vuese/cli

ブザーパーサー




The @vuese/parser モジュールはvue コンポーネント@vuese/cli 内部解析vue コンポーネント@vuese/parser モジュールと、必要な情報を抽出します.これによって提供されたインターフェースで、より高度なことをすることができます@vuese/parser モジュールです.のためにAPI ドキュメントを参照してください@vuese/parser

オンライン体験


下記を訪問する👇…
View on GitHub
現在のvueプロジェクトに追加できます.
npm install -g @vuese/cli 
そして、ドキュメントを生成するために
vuese gen
それはすべて、私誓う🙌🏻
ではどうやって動くか見てみましょう
次のコンポーネントがあります
<template>
  <div>
    <!-- Form header -->
    <slot name="header">
      <!-- `<th>title</th>` -->
      <th>title</th>
    </slot>
  </div>
</template>

<script>
// This is a description of the component
export default {
  name: 'TestComponent',
  props: {
    // The name of the form, up to 8 characters
    name: {
      type: [String, Number],
      required: true,
      validator () {}
    }
  },
  methods: {
    // @vuese
    // Used to manually clear the form
    clear () {
      // Fire when the form is cleared
      // @arg The argument is a boolean value representing xxx
      this.$emit('onclear', true)
    }
  }
}
</script>
この結果、このHTMLページは次のようになります.

Vueseは、スロット、小道具、メソッドやイベントからのデータと注釈を取得し、コードから直接コンポーネント自体のために.ご覧のように、それからもタイプと必要な状態を抽出しますname プロップ
ここで結果を確認できます.https://berniwittmann.github.io/vuese-demo/index.html
私はまた、アノテーションで遊ぶことができる小さなレポを作成し、どのように簡単な感じを得る.

ベルニウィットマン / Vueseデモ


VUEコンポーネントのVueseドキュメント生成の短いデモ



VUEでVUEコンポーネントのクイック&簡単なドキュメント生成


このレポは、ツールの短いデモですvuese Vueのコンポーネントドキュメントを作成するには.jsコンポーネント.

The accompanying blog post can be found on


結果

セットアップ


依存関係をインストールする
npm install

生成するドキュメント


実行してドキュメントを生成する
npm run docs
View on GitHub
だからあなたのコンポーネントのドキュメントを作成し、間違いなくチェックアウトvuese.org を参照してください.
読んでくれてありがとう、私はいくつかのフィードバックについて喜んでいます💪🏻