search

NervJS / taro-project-templates

Templates for `taro init`
82 stars 71 forks source link

pnpm 下， taro-ui 模板无 hoist 无法编译（幽灵依赖在哪里？） #92

Open ztl8702 opened 1 year ago

ztl8702 commented 1 year ago

复现步骤

  1. npx @tarojs/cli init

    ? 请输入项目名称！ new
? 请输入项目介绍 
? 请选择框架 React
? 是否需要使用 TypeScript ？ Yes
? 请选择 CSS 预处理器（Sass/Less/Stylus） Sass
? 请选择编译工具 Webpack5
? 请选择包管理工具 pnpm // 重点
? 请选择模板源 Github（最新）
✔ 拉取远程模板仓库成功！
? 请选择模板 taro-ui（使用 taro-ui 的模板）// 重点

  2. 在仓库根目录下创建 .npmrc：

    hoist=false

    在 pnpm中，hoist=false 会让幽灵依赖暴露出来。

  3. pnpm install

  4. pnpm build:weapp

预期结果：编译成功

实际结果:

Error: Cannot find module '@babel/traverse'
Require stack:
- /workspaces/taro-new/new2/node_modules/.pnpm/@tarojs+helper@3.5.11/node_modules/@tarojs/helper/dist/utils.js
- /workspaces/taro-new/new2/node_modules/.pnpm/@tarojs+helper@3.5.11/node_modules/@tarojs/helper/dist/npm.js
...

完整错误：https://gist.github.com/ztl8702/5d9b0652d9a692b68f08a86694c2c82c

其他信息

在我运行@tarojs/cli init时，应该拉的是这个模板： https://github.com/NervJS/taro-project-templates/tree/v3.5/taro-ui

ztl8702 commented 1 year ago

尝试第一步：

上述错误说明，@tarojs/helper 的存在幽灵依赖@babel/traverse。 看了一下 https://unpkg.com/@tarojs/helper@3.5.11/package.json 确实没有 @babel/traverse

用 pnpm packageExtensions 对 package.json 进行魔改:

  "pnpm": {
    "packageExtensions": {
      "@tarojs/helper": {
        "dependencies": {
          "@babel/traverse": "*"
        }
      }
    }
  }

pnpm install 后，再次 pnpm run build:weapp

这次遇到 '@tarojs/taro-loader' 缺失。https://gist.github.com/ztl8702/f0055f968fea45a6e39cc4d1be78ff0f

ztl8702 commented 1 year ago

这次遇到 '@tarojs/taro-loader' 缺失。https://gist.github.com/ztl8702/f0055f968fea45a6e39cc4d1be78ff0f

这就很蹊跷。 https://unpkg.com/@tarojs/webpack5-runner@3.5.11/package.json 里面明明有 @tarojs/taro-loader

ztl8702 commented 1 year ago

这就很蹊跷。 https://unpkg.com/@tarojs/webpack5-runner@3.5.11/package.json 里面明明有 @tarojs/taro-loader

是当前包（package.json）幽灵依赖了 @tarojs/taro-loader

pnpm add --save-dev @tarojs/taro-loader

pnpm run build:weapp 编译成功。

ztl8702 commented 1 year ago

结论

为了支持 pnpm hoist=false模式（姑且称为“无幽灵模式”？）下编译 taro 项目，需要如下改动：

1.@tarojs/taro-helper 需要增加依赖@babel/traverse。https://github.com/NervJS/taro/issues/13144

  1. 本仓库的模板需要增加依赖 @tarojs/taro-loader
ztl8702 commented 1 year ago

Example, 可用的模板：https://github.com/ztl8702/taro-project-templates-92/tree/69141c18a11e35871432e7d73906016d6fb89c6c