djangoテンプレートからvueのビルドされたファイルを読み込みたい。

実現したいこと

djangoテンプレートからvueのビルドされたファイルを読み込みたい。

前提

vueでビルドされたファイルをDjangoテンプレートで読み込み、任意のコンポーネントにDjango側からpropsを渡したいと考えています。

発生している問題・エラーメッセージ

数点の問題が発生しており、解決策がわかりません。

・ビルドされたファイルは Djangoのstaticフォルダである
/static配下にあります。
static/app.bundle.jsを読み込むのはこれでいいのですが、
app.bundle.js内で画像を読み込むとき

/img/logo.svgを読み込もうとしており、staticに参照をしたいので、

/static/img/logo.svg ```を本来は参照する必要があります。 ビルドされたファイル内での参照先を変える方法がわかりません。 vue.config.jsで試してみたのは以下の通りです。 ```javascript chainWebpack: (config) => { config.module .rule("images") .use("file_loader") .loader("file-loader") .tap((options) => { return { ...options, name: "img/[name].[ext]", publicPath: "/static/", }; }); },

・現在では特定のID(#app)にマウントすることしかできておらず、特定のコンポーネントをDjangoから任意に呼び出すということが出来ていません。
こちらのやり方がわからず、教えて頂きたいです。

vue初心者なので、お手柔らかにお願いします。

コメントを投稿

0 コメント