【问题标题】:React - "The target environment doesn't support dynamic import() syntax so it's not possible to use external type 'module' within a script"while buildReact - \"目标环境不支持动态 import() 语法,因此不可能在脚本中使用外部类型 \'module\'\"同时构建
【发布时间】:2022-09-29 12:18:20
【问题描述】:

我正在尝试运行 \"npm run build\",早期版本的项目一切正常,但随后开始出现错误。

    > react-scripts build
    
    Creating an optimized production build...
    Failed to compile.
    
    The target environment doesn\'t support dynamic import() syntax so it\'s not possible to use external type \'module\' within a script
    
    
    npm ERR! errno 1
    npm ERR! Exit status 1
    npm ERR!
    npm ERR! Failed at the crmreactclean@0.1.0 build script.
    npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
    
    npm ERR! A complete log of this run can be found in:
    npm ERR!     C:\\Users\\fatih\\AppData\\Roaming\\npm-cache\\_logs\\2022-06-06T15_30_41_501Z-debug.log

调试日志:

...

    10 silly lifecycle crmreactclean@0.1.0~build: Args: [ \'/d /s /c\', \'react-scripts build\' ]
    11 silly lifecycle crmreactclean@0.1.0~build: Returned: code: 1  signal: null
    12 info lifecycle crmreactclean@0.1.0~build: Failed to exec build script
    13 verbose stack Error: crmreactclean@0.1.0 build: `react-scripts build`
    13 verbose stack Exit status 1
    13 verbose stack     at EventEmitter.<anonymous> (C:\\Program Files\\nodejs\\node_modules\\npm\\node_modules\\npm-lifecycle\\index.js:332:16)
    13 verbose stack     at EventEmitter.emit (events.js:375:28)
    13 verbose stack     at ChildProcess.<anonymous> (C:\\Program Files\\nodejs\\node_modules\\npm\\node_modules\\npm-lifecycle\\lib\\spawn.js:55:14)
    13 verbose stack     at ChildProcess.emit (events.js:375:28)
    13 verbose stack     at maybeClose (internal/child_process.js:1055:16)
    13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:288:5)
    14 verbose pkgid crmreactclean@0.1.0
    15 verbose cwd C:\\Users\\fatih\\Desktop\\temiz build\\crmreactclean
    16 verbose Windows_NT 10.0.19044
    17 verbose argv \"C:\\\\Program Files\\\\nodejs\\\\node.exe\" \"C:\\\\Program Files\\\\nodejs\\\\node_modules\\\\npm\\\\bin\\\\npm-cli.js\" \"run\" \"build\"
    18 verbose node v14.17.3
    19 verbose npm  v6.14.13
    20 error code ELIFECYCLE
    21 error errno 1
    22 error crmreactclean@0.1.0 build: `react-scripts build`
    22 error Exit status 1
    23 error Failed at the crmreactclean@0.1.0 build script.
    23 error This is probably not a problem with npm. There is likely additional logging output above.
    24 verbose exit [ 1, true ] ...```

和 package.json

```{
  \"name\": \"crmreactclean\",
  \"version\": \"0.1.0\",
  \"private\": true,
  \"dependencies\": {
    \"@testing-library/jest-dom\": \"^5.16.4\",
    \"@testing-library/react\": \"^13.2.0\",
    \"@testing-library/user-event\": \"^13.5.0\",
    \"antd\": \"^4.20.5\",
    \"bootstrap\": \"^5.1.3\",
    \"bson-objectid\": \"^2.0.3\",
    \"d3\": \"^7.4.4\",
    \"jquery\": \"^3.6.0\",
    \"react-dom\": \"^18.1.0\",
    \"react-icons\": \"^4.3.1\",
    \"react-pro-sidebar\": \"^0.7.1\",
    \"react-scripts\": \"5.0.1\",
    \"sass\": \"^1.51.0\",
    \"typescript\": \"^4.6.4\",
    \"web-vitals\": \"^2.1.4\"
  },
  \"scripts\": {
    \"start\": \"react-scripts start\",
    \"build\": \"react-scripts build\",
    \"test\": \"react-scripts test\",
    \"eject\": \"react-scripts eject\"
  },
  \"eslintConfig\": {
    \"extends\": [
      \"react-app\",
      \"react-app/jest\"
    ]
  },
  \"browserslist\": {
    \"production\": [
      \">0.2%\",
      \"not dead\",
      \"not op_mini all\"
    ],
    \"development\": [
      \"last 1 chrome version\",
      \"last 1 firefox version\",
      \"last 1 safari version\"
    ]
  },
  \"devDependencies\": {
    \"ajv\": \"^6.12.6\",
    \"autoprefixer\": \"^10.4.7\",
    \"postcss\": \"^8.4.14\",
    \"react\": \"^18.1.0\",
    \"react-router-dom\": \"^6.3.0\",
    \"react-slidedown\": \"^2.4.7\",
    \"tailwindcss\": \"^3.0.24\"
  }
}```

到目前为止我已经尝试过了;

  1. 在整个文件夹(包括 node_modules)中查找动态导入,但没有。它可能是由于依赖引起的
  2. 在另一台计算机上构建它。
  3. 拥有一个干净的项目并一一移动文件夹和依赖项。

    我相信顺风导致了这种情况,因为它尚未在我上次提交时安装,但我现在很困惑。

    标签: node.js reactjs npm


    【解决方案1】:

    你能跑npm start吗?如果可以的话,我建议修改package.json 文件中的browserslist 并尝试再次构建:

    "browserslist": {
        "production": [
          "defaults and supports es6-module"
        ],
        "development": [
          "last 1 chrome version",
          "last 1 firefox version",
          "last 1 safari version"
        ]
      }
    

    当我尝试从项目中的 CDN 链接导入时遇到了同样的问题。 npm run 运行良好 npm run build 抛出异常。事实证明,这不是 Webpack 的错(见这个issue);正如异常指出构建目标环境不支持import()一样。所以如果你不介意失去一些(也许是微不足道的)浏览器兼容性,你可以试试这个。

    【讨论】:

      猜你喜欢
      • 2022-11-22
      • 2021-09-17
      • 2022-06-19
      • 2021-12-03
      • 2011-02-28
      • 1970-01-01
      • 2022-11-11
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多