<h3 dir="auto">What problem does this feature solve?</h3>
<p dir="auto">Currently if we render a slot for multiple times (eg. inside a <code class="notranslate">v-for</code> loop), we'll get</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="Duplicate presence of slot &quot;${name}&quot; found in the same render tree - this will likely cause render errors."><pre class="notranslate"><code class="notranslate">Duplicate presence of slot "${name}" found in the same render tree - this will likely cause render errors.
</code></pre></div>
<p dir="auto">I know it's intentional to prevent render errors (like losing correct data binding) but consider the following use case: I have a <code class="notranslate">v-breadcrumbs</code> component which has a default item separator of a text node <code class="notranslate">/</code>, and I want to allows users to specify their own separators which can be anything, like an <code class="notranslate">&lt;v-icon&gt;</code> component.</p>
<p dir="auto">Currently if I want to make it work, I have to define a scoped slot in the <code class="notranslate">v-breadcrumbs</code> component and bind nothing to it:</p>
<div class="highlight highlight-text-html-basic notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;slot name=&quot;sep&quot; v-bind=&quot;{}&quot;&gt;/&lt;/slot&gt;"><pre class="notranslate"><span class="pl-kos">&lt;</span><span class="pl-ent">slot</span> <span class="pl-c1">name</span>="<span class="pl-s">sep</span>" <span class="pl-c1">v-bind</span>="<span class="pl-s">{}</span>"<span class="pl-kos">&gt;</span>/<span class="pl-kos">&lt;/</span><span class="pl-ent">slot</span><span class="pl-kos">&gt;</span></pre></div>
<p dir="auto">And component users must define <code class="notranslate">slot-scope</code> on it and not use anything from it:</p>
<div class="highlight highlight-text-html-basic notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;v-breadcrumbs&gt;
  &lt;v-icon slot=&quot;sep&quot; slot-scope=&quot;_&quot; name=&quot;angle-right&quot;/&gt;
&lt;/v-breadcrumbs&gt;"><pre class="notranslate"><span class="pl-kos">&lt;</span><span class="pl-ent">v-breadcrumbs</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">v-icon</span> <span class="pl-c1">slot</span>="<span class="pl-s">sep</span>" <span class="pl-c1">slot-scope</span>="<span class="pl-s">_</span>" <span class="pl-c1">name</span>="<span class="pl-s">angle-right</span>"/&gt;
<span class="pl-kos">&lt;/</span><span class="pl-ent">v-breadcrumbs</span><span class="pl-kos">&gt;</span></pre></div>
<p dir="auto">And currently Vue is using slots as fallbacks for scoped slots with the same name. Whether the users can use a slot doesn't rely on if they want data from slot scope, but on whether the slot is gonna be rendered for multiple times inside the component self, this may raise more confusion for our users (like <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="322432196" data-permission-text="Title is private" data-url="https://github.com/vuejs/vue/issues/8175" data-hovercard-type="issue" data-hovercard-url="/vuejs/vue/issues/8175/hovercard" href="https://github.com/vuejs/vue/issues/8175">#8175</a>).</p>
<p dir="auto">So why don't we just get rid of such caveats and let a slot to be rendered more than once? We can clone them on duplication to prevent render errors as we already run the scoped slot function each time anyway. This makes the logic a lot simpler for users IMO: if we do not expect to use data from the slot scope, just use a slot, otherwise we'll always have to declare <code class="notranslate">slot-scope</code> to create the binding.</p>
<p dir="auto">In addition, this would make documenting the (scoped) slots of a component more consistent, we just declare the data structure for a slot scope and users can decide if they want some data to bind to the <code class="notranslate">slot-scope</code> and don't need to care about how many times it will be rendered.</p>
<h3 dir="auto">What does the proposed API look like?</h3>
<p dir="auto">No additional API needed, just clone the slot nodes upon render and remove the waring about duplicated slots.</p>
<p dir="auto">It may be implemented in userland today in a quite hacky way, see: <a href="https://codesandbox.io/s/lp11y2wovz" rel="nofollow">https://codesandbox.io/s/lp11y2wovz</a></p>
<p dir="auto">I just tweaked the <code class="notranslate">cloneVNode</code> function from the Vue core a little bit and it seemed to be working as expected using render function (without losing reactivity and event binding). There maybe some other edge situations I missed so correct me if it's not such trivial.</p>
<h3 dir="auto">What problem does this feature solve?</h3>
<p dir="auto">github missing repository vuejs/vue-ssr-webpack-plugin, i update webpack to version 5 and have error<br>
[vue-server-renderer-webpack-plugin] webpack config <code class="notranslate">output.libraryTarget</code> should be "commonjs2".</p>
<h3 dir="auto">What does the proposed API look like?</h3>
<p dir="auto">in my output.libraryTarget is libraryTarget: 'commonjs2'</p>