升级到 1.3.14 版本分包失败

[julytian]

我目前使用的是 1.3.9 版本，分包里面使用uni-echarts 插件打包后会打在分包里面。
今天升级到 1.3.14 版本之后发现分包失败了，插件都打在主包里面了

[Vanisper]

你好，只是没有分包效果是吗。
项目应该没有报错吧。

能提供一个复现项目吗，或者加我微信，咱们私聊调试。

[Vanisper]

我之后可能会更新一个版本，打印更多详细的日志，并且生成日志文件。

到时候向我提供日志文件供我排查。

不过也可以随时私聊我解决问题。

[Vanisper]

v1.3.14...v1.3.15-beta.2

更新了 v1.3.15-beta.2，新增了一个实验功能，可以输出日志到文件内，功能开启是这样使用的：

然后运行项目之后可以看到在你的 node_modules/.cache/@uni-ku/bundle-optimizer/ 下面有一个 logs.log 文件，
这里面会有比较详细的日志信息，可以提供给我分析一下。当然，单纯的日志可能并不能分析出问题。

由于发的是 beta 版本，可能会更新不上去？可以先用包管理工具删除这个包之后再安装当前版本。
后续的计划是解决了你的问题之后再发正式版。

[julytian]

看下这个 demo，安装依赖之后执行pnpm build:mp-weixin看下最新版本和 1.3.9 版本打包出来的结果对比下
bundle-optimizer-demo

[Vanisper]

分别是：默认（未分包）、旧版分包效果、新版分包效果

[Vanisper]

新版对三方组件库，也就是 node_modules 下的组件库做了一些调整优化。
node_modules 下的三方组件库，在编译成小程序之后，是会在根目录的 node-modules 下的，这其实也是属于主包的。

如上图的中间那一个版本，是没有考虑三方组件库的主包所属问题的，其实你会发现如下类似的警告：

即使这只是警告，但这其实是存在不稳定、不正确的包的所属问题的，是有隐患的；
而新版则是修正了这个问题。

[Vanisper]

之前版本能对三方组件库的分包效果这么明显，其实是因为把组件库所有的 javascript 依赖都打包到子包里面了。

但实际上，三方组件库所处位置在主包，所以三方组件库是主包内容，
主包内容直接引用的函数或者说库，都应该直属于主包，这就是新版纠正的内容之一。

---

其实这个问题也是有可以说道的地方，
如果某个组件真的能判定只属于某一个子包，
那么本插件需要实现的是把这个组件文件的位置直接迁移到子包内，
就能够完完全全被某一个子包所属，就不会有本话题的问题了。

但其实要考虑的还有很多，
例如，某一个组件完全被子包所属，
但是，这个组件和组件库的其他组件有关联，
他不是单一的、“游离依赖” 的组件，
就又得考虑组件之间的相互依赖的作用关系，最后才可以确定该组件的真正所属。

这个问题是后续的一个比较重大的课题，所以敬请期待。
至于目前的插件的分包效果有一点点削弱，其实是对之前分包策略的一个修正导致的副作用。

[ZhongGuoDragon]

@Vanisper 1.3.14还有个小问题 cli开发下使用 "unplugin-auto-import": "^19.3.0",
"unplugin-icons": "22.1.0",
"unplugin-vue-components": "^28.8.0",

子包引用主包 没有使用import主包插件有时候编译到小程序变成了<></> 加上import就没有问题，1.3.8没有出现这个问题

[Vanisper]

@ZhongGuoDragon 你好。
我猜想你是不是封装了一个全局的图标库的组件，使用了组件全局注册？
这个问题可以提供一个示例项目吗？

[ZhongGuoDragon]

@ZhongGuoDragon 你好。 我猜想你是不是封装了一个全局的图标库的组件，使用了组件全局注册？ 这个问题可以提供一个示例项目吗？

就是普通的分包组件引用主包的组件，普通组件，这个复现不了的，vscode开发的 热更新时候会出现 本身有时候热更新小程序开发者工具都会出问题 主包使用的是

components.d.ts
/* eslint-disable */
// @ts-nocheck
// Generated by unplugin-vue-components
// Read more: https://github.com/vuejs/core/pull/3399
// biome-ignore lint: disable
export {}

/* prettier-ignore */
declare module 'vue' {
  export interface GlobalComponents {
    BAlbum: typeof import('./../components/b-album/b-album.vue')['default']
    BAuthModal: typeof import('./../components/b-auth-modal/b-auth-modal.vue')['default']
    BCheckbox: typeof import('./../components/b-checkbox/b-checkbox.vue')['default']
    BCheckUpdate: typeof import('./../components/b-check-update/b-check-update.vue')['default']
    BCityPicker: typeof import('./../components/b-city-picker/b-city-picker.vue')['default']
    BComment: typeof import('./../components/b-comment/b-comment.vue')['default']
    BCommentCard: typeof import('./../components/b-comment-card/b-comment-card.vue')['default']
    BCommentList: typeof import('./../components/b-comment-list/b-comment-list.vue')['default']
    BDatePicker: typeof import('./../components/b-date-picker/b-date-picker.vue')['default']
    BDictTag: typeof import('./../components/b-dict-tag/b-dict-tag.vue')['default']
    BDropdown: typeof import('./../components/b-dropdown/b-dropdown.vue')['default']
    BDropdownV2: typeof import('./../components/b-dropdown-v2/b-dropdown-v2.vue')['default']
    BFab: typeof import('./../components/b-fab/b-fab.vue')['default']
    BFixed: typeof import('./../components/b-fixed/b-fixed.vue')['default']
    BFloatPanel: typeof import('./../components/b-float-panel/b-float-panel.vue')['default']
    BForm: typeof import('./../components/b-form/b-form.vue')['default']
    BFormItem: typeof import('./../components/b-form-item/b-form-item.vue')['default']

// vite.config.ts
import Components from 'unplugin-vue-components/vite';
export default defineConfig(async ({ mode }: ConfigEnv): Promise<UserConfig> => {
  const env = loadEnv(mode, __dirname);
  const { UNI_PLATFORM } = process.env;
  return {
    base: env.VITE_APP_CONTEXT_PATH,
    css: { preprocessorOptions: { scss: { api: 'modern-compiler' } } }, // 解决 uni-app scss 编译报错 并且不能云打包
    resolve: {
      alias: {
        '@': path.resolve(__dirname, './src')
      },
      extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue']
    },
    plugins: [
      Components({
        resolvers: [
          // 自动注册图标组件
          IconsResolver({ componentPrefix: 'icon' })
        ],
        dts: 'src/types/components.d.ts'
      }),

比如我这个占位组件偶尔就失败变成<>然后中间是refrence啥的</>

<template>
  <view :style="{ height: statusBarHeight }" class="uni-status-bar"></view>
</template>

<script setup lang="ts">
import { platform } from '@/hooks';
const statusBarHeight = platform.device.statusBarHeight + 'px';
</script>
<style lang="scss">
.uni-status-bar {
  height: var(--status-bar-height);
}
</style>

今天没发现昨天是有，昨天刚更新的包

[Vanisper]

@ZhongGuoDragon 这个问题先放一放哈，最近在做别的事情。

[Vanisper]

@ZhongGuoDragon 你好关于你这个问题，你可以尝试升级下到目前的新版本
不过要注意一下迁移问题，2.0.0 版本之后有几个重要改动，后续如果还有问题的话，可以再开新话题反馈。