Vue エラー: Vue アプリに予期しないトークン '<' – 解決方法は?

Vue.js は、ユーザー インターフェイスやシングルページ アプリケーションを構築するための人気のある JavaScript フレームワークです。ただし、Vue アプリで「予期しないトークン '5cf413571c6c7ff67492c571bad6bd6a をコードの最後に追加する必要があります。

2. HTML タグは JavaScript コードで使用されます

Vue アプリケーションでは、HTML タグはテンプレート部分でのみ使用でき、JavaScript コードでは使用できません。 Vue コンポーネントの JavaScript コードで HTML タグを使用すると、Vue はそれを正しく解析できず、「予期しないトークン '<'」エラー メッセージが返されます。

たとえば、コンポーネント コードに次の行が含まれている場合:

export default {
  data() {
    return {
      message: "<h1>Welcome to my website!</h1>"
    }
  }
}

これにより、エラー メッセージが表示されます:

Failed to compile.

...Unexpected token '<' in ...

回避策: Vue コンポーネントの JavaScript コード内、HTML タグの使用は避けてください。 HTML マークアップを使用する必要がある場合は、Vue の v-html ディレクティブを使用してレンダリングできます。

3. 不正な HTML ドキュメントが導入されました

サポートされていないタグや正しくエンコードされていないタグを含む不正な HTML ドキュメントを Vue アプリケーションに導入した場合、Vue は解析できません正しく実行されないため、「予期しないトークン '<'」エラー メッセージが返されます。

たとえば、次の行を含む不正な HTML ドキュメントを Vue コンポーネントに導入すると、

<template>
  <div>
    <object data="path/to/wrong/file.html"></object>
  </div>
</template>

これにより、エラー メッセージが表示されます:

Failed to compile.

...Unexpected token '<' in ...

回避策: Makeプログラムは正しい HTML ドキュメントをインポートし、ドキュメントに不正なマークアップやエンコーディングがないかチェックします。

4. Vue アプリケーションが正しく構成されていません

Vue アプリケーションが正しく構成されていない場合 (たとえば、必要なプラグインやライブラリが正しく読み込まれていない場合)、「予期しないトークン」が表示されます。 ' というエラー メッセージが表示されます。

たとえば、Vue アプリケーションに Vue Router が正しく設定されていない場合、次のエラー メッセージが表示されることがあります:

Failed to compile.

...Unexpected token '<' in ...

回避策: Vue アプリケーションが適切に設定され、必要なプラグインが読み込まれていることを確認してください。そして図書館。上の例では、Vue Router が正しくロードされていることを確認してください。

概要

Vue アプリケーションで「予期しないトークン '<'」エラー メッセージが表示された場合は、いくつかの理由が考えられます。この問題は、Vue テンプレートを注意深く検査し、JavaScript コードでの HTML タグの使用を回避し、正しい HTML ドキュメントを導入し、Vue アプリケーションを正しく構成することで解決できます。これらの考えられる原因を除外することで、問題を解決し、Vue アプリケーションの開発を続行できるはずです。

以上がVue エラー: Vue アプリに予期しないトークン '<' – 解決方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。