uniapp生产模式

uniapp生产模式配置与优化

环境配置

确保HBuilderX版本为最新稳定版，安装必要的插件和依赖。检查manifest.json文件中的基础配置，包括应用名称、版本号、图标等基础信息。

修改项目根目录下的vue.config.js文件，添加生产环境特定配置：

module.exports = {
  configureWebpack: {
    mode: process.env.NODE_ENV === 'production' ? 'production' : 'development'
  }
}

编译打包

通过HBuilderX顶部菜单选择「发行」→「原生App-云打包」或「H5」进行生产环境构建。对于H5平台，会在/dist/build/h5目录生成优化后的静态资源。

添加自定义编译条件到package.json：

"scripts": {
  "build:h5": "cross-env NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build"
}

代码优化

开启分包加载策略，在pages.json中配置：

"subPackages": [
  {
    "root": "pages/sub",
    "pages": [...]
  }
]

启用摇树优化（tree-shaking），在项目配置中设置：

optimization: {
  usedExports: true
}

性能调优

配置静态资源CDN加速，修改manifest.json：

"h5": {
  "cdn": {
    "js": ["https://cdn.example.com/vendor.js"],
    "css": []
  }
}

启用预加载策略：

"preloadRule": {
  "pages/index/index": {
    "network": "all",
    "packages": ["important"]
  }
}

安全加固

开启代码混淆，在manifest.json中设置：

"app-plus": {
  "confusion": true
}

配置HTTPS强制跳转：

// main.js
if (process.env.NODE_ENV === 'production') {
  uni.onNetworkStatusChange((res) => {
    if (!res.isConnected) showToast('网络异常')
  })
}

发布部署

H5平台部署需配置nginx重定向规则：

location / {
  try_files $uri $uri/ /index.html;
}

原生应用打包后需提交到各应用商店，注意配置不同的平台签名证书。定期检查更新机制是否正常工作，确保用户能及时获取最新版本。