[bug] getStorageSync is not a function in TypeScript 5, PNPM 8 & webpack 5.77

TechQuery commented 1 year ago

复现仓库

https://github.com/idea2app/Taro-Vant-MobX-ts/pull/6

浏览器版本: Chrome 111.0.5563.147
使用框架: React

复现步骤

用 pnpm dev h5 启动后，点 demo 主导航栏最后一个图标，代码会执行

import { getStorageSync } from '@tarojs/taro';

getStorageSync('token');

期望结果

没有报错，让接口逻辑可以正常执行。

实际结果

Uncaught (in promise) TypeError: _tarojs_taro__WEBPACK_IMPORTED_MODULE_7___default(...).getStorageSync is not a function

环境信息

👽 Taro v3.6.4

  Taro CLI 3.6.4 environment info:
    System:
      OS: Windows 10 10.0.19045
    Binaries:
      Node: 16.19.0 - C:\Program Files\nodejs\node.EXE
      Yarn: 1.22.19 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
      npm: 9.6.3 - C:\Program Files\nodejs\npm.CMD
    npmPackages:
      @tarojs/cli: 3.6.4 => 3.6.4
      @tarojs/components: 3.6.4 => 3.6.4
      @tarojs/helper: 3.6.4 => 3.6.4
      @tarojs/plugin-framework-react: 3.6.4 => 3.6.4
      @tarojs/plugin-html: 3.6.4 => 3.6.4
      @tarojs/plugin-platform-alipay: 3.6.4 => 3.6.4
      @tarojs/plugin-platform-h5: ^3.6.4 => 3.6.4
      @tarojs/plugin-platform-jd: 3.6.4 => 3.6.4
      @tarojs/plugin-platform-qq: 3.6.4 => 3.6.4
      @tarojs/plugin-platform-swan: 3.6.4 => 3.6.4
      @tarojs/plugin-platform-tt: 3.6.4 => 3.6.4
      @tarojs/plugin-platform-weapp: 3.6.4 => 3.6.4
      @tarojs/runtime: 3.6.4 => 3.6.4
      @tarojs/shared: 3.6.4 => 3.6.4
      @tarojs/taro: 3.6.4 => 3.6.4
      @tarojs/webpack5-runner: 3.6.4 => 3.6.4
      babel-preset-taro: 3.6.4 => 3.6.4
      eslint-config-taro: 3.6.4 => 3.6.4

补充信息

运行时 import 的对象与此相同：https://github.com/NervJS/taro/issues/12943#issuecomment-1340677480

YujiaCheng1996 commented 1 year ago

vue3版本有同样的问题，Taro.request、Taro.getSystemInfo啥的也是提示这个未找到。同时vue-router也不能用了，打开路径变为/#/pages/index/index，3.6.2版本没有这个尾巴。

naico-wang commented 1 year ago

vue3版本有同样的问题，Taro.request、Taro.getSystemInfo啥的也是提示这个未找到。同时vue-router也不能用了，打开路径变为/#/pages/index/index，3.6.2版本没有这个尾巴。

VirtualList内部报错应该也是这个原因，我用的是小程序，react @ZakaryCode 大佬帮忙看下？

ZakaryCode commented 1 year ago

babel 插件导出 API 缺失错误，可通过以下方法临时修复

  h5: {
    webpackChain (chain) {
      const rules = chain.module.rules
      const script = rules.get('script')
      const babelLoader = script.uses.get('babelLoader')
      babelLoader.set('options', {
        ...babelLoader.get('options'),
        plugins: [
          [require('babel-plugin-transform-taroapi'), {
            packageName: '@tarojs/taro',
            // https://unpkg.com/browse/@tarojs/plugin-platform-h5@3.6.2/dist/taroApis.js
            apis: require('./taroApis')
          }]
        ]
      })
    }
  }

ZakaryCode commented 1 year ago