如何使用 Intellij Structural Replace 将 Bootstrap 4 个单选按钮重构为 Bootstrap 5 个

Question

我正在尝试将一些 Java 服务器 Pages/Spring Webflow 视图从 Twitter Bootstrap 4 更新为 Bootstrap 5.

我有很多单选按钮，并且必需的 HTML 样板从 v4 到 v5 发生了很大变化。这似乎是 IntelliJ 的“结构替换”的一个很好的用例，但我无法让它工作。

这是我正在尝试的：

我最后得到：

我试过为变量添加过滤器，即：

而且我已经尝试更改“搜索目标”（标记为[例如]）...

None 这些作品。

我发现 Jetbrains 的（通常很好的）doco 对于此功能很糟糕。

[编辑...示例代码]

   <div class="row mt-2">
        <div class="col-4">
            <div class="form-check">
                <label class="custom-control custom-radio">
                    <form:radiobutton path="type" value="wdpp" cssClass="custom-control-input"/>
                    <span class="custom-control-indicator"></span>
                    <span class="custom-control-description">Wires: Pole to Pole</span>
                </label>
            </div>
            <div class="form-check">
                <label class="custom-control custom-radio">
                    <form:radiobutton path="type" value="wdpb" cssClass="custom-control-input"/>
                    <span class="custom-control-indicator"></span>
                    <span class="custom-control-description">Wires: Pole to Building</span>
                </label>
            </div>
            <div class="form-check">
                <label class="custom-control custom-radio">
                    <form:radiobutton path="type" value="transformer" cssClass="custom-control-input"/>
                    <span class="custom-control-indicator"></span>
                    <span class="custom-control-description">Transformer</span>
                </label>
            </div>
            <div class="form-check">
                <label class="custom-control custom-radio">
                    <form:radiobutton path="type" value="meterBox" cssClass="custom-control-input"/>
                    <span class="custom-control-indicator"></span>
                    <span class="custom-control-description">Meter Box</span>
                </label>
            </div>
            <div class="form-check">
                <label class="custom-control custom-radio">
                    <form:radiobutton path="type" value="pole" cssClass="custom-control-input"/>
                    <span class="custom-control-indicator"></span>
                    <span class="custom-control-description">Pole</span>
                </label>
            </div>
            [...more radios elided...]
        </div>
    </div>

[编辑...有时会出现不同的 UI]

实际上，我认为这个 UI 总是出现，然后很快与之前的那个（带有“查找选项...”的那个 link）

[想知道是否将其带到 Jetbrains bug-tracker...]

模板是：

<replaceConfiguration name="Unnamed" text="&lt;label class=&quot;custom-control custom-radio&quot;&gt;&#10;    &lt;form:radiobutton path=&quot;$path$&quot; value=&quot;$value$&quot; cssClass=&quot;custom-control-input&quot;/&gt;&#10;    &lt;span class=&quot;custom-control-indicator&quot;&gt;&lt;/span&gt;&#10;    &lt;span class=&quot;custom-control-description&quot;&gt;$label$&lt;/span&gt;&#10;&lt;/label&gt;" recursive="false" type="XML" dialect="HTML" search_injected="false" reformatAccordingToStyle="false" shortenFQN="false" replacement="&lt;form:radiobutton id=&quot;$path$-$value$&quot; path=&quot;$path$&quot; value=&quot;$value$&quot; cssClass=&quot;form-check-input&quot;/&gt;&#10;&lt;label class=&quot;form-check-label&quot; for=&quot;$path$-$value$&quot;&gt;$label$&lt;/label&gt;">
  <constraint name="__context__" within="" contains="" />
  <constraint name="path" within="" contains="" />
  <constraint name="value" within="" contains="" />
  <constraint name="label" within="" contains="" />
</replaceConfiguration>

任何thoughts/suggestions/pointers感激不尽。

Answer 1

看来您运行遇到了一个错误，无法匹配 HTML 标签内的 JSP 标签。也许您可以使用以下两步解决方法。首先用假的HTML标签替换JSP标签：

<replaceConfiguration name="Unnamed" text="&lt;form:radiobutton path=&quot;$type$&quot; value=&quot;$transformer$&quot; cssClass=&quot;custom-control-input&quot;/&gt;" recursive="false" type="Qt UI file" dialect="JSP" reformatAccordingToStyle="false" shortenFQN="false" replacement="&lt;form-radiobutton path=&quot;$type$&quot; value=&quot;$transformer$&quot; cssClass=&quot;custom-control-input&quot;/&gt;">
  <constraint name="__context__" within="" contains="" />
  <constraint name="type" within="" contains="" />
  <constraint name="transformer" within="" contains="" />
</replaceConfiguration>

然后用新构造执行 HTML 替换：

<replaceConfiguration name="Unnamed" text="&lt;label class=&quot;custom-control custom-radio&quot;&gt;&#10;    &lt;form-radiobutton path=&quot;$path$&quot; value=&quot;$value$&quot; cssClass=&quot;custom-control-input&quot;/&gt;&#10;    &lt;span class=&quot;custom-control-indicator&quot;&gt;&lt;/span&gt;&#10;    &lt;span class=&quot;custom-control-description&quot;&gt;$label$&lt;/span&gt;&#10;&lt;/label&gt;" recursive="false" type="HTML" reformatAccordingToStyle="false" shortenFQN="false" replacement="&lt;form:radiobutton id=&quot;$path$-$value$&quot; path=&quot;$path$&quot; value=&quot;$value$&quot; cssClass=&quot;form-check-input&quot;/&gt;&#10;&lt;label class=&quot;form-check-label&quot; for=&quot;$path$-$value$&quot;&gt;$label$&lt;/label&gt;">
  <constraint name="__context__" within="" contains="" />
  <constraint name="path" within="" contains="" />
  <constraint name="value" within="" contains="" />
  <constraint name="label" within="" contains="" />
</replaceConfiguration>

如何使用 Intellij Structural Replace 将 Bootstrap 4 个单选按钮重构为 Bootstrap 5 个

How to refactor Bootstrap 4 radiobuttons to Bootstrap 5 uinsg Intellij's Structural Replace

intellij-idea

structural-search