taro UI@2.3.4打包微信小程序后文件路径与引用路径不符

[1stdoll]

Taro UI 版本信息

v2.3.4

问题描述

运行后小程序开发工具上提示weapp/npm/taro-ui/dist/weapp/components/tab-bar/index 路径下未找到组件，检查文件路径后发现路径不同。 取消提示页面的引用后发现其他引用Taro UI组件的页面均有该提示。 运行过程中未报错。

复现步骤

1.taro build --type weapp

复现代码

import { AtTabBar, } from 'taro-ui'

报错信息

[ pages/order-list/index.json 文件内容错误] pages/order-list/index.json: ["usingComponents"]["at-tab-bar"]: "../../npm/taro-ui/dist/weapp/components/tab-bar/index"，在 D:\work\Taro-joylink_minipro\dist\weapp/npm/taro-ui/dist/weapp/components/tab-bar/index 路径下未找到组件(env: Windows,mp,1.06.2308310; lib: 3.2.4)

系统信息

Taro CLI 2.2.21 environment info: System: OS: Windows 10 Binaries: Node: 14.21.3 - D:\setup\nvm\nodejs\node.EXE Yarn: 1.22.19 - D:\setup\nvm\node_global\yarn.CMD npm: 6.14.18 - D:\setup\nvm\nodejs\npm.CMD

"@tarojs/components": "2.2.16", "@tarojs/components-qa": "2.2.16", "@tarojs/plugin-sass": "^2.2.10", "@tarojs/plugin-uglify": "^2.2.10", "@tarojs/redux": "2.2.16", "@tarojs/router": "2.2.16", "@tarojs/taro": "2.2.16", "@tarojs/taro-alipay": "2.2.16", "@tarojs/taro-weapp": "2.2.16", "taro-ui": "^2.3.0",

补充信息

[taro-ui-bot[bot]]

欢迎提交 Issue~

如果你提交的是 bug 报告，请务必遵循 Issue 模板的规范，尽量用简洁的语言描述你的问题，最好能提供一个稳定简单的复现。🙏🙏🙏

如果你的信息提供过于模糊或不足，或者已经其他 issue 已经存在相关内容，你的 issue 有可能会被关闭。

Good luck and happy coding~

[robinv8]

提供个最小可复现的 Demo

[1stdoll]

已解决。 写了个运行后重写文件夹路径的方法。

[1stdoll]

提供个最小可复现的 Demo

复现demo： https://github.com/1stdoll/myTarouiDemo.git

[zpzxgcr]

已解决。 写了个运行后重写文件夹路径的方法。

我也是遇到这个问题我用的是pnpm 路径多了一层.npm 能贴一下你的解决办法吗

[1stdoll]

已解决。 写了个运行后重写文件夹路径的方法。

我也是遇到这个问题我用的是pnpm 路径多了一层.npm 能贴一下你的解决办法吗

我是在项目config文件里写了个方法传入打包过程中，然后在打包代码里应用 这是config里加的代码： mini: { onRunOver(_path = '') { const outPath = path.join(_path, 'taro-ui') const fromPath = path.join(_path, '.store/taro-ui@2.3.4/node_modules/taro-ui') const existsDir = () => { console.log('hasDir in outPath =>', fs.existsSync(outPath)) if (!fs.existsSync(outPath)) { console.log('hasDir in fromPath =>', fs.existsSync(fromPath)) if (fs.existsSync(fromPath)) { console.log('run renameSync') fs.renameSync(fromPath, outPath) existsDir() } else console.error('组件目录不存在') } else console.log(_path + '/taro-ui ok') } existsDir() if (process.env.TARO_ENV === 'alipay') { if (!fs.existsSync('../dist/alipay/mini.project.json')) { fs.copyFileSync(path.resolve(dirname, '..', 'mini.project.json'), path.resolve(dirname, '..', 'dist/alipay/mini.project.json')) } else console.log('dist/alipay/mini.project.json ok') } }, ｝

这是打包的代码里引用的代码： // node_modules@tarojs\mini-runner\dist\index.js function build(appPath, config) { if (typeof onRunOver === 'function') onRunOver(path.join(appPath, config.outputRoot, 'npm')) return __awaiter(this, void 0, void 0, function* () { const mode = config.mode; const baseWebpackChain = base_conf_1.default(appPath); yield customizeChain(baseWebpackChain, config.modifyWebpackChain, config.webpackChain); const buildWebpackConf = build_conf_1.default(appPath, mode, config, baseWebpackChain); const webpackChain = baseWebpackChain.merge(buildWebpackConf); const webpackConfig = webpackChain.toConfig(); const onBuildFinish = config.onBuildFinish; // 此处添加 const onRunOver = config.onRunOver; // const compiler = webpack(webpackConfig); return new Promise((resolve, reject) => { if (config.isWatch) { logHelper_1.bindDevLogger(compiler); compiler.watch({ aggregateTimeout: 300, poll: true }, (err, stats) => { if (err) { logHelper_1.printBuildError(err); if (typeof onBuildFinish === 'function') { onBuildFinish({ error: err, stats: null, isWatch: true }); } return reject(err); } if (typeof onBuildFinish === 'function') { onBuildFinish({ error: null, stats, isWatch: true }); } // 此处添加 if (typeof onRunOver === 'function') onRunOver(path.join(appPath, config.outputRoot, 'npm')) // resolve(); }); } else { logHelper_1.bindProdLogger(compiler); compiler.run((err, stats) => { if (err) { logHelper_1.printBuildError(err); if (typeof onBuildFinish === 'function') { onBuildFinish({ error: err, stats: null, isWatch: false }); } return reject(err); } if (typeof onBuildFinish === 'function') { onBuildFinish({error: null,stats,isWatch: false}); } // 此处添加 if (typeof onRunOver === 'function') onRunOver(path.join(appPath, config.outputRoot, 'npm')) // resolve(); }); } }); }); }

这算是邪道方案，因为打包配置不熟，没法一劳永逸，每次重新安装依赖都得重新加入后面这个。

[robinv8]

历史遗留问题了，我看下能不能正对 v2 版本修复一下，当然如果可以，尽可能使用 v3 版本