小さなプログラムにパッケージ化された uniapp のサイズが大きすぎる場合はどうすればよいですか?

モバイル インターネットの発展に伴い、小規模プログラムがますます多くの企業や開発者に選ばれるようになりました。マルチターミナル開発フレームワークとして、uniapp は開発者の間でますます支持されています。しかし、uniapp を使用して小さなプログラムを開発する過程で、多くの開発者は、パッケージ化された小さなプログラムが大きすぎるという同じ問題に遭遇しました。では、この問題をどのように解決すればよいでしょうか?

まず、uniapp がアプレットをパッケージ化すると、すべてのプラットフォームのコードが 1 つのファイルにパッケージ化されることを理解する必要があります。これにより、ミニ プログラムのサイズが大きくなり、ユーザーはミニ プログラムをダウンロードするときにより多くのデータを消費する必要があり、ユーザー エクスペリエンスに影響します。したがって、ミニプログラムのサイズを減らすために何らかの措置を講じる必要があります。

1. ビルド構成ファイルの構成

uniapp プロジェクトでは、ビルド構成ファイル vue.config.js を構成することでサイズを削減できます。ミニプログラムのサイズ。具体的な方法は以下の通りです。

(1) マルチスレッド構築を有効にする

#vue.config.js ファイルに以下の設定を追加します。

parallel: require('os').cpus().length > 1

これは機能します マルチスレッド ビルドを有効にして、実行速度を向上させ、ファイル サイズを削減します。

(2) 圧縮コード

次の設定を

vue.config.js ファイルに追加します。

configureWebpack: {
    optimization: {
        minimizer: [
            new TerserPlugin({
                terserOptions: {
                    compress: {
                        warnings: false,
                        drop_console: true, // 生产环境移除console
                        drop_debugger: true // 生产环境移除debugger
                    },
                    output: {
                        // 最紧凑的输出
                        beautify: false,
                        // 删除所有的注释
                        comments: false
                    }
                }
            })
        ]
    },
    plugins: [...]
}

この方法で ## を使用できます。 #TerserPlugin

プラグインはコード圧縮を実行してファイル サイズを削減します。 (3) CDN を使用してサードパーティ ライブラリを導入する

次の構成を

vue.config.js

ファイルに追加します: <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">configureWebpack: {     externals: {         'vue': 'Vue',         'vant': 'vant'     },     plugins: [...] }</pre><div class="contentsignin">ログイン後にコピー</div></div>This CDN の使用方法 サードパーティのライブラリを導入してファイル サイズを削減します。

不要なコンポーネントとプラグインを削除する

2. uniapp アプレットを開発するときに、不要なコンポーネントやプラグインを導入することがあります。これにより、アプリケーションのサイズが大きくなることがあります。プログラムの量が増えます。したがって、パッケージ化するときに、プロジェクトから不要なコンポーネントやプラグインを削除し、アプリケーションのサイズを削減できます。たとえば、

webpack-bundle-analyzer

プラグインを使用すると、パッケージ化されたファイルの量を分析し、どのファイルが大きな割合を占めているかを確認し、コードをさらに最適化できます。

ミニ プログラム クラウド開発の使用

3. パッケージ化されたミニ プログラムのサイズがまだ大きすぎる場合は、ミニ プログラム クラウド開発の使用を検討できます。ミニプログラムのクラウド開発では、アプリケーションのビジネスロジックをクラウド上に配置することができるため、ミニプログラムのサイズが小さくなり、開発効率や実行速度が向上し、ユーザーエクスペリエンスが向上します。

つまり、小さなプログラムにパッケージ化されたuniappのサイズが大きすぎるという問題は、ビルド構成ファイルを設定し、不要なコンポーネントやプラグインを削除し、小さなプログラムのクラウド開発を使用することで解決できます。開発者は実際のニーズに応じて上記の方法を柔軟に選択できます。

以上が小さなプログラムにパッケージ化された uniapp のサイズが大きすぎる場合はどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。