dcloudio / uni-app

A cross-platform framework using Vue.js
https://uniapp.dcloud.io
Apache License 2.0
39.72k stars 3.61k forks source link

H5端访问不到分包的static文件 #4997

Open xiaohe0601 opened 1 month ago

xiaohe0601 commented 1 month ago
// 目录结构

src
├─packages
│  ├─pkg-a
│  │  ├─static
│  │  │  ├─image.png
├─pages
// pages.json

{
  "subPackages": [{
    "root": "packages/pkg-a",
    "pages": [
      // ...
    ]
  }]
}
<image src="/packages/pkg-a/static/image.png"></image>

微信小程序端dev和build模式都可以正常访问到,但是H5端dev模式下找不到文件,build会报错

[vite]: Rollup failed to resolve import "/packages/pkg-a/static/image.png" from "xxx/packages/pkg-a/pages/index.vue?vue&type=script&setup=true&lang.ts".

版本信息

GRCmade commented 3 weeks ago

暂时没有复现,你可以说的详细一点吗,比如具体是哪个页面访问分包图片之类的

xiaohe0601 commented 3 weeks ago

uni-preset-vue-vite-ts.zip

@GRCmade /packages/pkg-a/index 页面,H5访问会报错,微信小程序正常

xiaohe0601 commented 3 weeks ago

经测试,从 3.0.0-alpha-4020120240617001 开始,微信小程序端编译时也会报错

[vite]: Rollup failed to resolve import "/packages/pkg-a/static/image.png" from "***/uni-preset-vue-vite-ts/src/packages/pkg-a/index.vue".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`
GRCmade commented 3 weeks ago

图片的路径加一个@就好了 image

xiaohe0601 commented 3 weeks ago

@GRCmade 直接使用 image 组件没有问题,如果是自定义组件请问应该怎么处理呢

src/components/AppImage.vue

<template>
  <image :src="props.src"></image>
</template>

<script setup lang="ts">
const props = defineProps<{
  src: string;
}>()
</script>

src/packages/pkg-a/index.vue

<template>
  <view class="content">
    <!-- 无法正常显示 -->
    <app-image src="@/packages/pkg-a/static/image.png"></app-image>

    <!-- 可以正常显示 -->
    <image src="@/packages/pkg-a/static/image.png"></image>
  </view>
</template>

<script setup lang="ts">
import AppImage from "@/components/AppImage.vue";
</script>
xiaohe0601 commented 2 weeks ago

@GRCmade 你好,请问有解决方案吗?🤔