問題タブ [nuxt-content]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
nuxt.js - Nuxt コンテンツ + Vuetify コンポーネント = マークダウン コンテンツをレンダリングするテンプレート ページでインポートのブロックを削除する方法
私の「個人用ページ」プロジェクトでは@nuxt/content
、コンテンツ用のモジュールと Vuetify UI フレームワークを備えた NuxtJS を使用しています。
最近発見された問題: マークダウン ファイル内の Vuetify コンポーネントは、静的サイトの生成時にレンダリングされませんが、開発モードでプロジェクトを実行すると正しくレンダリングされます。この問題に関する@nuxt/contentの問題を確認したところ、 #221と#700 の2 つの問題が見つかりました。
主な議論はissue #221内でした。
問題からすぐに理解できるように、Vuetifyローダーはマークダウンファイルのコンテンツをチェックしません。そのため、nuxt generate
Vuetifyコンポーネント(インポートなしで任意のコンポーネントで使用される可能性がある)を実行している間、マークダウンファイル内で使用されている間はレンダリングされません。nuxt dev
開発モードでは Treeshake が無効になっているため、Vuetify コンポーネントは正しくレンダリングされます。
マークダウン ファイル内では、コンポーネントを 1 つだけ使用<v-alert>
したので、最終的な解決策は次のとおりです。
マークダウン ファイルのコンテンツを表示するページでこのコードを使用する必要があります。結果は私が望むものnuxt generate
です-マークダウンファイル内で使用された場合、Vuetifyコンポーネントは正常にレンダリングされました。
しかし、このコードには 1 つの問題もあります。これを実行すると、Vuetify コンポーネントでマークダウンを表示するページにアクセスするとnuxt dev
エラーが発生します。Unexpected token 'export'
最後に問題は、マークダウン コンテンツを表示するためのテンプレートを含むページからこれらのインポートを削除する方法です。おそらく「条件付きインポート」(実行時にのみこれらのインポートを実行するnuxt generate
)のようなものですか?
もちろん、プロジェクトを開発モードで実行するたびにコメント/コメント解除できますが、それが正しい方法かどうかはわかりません。
vue.js - nuxt/content を使用して、データベースから取得したマークダウンを表示します
アプリで nuxt / content を使用していますが、正常に動作しています。アプリの別の部分で、データベースからマークダウンを取得して表示したいと考えています。
解析ステップがないため、これは機能しません。これを行う$content("a_page_title_here").fetch()
と、フェッチされたテキストが解析され、構造化された json としてコンポーネントに提示されます。
$content
テキストを解析してコンポーネントに渡して表示するにはどうすればよいですか?
それを行う方法があるに違いありませんが、ドキュメントには、でできることすべてを説明する参照セクションは含まれていません$content
。
基礎となる Remark コンポーネントを使用する簡単な方法があれば、それを実行できます。
vue.js - nuxt コンテンツの本文データを取得する
nuxt.js/contentを使用してポートフォリオ プロジェクトをセットアップしました
必要なすべてのコンテンツを 1 ページだけに表示しようとしています。
コンテンツを表示する方法は次のとおりです。
データの保存場所、設定方法currentPortfolioItem
、データの取得方法は次のとおりです。
今私の考えでは、そのnuxt-link
ボタンを押すと、その下に div が開き、.md ファイルの内部が表示されます。
私が直面している問題は、nuxt/content ドキュメントから .md ファイルの本文を表示する方法を読み取る唯一の方法は、これを使用することです。
しかし、これを使用すると、何らかの理由で、どこに表示してもデータが表示されません。要素が機能するのは別の_slug.vue
ファイルだけです
/content API を介して送信されるオブジェクトを調べてみました。Body オブジェクトを取得しましたが、.md ファイルで使用されているものに応じて変化する要素の小さな配列に分割されています。そのようです:
したがって、ここから続行する方法がわかりません。おそらく、誰かがこれを行う方法を知っているか、アイデアを持っていますか?