Skip to content

图片路径有问题 #16593

@Lliuxs

Description

@Lliuxs

相关平台

微信小程序

复现仓库

https://github.com/Lliuxs/taro-app.git
小程序基础库: 3.5.8
使用框架: React

复现步骤

  1. 使用taro官方提供的demo https://github.com/NervJS/taro/tree/main/examples/blended-taro-component 打包为组件给原生的小程序使用
  2. 在demo代码中引入了img图片 import Img from "./img/1.png";
  3. taro build native-components --type weapp 在原生小程序中引用组件使用
  4. 提示图片找不到

期望结果

期望可以正确的加载图片

实际结果

图片的路径不正确
[渲染层网络层错误] Failed to load local image resource /components/common/img/1.png
the server responded with a status of 500 (HTTP/1.1 500 Internal Server Error)
(env: macOS,mp,1.06.2409182; lib: 2.14.4)

打包生成的代码为:
var _1_namespaceObject = webpack_require.p + "components/common/img/1.png";
webpack_require.p = "/";

引入的代码的路径为 /components/common/img/1.png 期望的代码是 taro/components/common/img/1.png
设置 output: publicPath ?

环境信息

Taro v3.6.22


  Taro CLI 3.6.22 environment info:
    System:
      OS: macOS 14.6.1
      Shell: 5.9 - /bin/zsh
    Binaries:
      Node: 20.11.1 - ~/.nvm/versions/node/v20.11.1/bin/node
      Yarn: 1.22.19 - ~/.nvm/versions/node/v14.19.0/bin/yarn
      npm: 10.2.4 - ~/.nvm/versions/node/v20.11.1/bin/npm
    npmPackages:
      @tarojs/cli: 3.6.24 => 3.6.24 
      @tarojs/components: 3.6.24 => 3.6.24 
      @tarojs/helper: 3.6.24 => 3.6.24 
      @tarojs/plugin-framework-react: 3.6.24 => 3.6.24 
      @tarojs/plugin-platform-h5: ^3.6.24 => 3.6.35 
      @tarojs/plugin-platform-weapp: 3.6.24 => 3.6.24 
      @tarojs/react: 3.6.24 => 3.6.24 
      @tarojs/runtime: 3.6.24 => 3.6.24 
      @tarojs/shared: 3.6.24 => 3.6.24 
      @tarojs/taro: 3.6.24 => 3.6.24 
      @tarojs/webpack5-runner: ^3.6.24 => 3.6.35 
      babel-preset-taro: 3.6.24 => 3.6.24 
      eslint-config-taro: 3.6.24 => 3.6.24 
      react: ^16.10.0 => 16.14.0 

Metadata

Metadata

Assignees

No one assigned

    Labels

    F-reactFramework - ReactT-weappTarget - 编译到微信小程序V-3Version - 3.x

    Type

    No type

    Projects

    Status

    Todo

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions