Hoe kan ik code becommentariëren in een vue.js-bestand?

Ik moet een opmerking invoegen in een vue.js-bestand voor toekomstige referenties, maar ik kan niet vinden hoe je dit doet in de documenten.

Ik heb //, /**/, {{ -- -- }}en {# #}, maar geen enkele lijkt te werken.

Ik gebruik het mes van Laravel. Dit is dus de 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> 

Weet iemand hoe je een opmerking invoegt en/of hoe je stukjes code becommentarieert?

Antwoord 1, autoriteit 100%

Je zou in jouw situatie standaard HTML-opmerkingen in de <template>-tag willen gebruiken. Ze worden ook van de uitvoer verwijderd, wat leuk is.

<!-- Comment -->

Antwoord 2, autoriteit 19%

Zoals Bill Criswell zei, kunnen we HTML-commentaarsyntaxis gebruiken.

<!-- Comment -->

Maar het werkt ook buiten de sjabloontag,
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>

Antwoord 3, autoriteit 13%

Ik heb dit zojuist getest:

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

Antwoord 4, autoriteit 9%

Ik heb gemerkt dat je niet kunt reageren als je in een tag zit:

<!-- make sure it is outside a tag -->
<autocomplete
<!-- you can't place the comment out in here -->
>
</autocomplete>

Antwoord 5, autoriteit 7%

Als het nuttig is voor uw projecten, kunt u platte tekst zonder versiering boven de sjabloon plaatsen. Het wordt volledig genegeerd wanneer u uw component rendert.

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

Antwoord 6, autoriteit 5%

Vue Styleguidist bevat best practices en toont voorbeelden van hoe u uw componenten kunt becommentariëren.
https://vue-styleguidist.github.io/docs/Documenting.html #code-comments

Maar in het algemeen…

Gebruik HTML-opmerkingen in de sjabloonof HTML-sectie

<!-- Comment -->

Gebruik in het gedeelte scriptJavascript-opmerkingen

// Comment
/* Comment */

Gebruik in het gedeelte stijlCSS-opmerkingen

/* comment */

Antwoord 7, autoriteit 3%

De volgende tip gaat niet zozeer over het commentaar geven(zoals bij het documenteren) van code op zich, maar meer over het toestaan ​​dat je tijdelijk stukjes code overslaat tijdens de ontwikkeling.

Als voor opmerkingen tags moeten worden geopend en gesloten, kan de manier waarop de parser hiermee overeenkomt, onhandig zijn. Bijvoorbeeld het volgende

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

zal and that -->. Op dezelfde manier zal /* this will be commented /* and so will this */ but not this */.

Mijn oplossing is om v-if="false"te gebruiken om aan te geven welke blokken ik (tijdelijk) wil overslaan.

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

Houd er rekening mee dat dit niet mag worden gebruikt ter vervanging van de juiste opmerkingen om uw code te documenteren. Het is gewoon een handige manier om meer controle te hebben over blokken die je tijdens de ontwikkeling wilt overslaan.

Antwoord 8

Ik ben een noob in Vue.js, maar //zou moeten werken omdat de code toch javascript is.
Als ik in de documenten kijk, vind ik dit voorbeeld. Als u de eerste 2 regels van javascript bekijkt, ziet u opmerkingen met //.

voorbeeld in javascript gekoppeld bestand:

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

Antwoord 9

Probeer het met deze optie

<%-- COMMENT HERE --%>