相关平台
飞书小程序
使用框架: React
复现步骤
我使用pnpm 搭建了一个monorepo项目目录结构如下:
apps/myApp(小程序app)
packages/common-components(使用ts代码写的公共组件)
- 问题一:当我在myApp 中引用common-components的组件时,会把这个下面的所有组件都打包进去,不会做treeshaking。
- 问题二:当我在myApp 中引用common-components中使用图片的组件时,打包的时候不会把common-components中使用的图片打包在dist目录下,而是打包在和myApp同一个层级下面。
- 问题三:由于common-components下的组件是使用ts写的,我想开启mini.compile.include 选项,使该部分能够得到编译时发现会编译失败提示:
ModuleParseError: Module parse failed: Unexpected token (18:12)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| }
|
> protected async getAxiosPromise(config: MiniProgramApiConfig) {
| const sendConfig = await this.getSendConfig(config);
|
;相反如果我不开启mini.compile.include 选项,common-components下的ts代码倒是可以正常编译
期望结果
图片打包路径正常、有treeshaking、配置mini.compile.include 后可以正常编译
实际结果
和期望结果相反
环境信息
👽 Taro v3.6.1
Taro CLI 3.6.1 environment info:
System:
OS: macOS 12.5.1
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 14.19.0 - ~/.nvm/versions/node/v14.19.0/bin/node
Yarn: 1.22.19 - ~/.nvm/versions/node/v14.19.0/bin/yarn
npm: 6.14.16 - ~/.nvm/versions/node/v14.19.0/bin/npm
npmPackages:
@tarojs/cli: 3.6.1 => 3.6.1
@tarojs/components: 3.6.1 => 3.6.1
@tarojs/helper: 3.6.1 => 3.6.1
@tarojs/plugin-framework-react: 3.6.1 => 3.6.1
@tarojs/plugin-platform-alipay: 3.6.1 => 3.6.1
@tarojs/plugin-platform-h5: 3.6.1 => 3.6.1
@tarojs/plugin-platform-jd: 3.6.1 => 3.6.1
@tarojs/plugin-platform-qq: 3.6.1 => 3.6.1
@tarojs/plugin-platform-swan: 3.6.1 => 3.6.1
@tarojs/plugin-platform-tt: 3.6.1 => 3.6.1
@tarojs/plugin-platform-weapp: 3.6.1 => 3.6.1
@tarojs/react: 3.6.1 => 3.6.1
@tarojs/runtime: 3.6.1 => 3.6.1
@tarojs/shared: 3.6.1 => 3.6.1
@tarojs/taro: 3.6.1 => 3.6.1
@tarojs/webpack5-runner: 3.6.1 => 3.6.1
babel-preset-taro: 3.6.1 => 3.6.1
eslint-config-taro: 3.6.1 => 3.6.1
react: ^18.0.0 => 18.2.0
2条答案
按热度按时间7vux5j2d1#
老版本用webpack4至少图片资源路径是正常的,新版本升级后用5就都不正常了
jgzswidk2#
webpack 5 在资源模块有升级,可以看看官网的解决方法:https://webpack.docschina.org/guides/asset-modules#inlining-assets