uni-app 使用npm link方式安装的本地包 在开发模式时启动微信开发者工具会报文件不存在

uni-app 使用npm link方式安装的本地包 在开发模式时启动微信开发者工具会报文件不存在

操作步骤:

  • 通过npm link [packageName] 方式安装一个本地包
  • 项目中某个页面依赖npm link packageName 的包
  • 启动hbuilder,并且在微信开发者工具下运行项目
  • 微信开发者工具会提示文件不存在导致报错,界面空白,浏览器运行是可以的

预期结果:

希望通过npm link安装的包,在微信开发者工具下能正常运行,并且打包也没问题

实际结果:

微信开发者工具会提示文件不存在导致报错,界面空白

bug描述:

  • 通过npm link [packageName] 方式安装一个本地包
  • 启动hbuilder,并且在微信开发者工具下运行项目
  • 微信开发者工具会提示文件不存在,如图【图1】 【图2】
    排查发现和正常生产的编译文件中,少了一些文件,如图:
    【图2】【图3】
信息类别 信息内容
产品分类 uniapp/App
PC开发环境 Mac
PC操作系统版本 10.15.7
HBuilderX类型 正式
HBuilderX版本 3.99
手机系统 iOS
手机系统版本 iOS 17
手机厂商 苹果
手机机型 iphone 12
页面类型 vue
vue版本 vue2
打包方式 云端
项目创建方式 HBuilderX

图1 图2 图3


更多关于uni-app 使用npm link方式安装的本地包 在开发模式时启动微信开发者工具会报文件不存在的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

我看问题归类和内容不一致,这个问题是 app 有问题还是微信小程序有问题?
你测试这个和编辑器有关系吗,cli 会这样吗?引用组件或者文件之后,打印有内容吗?

更多关于uni-app 使用npm link方式安装的本地包 在开发模式时启动微信开发者工具会报文件不存在的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在使用 npm link 方式安装本地包时,可能会遇到在开发模式下启动微信开发者工具报“文件不存在”的错误。这个问题通常是由于 npm link 创建的符号链接(symlink)在微信开发者工具中无法正确解析所导致的。

解决方案

  1. 使用 npm install 代替 npm link:

    • 如果你只需要在开发环境中使用本地包,可以将其打包并发布到本地 npm 仓库,然后在项目中通过 npm install 安装。
    • 例如,你可以使用 npm pack 打包本地包,然后在项目中通过 npm install /path/to/package.tgz 安装。
  2. 将本地包直接复制到项目中:

    • 将本地包的代码直接复制到项目的 node_modules 目录中,而不是使用符号链接。
    • 这种方法虽然不够优雅,但在某些情况下可以解决问题。
  3. 修改微信开发者工具的配置:

    • 在微信开发者工具中,尝试修改项目的配置文件,使其能够正确处理符号链接。不过,这种方法并不总是有效,因为微信开发者工具对符号链接的支持可能有限。
  4. 使用 webpackvite 的别名功能:

    • 如果你使用的是 webpackvite,可以通过配置别名(alias)来直接引用本地包的源代码,而不是通过 npm link
    • 例如,在 vite.config.js 中:
      import { defineConfig } from 'vite';
      import path from 'path';
      
      export default defineConfig({
        resolve: {
          alias: {
            'my-local-package': path.resolve(__dirname, '../path/to/my-local-package'),
          },
        },
      });
回到顶部