uni-app更新4.28后,秋云ucharts打包发布时大小约为1M,超出小程序限制
uni-app更新4.28后,秋云ucharts打包发布时大小约为1M,超出小程序限制
以前的版本,秋云ucharts打包后一共就100K。现在更新后秋云ucharts有1M,导致小程序太大,都无法发布了。这是什么情况?如何解决
下载附件,解压出copy.js,替换HBuilderX/plugins/uniapp-cli-vite/node_modules/@dcloudio/vite-plugin-uni/dist/plugins/copy.js,然后试试
请问怎么解决的呢?
在uni-app更新到4.28版本后,遇到ucharts打包发布时体积过大的问题确实需要注意。由于小程序对包大小有严格限制,超过限制将导致无法发布。针对这个问题,我们可以通过代码优化、按需引入以及利用第三方插件的压缩功能等方法来减小ucharts的体积。以下是一些具体的代码案例和操作步骤:
1. 按需引入ucharts组件
确保你只引入了需要的ucharts组件,而不是整个库。在uni-app中,你可以通过配置easycom
或babel-plugin-import
等插件来实现按需加载。
示例配置(以babel-plugin-import为例):
在.babelrc
或babel.config.js
中添加如下配置:
{
"plugins": [
[
"import",
{
"libraryName": "ucharts",
"libraryDirectory": "components",
"camel2DashComponentName": false
},
"ucharts"
]
]
}
然后在你的页面中按需引入组件:
import { Line } from 'ucharts';
export default {
components: {
'u-line': Line
}
}
2. 使用Webpack进行代码分割
如果你使用的是HBuilderX进行打包,可以尝试配置Webpack进行代码分割,将ucharts等第三方库单独打包成一个chunk,以便在需要时动态加载。
webpack.config.js示例:
optimization: {
splitChunks: {
chunks: 'all',
minSize: 20000,
maxSize: 70000,
minChunks: 1,
maxAsyncRequests: 30,
maxInitialRequests: 30,
automaticNameDelimiter: '~',
cacheGroups: {
vendors: {
test: /[\\/]node_modules[\\/]/,
priority: -10
},
ucharts: {
name: 'ucharts',
test: /[\\/]node_modules[\\/]ucharts[\\/]/,
chunks: 'all'
}
}
}
}
3. 利用第三方工具压缩代码
在打包前,可以利用如terser-webpack-plugin
等工具对代码进行压缩,进一步减小包体积。
安装terser-webpack-plugin:
npm install terser-webpack-plugin --save-dev
webpack.config.js中配置terser-webpack-plugin:
const TerserPlugin = require('terser-webpack-plugin');
module.exports = {
optimization: {
minimize: true,
minimizer: [new TerserPlugin()],
},
};
通过上述方法,你应该能够有效地减小ucharts在小程序中的包体积,从而避免超出小程序的大小限制。请根据实际情况调整配置,确保功能正常且体积优化效果最佳。