uni-app 摇树优化会清理掉cli构建的项目中public中的文件

uni-app 摇树优化会清理掉cli构建的项目中public中的文件

开发环境 版本号 项目创建方式
Windows Windows10 CLI

产品分类：uniapp/App

PC开发环境操作系统：Windows

手机系统：Android
手机系统版本号：Android 10
手机厂商：华为
手机机型：华为mate30pro

页面类型：vue
vue版本：vue2

打包方式：离线
CLI版本号：4.5.16

示例代码：

// vue.config.js，如没有此文件则手动创建
module.exports = {
  transpileDependencies: ['uview-ui'],
  pwa: {
    manifestOptions: {
      "name": "xxx",
      "short_name": "xxx",
      "description": "xxx",
      "theme_color": "#000000",
      "icons": [
        {
          "src": "public/img/icons/icon_x16.png",
          "sizes": "16x16",
          "type": "image/png"
        },
        {
          "src": "public/img/icons/icon_x32.png",
          "sizes": "32x32",
          "type": "image/png"
        },
        {
          "src": "public/img/icons/icon_x48.png",
          "sizes": "48x48",
          "type": "image/png"
        },
        {
          "src": "public/img/icons/icon_x72.png",
          "sizes": "72x72",
          "type": "image/png"
        },
        {
          "src": "public/img/icons/icon_x96.png",
          "sizes": "96x96",
          "type": "image/png"
        },
        {
          "src": "public/img/icons/icon_x128.png",
          "sizes": "128x128",
          "type": "image/png"
        },
        {
          "src": "public/img/icons/icon_x192.png",
          "sizes": "192x192",
          "type": "image/png"
        },
        {
          "src": "public/img/icons/icon_x384.png",
          "sizes": "384x384",
          "type": "image/png"
        },
        {
          "src": "public/img/icons/icon_x512.png",
          "sizes": "512x512",
          "type": "image/png"
        },
        {
          "src": "public/img/icons/icon-1024x1024.png",
          "sizes": "1024x1024",
          "type": "image/png"
        },
        {
          "src": "public/img/icons/maskable_icon_x16.png",
          "sizes": "16x16",
          "type": "image/png",
          "purpose": "maskable"
        },
        {
          "src": "public/img/icons/maskable_icon_x32.png",
          "sizes": "32x32",
          "type": "image/png",
          "purpose": "maskable"
        },
        {
          "src": "public/img/icons/maskable_icon_x48.png",
          "sizes": "48x48",
          "type": "image/png",
          "purpose": "maskable"
        },
        {
          "src": "public/img/icons/maskable_icon_x72.png",
          "sizes": "72x72",
          "type": "image/png",
          "purpose": "maskable"
        },
        {
          "src": "public/img/icons/maskable_icon_x96.png",
          "sizes": "96x96",
          "type": "image/png",
          "purpose": "maskable"
        },
        {
          "src": "public/img/icons/maskable_icon_x128.png",
          "sizes": "128x128",
          "type": "image/png",
          "purpose": "maskable"
        },
        {
          "src": "public/img/icons/maskable_icon_x192.png",
          "sizes": "192x192",
          "type": "image/png",
          "purpose": "maskable"
        },
        {
          "src": "public/img/icons/maskable_icon_x384.png",
          "sizes": "384x384",
          "type": "image/png",
          "purpose": "maskable"
        },
        {
          "src": "public/img/icons/maskable_icon_x512.png",
          "sizes": "512x512",
          "type": "image/png",
          "purpose": "maskable"
        },
        {
          "src": "public/img/icons/maskable_icon.png",
          "sizes": "1024x1024",
          "type": "image/png",
          "purpose": "maskable"
        }
      ],
      "start_url": ".",
      "display": "standalone",
      "background_color": "#000000",
    },
    name: 'xxx',
    themeColor: '#000000',
    msTileColor: '#000000',
    appleMobileWebAppCapable: 'yes',
    appleMobileWebAppStatusBarStyle: 'black',
    iconPaths: {
      favicon32: 'public/img/icons/icon_x16.png',
      favicon16: 'public/img/icons/icon_x32.png',
      appleTouchIcon: 'public/img/icons/apple-touch-icon-152x152.png',
      maskIcon: 'public/img/icons/safari-pinned-tab.svg',
      msTileImage: 'public/img/icons/msapplication-icon-144x144.png'
    },
    workboxPluginMode: 'GenerateSW',
    workboxOptions: {
      clientsClaim: true,
    }
  }
}

更多关于uni-app 摇树优化会清理掉cli构建的项目中public中的文件的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app 摇树优化会清理掉cli构建的项目中public中的文件的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在 uni-app 项目中，摇树优化（Tree Shaking） 是一种用于在构建过程中去除未使用代码的优化技术。它主要针对 JavaScript 模块，通过静态分析代码，删除未被引用的模块或代码块，从而减小最终打包文件的体积。

关于 public 文件夹

在 uni-app 项目中，public 文件夹通常用于存放静态资源（如图片、字体、JSON 文件等）。这些资源会被直接复制到最终的输出目录中，而不会经过 Webpack 的构建流程。

摇树优化与 public 文件夹的关系

摇树优化主要针对 JavaScript 模块，而 public 文件夹中的静态资源不会参与摇树优化。因此，摇树优化不会清理 public 文件夹中的文件。

可能的问题

如果你发现 public 文件夹中的文件在构建后被清理了，可能是以下原因导致的：

  1. 构建配置问题：检查你的构建配置（如 vue.config.js 或 webpack.config.js），确保没有配置错误导致 public 文件夹被忽略或删除。
  2. 插件或工具的影响：某些插件或工具可能会在构建过程中清理输出目录。确保没有配置或使用这样的插件。
  3. 手动清理：如果你在构建前手动清理了输出目录，可能会导致 public 文件夹中的文件被删除。

解决方案

  1. 检查构建配置：确保 public 文件夹被正确复制到输出目录。例如，在 vue.config.js 中，可以通过 copy-webpack-plugin 插件来确保静态资源被正确复制。
    const CopyWebpackPlugin = require('copy-webpack-plugin');

module.exports = {
  configureWebpack: {
    plugins: [
      new CopyWebpackPlugin([
        { from: 'public', to: 'public' }
      ])
    ]
  }
};
回到顶部