vue.jsファイルのコードにコメントを付ける方法は？

将来の参照のためにvue.jsファイル内にコメントを挿入する必要がありますが、ドキュメントでこれを行う方法がわかりません。

私が試してみました//、/**/、{{-- --}}、および{# #}、それらのどれも動作するようには思えません。

Laravelのブレードを使用しています。だからこれはsample_file.vue：

<template>
    <div class="media">

        <like-button :post="post" v-if="post.likedByCurrentUser === false && "></like-button>  {{--I want to comment this but I get an error from the gulp watch: post.canBeLikedByCurrentUser === true--}}

        <div class="media-left">
            <a href="#">
                <img class="media-object" v-bind:src="post.user.avatar" v-bind:title="post.user.name + ' image from Gravatar'">
            </a>
        </div>
        <div class="media-body">
            <strong>{{ post.user.name }}</strong>
            <p>{{post.body}}</p>
            <p>{{post.likeCount}} {{ pluralize('like', post.likeCount) }}</p>
        </div>
    </div>
</template> 

コメントを挿入する方法やコードの一部にコメントする方法を知っている人はいますか？

<template>状況に応じて、タグで標準のHTMLコメントを使用することをお勧めします。それらは出力からも削除されます。これは素晴らしいことです。

<!-- Comment -->

Bill Criswellが言ったように、HTMLコメント構文を使用できます。

<!-- Comment -->

ただし、テンプレートタグの外でも機能します、 comment.vue

<!-- Testing comments, this will work too. -->

<template>
    <!-- This will work too -->

    <div>
        <!-- Html Comments -->
        Hello There!
    </div>
</template>

<style><style>

<!-- Commenting here -->

<script>
    // Commenting only 1 line

    /**
      * Commenting multiple lines
      * Commenting multiple lines
      */
</script>

私はこれをテストしました：

<template>
    {{ /* this is a comment */ }}
    <h1>Hello world</h1>
</template>

タグ内にいるときはコメントできないことに気づきました。

<!-- make sure it is outside a tag -->

<autocomplete
<!-- you can't place the comment out in here -->
>
</autocomplete>

プロジェクトに役立つ場合は、装飾なしでテンプレートの上にプレーンテキストを配置できます。コンポーネントをレンダリングするときは完全に無視されます。

This is some documentation about this component
   - some
   - info
<template></template>
<script></script>
<style></style>

Vue Styleguidistには、ベストプラクティスが含まれており、コンポーネントにコメントを付ける方法の例が示されています。 https://vue-styleguidist.github.io/docs/Documenting.html#code-comments

しかし、一般的に...

では、テンプレートまたはHTML部分用HTMLのコメント

<!-- Comment -->

では、スクリプトセクションJavascriptのコメントを使用

// Comment
/* Comment */

で、スタイルのセクションの使用CSSのコメント

/* comment */

次のヒントは、（ドキュメント化のように）コード自体にコメントすることではなく、開発中にコードのチャンクを一時的にスキップできるようにすることです。

コメントで開始タグと終了タグが必要な場合、パーサーがそれらを照合する方法が不便になる可能性があります。たとえば、次の

<!-- I want to comment this <!-- this --> and that --> 

を出力しますand that -->。同様に/* this will be commented /* and so will this */ but not this */。

私の解決策は、v-if="false"（一時的に）スキップするブロックを指定するために使用することです。

<template>
<div>
    Hello
    <div v-if="false">
        Vue will not process whatever's in here.
    </div>
    World!
</div>
</template>

これは、コードを文書化するための適切なコメントの代わりに使用しないでください。これは、開発中にスキップするブロックをより細かく制御するための便利な方法です。

私はVue.jsの初心者ですが//、コードはとにかくjavascriptなので、動作するはずです。ドキュメントを見ると、この例が見つかります。javascriptの最初の2行を見ると、コメントが表示されます//。

javascriptリンクファイルの例：

// Full spec-compliant TodoMVC with localStorage persistence
// and hash-based routing in ~120 effective lines of JavaScript.

...