File背景VueCLIでWebpackの設定をしたいのだが、やり方がよくわからない。そもそもWebpackの知識も不足している状態。VueCLIのマニュアルにあたってみる。vue.config.js:webpack構成を微調整する最も簡単な方法は、vue.config.jsのconfigureWebpackオプションにオブジェクトを提供することです。together.一部のwebpackオプションは、vue.config.jsの値に基づいて設定されるため、直接変更しないでください。output.pathを変更する代わりに、vue.config.jsのoutputDirオプションを使用する必要があります。output.publicPathを変更する代わりに、vue.config.jsのpublicPathオプションを使用する必要があります。これは、vue.config.jsの値が構成内の複数の場所で使用され、すべてが正常に機能するようにするためです。merged:環境に基づいた条件付き動作が必要な場合、または構成を直接変更したい場合は、関数を使用します(env変数の設定後に遅延評価されます)。関数は、解決された構成を引数として受け取ります。関数内で、設定を直接変更するか、マージされるオブジェクトを返すことができます。options.このライブラリは、名前付きローダールールと名前付きプラグインを定義し、後でそれらのルールを「タップ」してオプションを変更する機能を備えた、未加工のWebpack構成を抽象化します。vue.config.js.これにより、内部構成をより細かく制御できます。以下に、vue.config.jsのchainWebpackオプションを使用して行われる一般的な変更の例を示します。inspectは、チェーンを介して特定のローダーにアクセスしようとする場合に非常に役立ちます。place.CSS関連のローダーの場合、チェーンを介してローダーを直接ターゲットにするのではなく、css.loaderOptionsを使用することをお勧めします。これは、CSSファイルタイプごとに複数のルールがあり、css.loaderOptionsによって、すべてのルールが1か所で影響を受けるようになるためです。file:既存のベースローダーを交換したい場合、たとえば、ファイルをロードする代わりにvue-svg-loaderを使用してSVGファイルをインライン化します。configの変更方法を提供します。config:たとえば、index.htmlのデフォルトの場所を/Users/username/proj/public/index.htmlから/Users/username/proj/app/templates/index.htmlに変更するとします。渡すことができるオプションのリストを見ることができます。テンプレートパスを変更するには、次の構成で新しいテンプレートパスを渡します。configを調べます。これについては次に説明します。cli-serviceはwebpackの設定を抽象化するため、特に自分で調整しようとする場合は、設定に含まれる内容を理解するのが難しくなる場合があります。project.vue-cli-serviceは、解決されたwebpack構成を検査するためのinspectコマンドを公開します。グローバルvueバイナリはinspectコマンドも提供し、プロジェクトのvue-cli-service検査に単純にプロキシします。chaining.このコマンドは、解決されたwebpack構成をstdoutに出力します。これには、連鎖を介してルールとプラグインにアクセスする方法に関するヒントも含まれています。path:一部の外部ツールは、解決されたwebpack構成にファイルとしてアクセスする必要がある場合があります。webpack構成パスが必要なIDEやコマンドラインツールなどです。その場合、次のパスを使用できます。configurations.このファイルは、vue-cli-serviceコマンドで使用されるものとまったく同じwebpack構成を動的に解決してエクスポートします。これには、プラグインやカスタム構成からのものも含まれます。プログラミング初心者。紆余曲折を経て、2019年2月よりプログラミング学習をスタート。プログラマーを目指して勉強中。→詳細画像ツイッタープログラミング学習のアウトプットや備忘録のために、Twitter開始。