ホームページ > 記事 > ウェブフロントエンド > 小さなプログラムにパッケージ化された uniapp のサイズが大きすぎる場合はどうすればよいですか?
モバイル インターネットの発展に伴い、小規模プログラムがますます多くの企業や開発者に選ばれるようになりました。マルチターミナル開発フレームワークとして、uniapp は開発者の間でますます支持されています。しかし、uniapp を使用して小さなプログラムを開発する過程で、多くの開発者は、パッケージ化された小さなプログラムが大きすぎるという同じ問題に遭遇しました。では、この問題をどのように解決すればよいでしょうか?
まず、uniapp がアプレットをパッケージ化すると、すべてのプラットフォームのコードが 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 ファイルに追加します: <pre class="brush:php;toolbar:false">configureWebpack: {
externals: {
'vue': 'Vue',
'vant': 'vant'
},
plugins: [...]
}</pre>
This CDN の使用方法 サードパーティのライブラリを導入してファイル サイズを削減します。
プラグインを使用すると、パッケージ化されたファイルの量を分析し、どのファイルが大きな割合を占めているかを確認し、コードをさらに最適化できます。
つまり、小さなプログラムにパッケージ化されたuniappのサイズが大きすぎるという問題は、ビルド構成ファイルを設定し、不要なコンポーネントやプラグインを削除し、小さなプログラムのクラウド開発を使用することで解決できます。開発者は実際のニーズに応じて上記の方法を柔軟に選択できます。
以上が小さなプログラムにパッケージ化された uniapp のサイズが大きすぎる場合はどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。