フロントエンド学習(2737):vue電子商取引サイト47の生成パッケージレポートを読み直す

パッケージ化では、プロジェクトに存在する問題を直感的に発見するために、パッケージ化時にレポートを生成できます.レポートを生成する方法は2つあります.
①コマンドラインパラメータの形でレポートを作成する
Javascript

//    vue-cli              
// --report        report.html         
vue-cli-service build --report

②可視化されたUIパネルで直接レポートを表示(推奨)
可視化されたUIパネルでは、コンソールと分析パネルによって、プロジェクトに存在する問題を簡単に見ることができます.
vueを通ります.config.js webpackのデフォルト構成の変更vue-cli 3.0ツールによって生成されたプロジェクトは、すべてのwebpackの構成項目をデフォルトで非表示にし、プロジェクトの構成過程を遮断し、プログラマーに仕事の重心を具体的な機能とビジネスロジックの実現に置くことを目的としています.
プログラマがwebpackのデフォルト構成を変更する必要がある場合は、プロジェクトのルートディレクトリにvue.config.jsというプロファイルを必要に応じて作成し、プロジェクトのパッケージパブリケーションプロセスをカスタマイズできます.
(詳細構成リファレンスhttps://cli.vuejs.org/zh/config/#vue-config-js).
Javascript

// vue.config.js
//      ，                   
module.exports = {
//   ...
}

開発モードとパブリッシュモードの異なるパッケージ・エントリを指定します.
デフォルトでは、Vueプロジェクトの開発モードとパブリケーションモードは、同じパッケージのエントリファイル(src/main.js)を共有します.プロジェクトの開発プロセスとパブリケーションプロセスを分離するには、パッケージ化されたエントリファイル、すなわち、次の2つのモードを指定します.

開発モードのエントリファイルはsrc/main-dev.js

である.

パブリッシュモードのエントリファイルはsrc/main-prod.js

です.configureWebpackおよびchainWebpackvue.config.jsからエクスポートされた構成オブジェクトには、configureWebpackまたはchainWebpackノードが追加され、webpackを定義するパッケージ構成から追加されます.
ここで、configureWebpackとchainWebpackの役割は同じであり、唯一の違いはwebpack構成を変更する方法が異なることです.
①chainWebpackチェーンプログラミング形式によりデフォルトのwebpack構成を変更②configureWebpack操作対象の形式によりデフォルトのwebpack構成を変更
両者の具体的な使用の違いは、以下のURLを参照してください.
トランスファゲート