Nuxt.js ignore(独自のタグを無視する方法はないでしょうか)

Question

前提・実現したいこと

• Nuxt.jsを利用してWebページを作成しています。(nuxt generateコマンドでビルドした静的ファイルをサーバーにアップします)

• 要件として、静的なファイルに、サーバー側で取得したデータを表示させる為の「独自のタグ」を書く必要があるのですが、vueファイルにそのタグを書くと当然エラーが出ます。

ビルドした静的なファイルに、そのタグを書いていくことはできますが、複数ある為、ビルドするたびに書き直すのは非常に面倒に感じています。

例えば、以下のようなイメージで、
vueファイル内にある独自のタグを無視し、そのままビルドするような方法は無いでしょうか

イメージ

// disabled-next-line
{{^ server-side-display-data }}
<button>ボタン</button>
// disabled-next-line
{{/ server-side-display-data }}

ビルドイメージ

{{^ server-side-display-data }}
<button>ボタン</button>
{{/ server-side-display-data }}

試したこと

以下にあるような特定のファイルを無視することはできるようでしたが、特定の文字列を無いことにするようなものは見つけられていません
https://ja.nuxtjs.org/api/configuration-ignore/

宜しくお願いいたします。

Answer 1

Nuxt.jsをレガシーなテンプレートとして利用することはできない(適切ではない)

Answer 2

Vue には ignoredElements や v-pre というのがあるようです。

• Vue.config.ignoredElements
• v-pre

Comments

[y2UcDgAL]

- v-pre
以下のように書くと、ビルドは通りますが、
<span v-pre>{{ name }}</span>

generateした後のコードは以下のようにタグで囲まれる為、サーバー側で動作しません。
<span>{{ name }}</span>

- ignoredElements
以下のようなタグをignoredElementsに指定するとうまく行きましたが
<trix-editor></trix-editor>
以下のようなものはうまく行かず、解決しませんでした
{{^ server-side-display-data }}