每次编译时提示警报：WARNING in external "taro_app_library@/remoteEntry.js"

[jaruan]

相关平台

H5

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

复现步骤

1. 使用taro命令行创建项目。 taro init my-app
2. 框架选择 React
3. 是否需要使用 TypeScript ？ (Y/n) Y
4. 请选择 CSS 预处理器（Sass/Less/Stylus）Sass
5. 请选择编译工具 Webpack5
6. 请选择包管理工具 npm
7. 请选择模板源 Github（最新)
8. 请选择模板 taro-ui（使用 taro-ui 的模板）
9. npm install 安装好所有依赖
10. npm run dev:h5
11. 浏览器提示：

Compiled with problems:X

WARNING in external "taro_app_library@/remoteEntry.js"

The generated code contains 'async/await' because this module is using "external script".
However, your target environment does not appear to support 'async/await'.
As a result, the code may not run as expected or may cause runtime errors.

期望结果

不提示警告或者错误信息

实际结果

浏览器提示：

Compiled with problems:X

WARNING in external "taro_app_library@/remoteEntry.js"

The generated code contains 'async/await' because this module is using "external script".
However, your target environment does not appear to support 'async/await'.
As a result, the code may not run as expected or may cause runtime errors.

环境信息

 Taro v3.6.25


  Taro CLI 3.6.25 environment info:
    System:
      OS: Windows 11 10.0.22631
    Binaries:
      Node: 18.16.1 - D:\Applications\nodejs\node.EXE
      npm: 9.5.1 - D:\Applications\nodejs\npm.CMD

[EverglowHe]

我也遇到了这个问题，不知道是怎么解决的哇

[jiankian]

俺也一样，主要在微信小程序中预览效果，后来一看H5版本就编译告警，一开始没有，后来加了几个页面就出来了。
看了文档说是Taro3不用配置异步编程的

[scottdao]

一样

[wiilsliang]

我目前是这样解决的：在src/config/index.ts文件中配置compiler:
compiler: { type: "webpack5", prebundle: { enable: false, }, }
就没有那个警告了

[brainee]

配置了compiler: { type: "webpack5", prebundle: { enable: false, }, }，还是存在这个告警

配置了 output:{
environment:{
asyncFunction:true,
}
},
也还是告警，

配置了"browserslist": [
"defaults and fully supports async-functions",
"Android >= 4.1",
"ios >= 8"
],也还是告警，

[koppthe]

这是因为 webpack v5.90.0+ 新增了个 output.environment.asyncFunction 配置，在目标环境不支持 async/await 时，为 asyncModule 添加了警告
详细 PR 可查看 webpack/webpack#17958

目前临时的解决方案如下：

1. 方案一：关闭 prebundler

  /* config/index.ts */
  const config = {
     ...
    compiler: {
      prebundle: {
        enable: false,
      },
      type: 'webpack5'
    },
  }

2. 方案二：默认开启 asyncFunction

  /* config/index.ts */
  const config = {
    h5: {
      output: {
        environment: {
          asyncFunction: true,
        },
       ...
      },
    }
  }

以上是临时的解决方法，问题出在 @tarojs/webpack5-prebundle 没有处理 asyncFunction 的逻辑，会在近期的版本中修复

[koppthe]

#15597

[recallwei]

这是因为 webpack v5.90.0+ 新增了个 output.environment.asyncFunction 配置，在目标环境不支持 async/await 时，为 asyncModule 添加了警告 详细 PR 可查看 webpack/webpack#17958

目前临时的解决方案如下：

1. 方案一：关闭 prebundler

  /* config/index.ts */
  const config = {
     ...
    compiler: {
      prebundle: {
        enable: false,
      },
      type: 'webpack5'
    },
  }

2. 方案二：默认开启 asyncFunction

  /* config/index.ts */
  const config = {
    h5: {
      output: {
        environment: {
          asyncFunction: false,
        },
       ...
      },
    }
  }

以上是临时的解决方法，问题出在 @tarojs/webpack5-prebundle 没有处理 asyncFunction 的逻辑，会在近期的版本中修复

貌似方法二没有生效

[darkxinyu]

这是因为 webpack v5.90.0+ 新增了个 output.environment.asyncFunction 配置，在目标环境不支持 async/await 时，为 asyncModule 添加了警告 详细 PR 可查看 webpack/webpack#17958
目前临时的解决方案如下：

1. 方案一：关闭 prebundler

  /* config/index.ts */
  const config = {
     ...
    compiler: {
      prebundle: {
        enable: false,
      },
      type: 'webpack5'
    },
  }

2. 方案二：默认开启 asyncFunction

  /* config/index.ts */
  const config = {
    h5: {
      output: {
        environment: {
          asyncFunction: false,
        },
       ...
      },
    }
  }

以上是临时的解决方法，问题出在 @tarojs/webpack5-prebundle 没有处理 asyncFunction 的逻辑，会在近期的版本中修复

貌似方法二没有生效

应设为true

/* config/index.ts */
const config = {
  h5: {
    output: {
      environment: {
        asyncFunction: true,
      },
     ...
    },
  }
}