无法在azure Web应用程序（节点：进程）中调试“无法在模块外使用导入”

问题描述 投票：0回答：1

在两周的大部分时间里，我一直在苦苦思索，试图理解为什么我的应用程序失败并出现“语法错误：无法在模块外使用 import 语句”

该应用程序通过 GitHub 工作流程部署到 azure，我的 azure 正在运行一个相当基本的 Web 应用程序，并具有基本计划。我之前已经通过管道完全在 azure 中运行了 web 应用程序，但我将管道移至 GitHub，因为它有点太不稳定。

就我而言，错误来自节点：进程，而不是来自我的应用程序内。我在 package.json 中设置了 type: module，我已经查找了此错误的所有可能解决方案并尝试了很多方法，但就我而言，除了在 azure 上之外，我无法在其他任何地方重现此问题。

我无法通过 SSH 连接到 azure，因为容器无法启动。我可以在 Kudu 中重现该错误，但据我了解，kudu 实际上运行了 Web 应用程序。

以下是日志：

2024-12-13T09:43:44.783683029Z    _____                               
2024-12-13T09:43:44.783785035Z   /  _  \ __________ _________   ____  
2024-12-13T09:43:44.783791235Z  /  /_\  \\___   /  |  \_  __ \_/ __ \ 
2024-12-13T09:43:44.783795635Z /    |    \/    /|  |  /|  | \/\  ___/ 
2024-12-13T09:43:44.783799835Z \____|__  /_____ \____/ |__|    \___  >
2024-12-13T09:43:44.783804236Z         \/      \/                  \/ 
2024-12-13T09:43:44.783808136Z A P P   S E R V I C E   O N   L I N U X
2024-12-13T09:43:44.783812036Z 
2024-12-13T09:43:44.783815736Z Documentation: http://aka.ms/webapp-linux
2024-12-13T09:43:44.783819436Z NodeJS quickstart: https://aka.ms/node-qs
2024-12-13T09:43:44.783831037Z NodeJS Version : v18.20.4
2024-12-13T09:43:44.783835237Z Note: Any data outside '/home' is not persisted
2024-12-13T09:43:44.783839137Z 
2024-12-13T09:43:47.987562439Z Starting OpenBSD Secure Shell server: sshd.
2024-12-13T09:43:48.026717967Z WEBSITES_INCLUDE_CLOUD_CERTS is not set to true.
2024-12-13T09:43:48.503316346Z Starting periodic command scheduler: cron.
2024-12-13T09:43:48.688148017Z Could not find build manifest file at '/home/site/wwwroot/oryx-manifest.toml'
2024-12-13T09:43:48.698222439Z Could not find operation ID in manifest. Generating an operation id...
2024-12-13T09:43:48.698247340Z Build Operation ID: 184b065a-852e-400f-bbe3-ba2b61f25a9b
2024-12-13T09:43:49.561858159Z Environment Variables for Application Insight's IPA Codeless Configuration exists..
2024-12-13T09:43:49.572705721Z Writing output script to '/opt/startup/startup.sh'
2024-12-13T09:43:49.663251009Z Running #!/bin/sh
2024-12-13T09:43:49.663277010Z 
2024-12-13T09:43:49.663283111Z # Enter the source directory to make sure the script runs where the user expects
2024-12-13T09:43:49.663288011Z cd "/home/site/wwwroot"
2024-12-13T09:43:49.663292411Z 
2024-12-13T09:43:49.663296612Z export NODE_PATH=/usr/local/lib/node_modules:$NODE_PATH
2024-12-13T09:43:49.663300912Z if [ -z "$PORT" ]; then
2024-12-13T09:43:49.663305412Z      export PORT=8080
2024-12-13T09:43:49.663310012Z fi
2024-12-13T09:43:49.663320913Z 
2024-12-13T09:43:49.663325213Z PATH="$PATH:/home/site/wwwroot" npx serve -s build -l $PORT
2024-12-13T09:43:59.023516457Z npm info using [email protected]
2024-12-13T09:43:59.041844999Z npm info using [email protected]
2024-12-13T09:44:10.540898428Z (node:106) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
2024-12-13T09:44:10.541832675Z (Use `node --trace-warnings ...` to show where the warning was created)
2024-12-13T09:44:10.573331773Z /home/site/wwwroot/node_modules/.bin/serve:4
2024-12-13T09:44:10.573387676Z import { cwd as getPwd, exit, env as env2, stdout } from "node:process";
2024-12-13T09:44:10.573395377Z ^^^^^^
2024-12-13T09:44:10.573400577Z 
2024-12-13T09:44:10.573405377Z SyntaxError: Cannot use import statement outside a module
2024-12-13T09:44:10.573410077Z     at internalCompileFunction (node:internal/vm:76:18)
2024-12-13T09:44:10.573414978Z     at wrapSafe (node:internal/modules/cjs/loader:1283:20)
2024-12-13T09:44:10.573419678Z     at Module._compile (node:internal/modules/cjs/loader:1328:27)
2024-12-13T09:44:10.573424478Z     at Module._extensions..js (node:internal/modules/cjs/loader:1422:10)
2024-12-13T09:44:10.573429078Z     at Module.load (node:internal/modules/cjs/loader:1203:32)
2024-12-13T09:44:10.573433678Z     at Module._load (node:internal/modules/cjs/loader:1019:12)
2024-12-13T09:44:10.573438479Z     at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:128:12)
2024-12-13T09:44:10.573443079Z     at node:internal/main/run_main_module:28:492024-12-13T09:43:44.783683029Z    _____                               
2024-12-13T09:43:44.783785035Z   /  _  \ __________ _________   ____  
2024-12-13T09:43:44.783791235Z  /  /_\  \\___   /  |  \_  __ \_/ __ \ 
2024-12-13T09:43:44.783795635Z /    |    \/    /|  |  /|  | \/\  ___/ 
2024-12-13T09:43:44.783799835Z \____|__  /_____ \____/ |__|    \___  >
2024-12-13T09:43:44.783804236Z         \/      \/                  \/ 
2024-12-13T09:43:44.783808136Z A P P   S E R V I C E   O N   L I N U X
2024-12-13T09:43:44.783812036Z 
2024-12-13T09:43:44.783815736Z Documentation: http://aka.ms/webapp-linux
2024-12-13T09:43:44.783819436Z NodeJS quickstart: https://aka.ms/node-qs
2024-12-13T09:43:44.783831037Z NodeJS Version : v18.20.4
2024-12-13T09:43:44.783835237Z Note: Any data outside '/home' is not persisted
2024-12-13T09:43:44.783839137Z 
2024-12-13T09:43:47.987562439Z Starting OpenBSD Secure Shell server: sshd.
2024-12-13T09:43:48.026717967Z WEBSITES_INCLUDE_CLOUD_CERTS is not set to true.
2024-12-13T09:43:48.503316346Z Starting periodic command scheduler: cron.
2024-12-13T09:43:48.688148017Z Could not find build manifest file at '/home/site/wwwroot/oryx-manifest.toml'
2024-12-13T09:43:48.698222439Z Could not find operation ID in manifest. Generating an operation id...
2024-12-13T09:43:48.698247340Z Build Operation ID: 184b065a-852e-400f-bbe3-ba2b61f25a9b
2024-12-13T09:43:49.561858159Z Environment Variables for Application Insight's IPA Codeless Configuration exists..
2024-12-13T09:43:49.572705721Z Writing output script to '/opt/startup/startup.sh'
2024-12-13T09:43:49.663251009Z Running #!/bin/sh
2024-12-13T09:43:49.663277010Z 
2024-12-13T09:43:49.663283111Z # Enter the source directory to make sure the script runs where the user expects
2024-12-13T09:43:49.663288011Z cd "/home/site/wwwroot"
2024-12-13T09:43:49.663292411Z 
2024-12-13T09:43:49.663296612Z export NODE_PATH=/usr/local/lib/node_modules:$NODE_PATH
2024-12-13T09:43:49.663300912Z if [ -z "$PORT" ]; then
2024-12-13T09:43:49.663305412Z      export PORT=8080
2024-12-13T09:43:49.663310012Z fi
2024-12-13T09:43:49.663320913Z 
2024-12-13T09:43:49.663325213Z PATH="$PATH:/home/site/wwwroot" npx serve -s build -l $PORT
2024-12-13T09:43:59.023516457Z npm info using [email protected]
2024-12-13T09:43:59.041844999Z npm info using [email protected]
2024-12-13T09:44:10.540898428Z (node:106) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
2024-12-13T09:44:10.541832675Z (Use `node --trace-warnings ...` to show where the warning was created)
2024-12-13T09:44:10.573331773Z /home/site/wwwroot/node_modules/.bin/serve:4
2024-12-13T09:44:10.573387676Z import { cwd as getPwd, exit, env as env2, stdout } from "node:process";
2024-12-13T09:44:10.573395377Z ^^^^^^
2024-12-13T09:44:10.573400577Z 
2024-12-13T09:44:10.573405377Z SyntaxError: Cannot use import statement outside a module
2024-12-13T09:44:10.573410077Z     at internalCompileFunction (node:internal/vm:76:18)
2024-12-13T09:44:10.573414978Z     at wrapSafe (node:internal/modules/cjs/loader:1283:20)
2024-12-13T09:44:10.573419678Z     at Module._compile (node:internal/modules/cjs/loader:1328:27)
2024-12-13T09:44:10.573424478Z     at Module._extensions..js (node:internal/modules/cjs/loader:1422:10)
2024-12-13T09:44:10.573429078Z     at Module.load (node:internal/modules/cjs/loader:1203:32)
2024-12-13T09:44:10.573433678Z     at Module._load (node:internal/modules/cjs/loader:1019:12)
2024-12-13T09:44:10.573438479Z     at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:128:12)
2024-12-13T09:44:10.573443079Z     at node:internal/main/run_main_module:28:49

这是我的package.json：

{
  "name": "kulmasohva_3",
  "version": "0.1.0",
  "type": "module",
  "private": true,
  "dependencies": {
    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
    "@babel/plugin-transform-private-property-in-object": "^7.25.9",
    "@babel/preset-react": "^7.25.9",
    "@babel/preset-typescript": "^7.26.0",
    "@emotion/react": "^11.13.0",
    "@emotion/styled": "^11.13.0",
    "@eslint/js": "^9.15.0",
    "@jest/types": "^29.6.3",
    "@mdi/js": "^7.4.47",
    "@mdi/react": "^1.6.1",
    "@mui/icons-material": "^5.16.5",
    "@mui/material": "^5.16.5",
    "@mui/x-date-pickers": "^7.12.0",
    "@testing-library/jest-dom": "^5.17.0",
    "@testing-library/react": "^16.1.0",
    "@types/js-cookie": "^3.0.6",
    "@types/lscache": "^1.3.4",
    "@types/node": "^16.18.59",
    "@types/react": "^18.2.29",
    "@types/react-dom": "^18.2.13",
    "@types/react-lazyload": "^3.2.3",
    "@types/react-router-dom": "^5.3.3",
    "@types/uuid": "^10.0.0",
    "axios": "^1.6.0",
    "babel-jest": "^29.7.0",
    "bootstrap": "^5.3.2",
    "browser-image-compression": "^2.0.2",
    "dayjs": "^1.11.12",
    "eslint-config-react-app": "^7.0.1",
    "eslint-plugin-react": "^7.37.2",
    "formik": "^2.4.5",
    "globals": "^15.12.0",
    "jest": "^29.7.0",
    "jest-environment-jsdom": "^29.7.0",
    "js-cookie": "^3.0.5",
    "lscache": "^1.3.2",
    "material-icons": "^1.13.12",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-dropzone": "^14.2.3",
    "react-intl": "^6.6.8",
    "react-lazyload": "^3.2.1",
    "react-router-dom": "^6.18.0",
    "react-scripts": "5.0.1",
    "react-toastify": "^10.0.5",
    "serve": "^14.2.4",
    "ts-node": "^10.9.2",
    "typescript": "^4.9.5",
    "uuid": "^10.0.0",
    "web-vitals": "^2.1.4",
    "yup": "^1.3.2"
  },
  "scripts": {
    "start": "react-scripts start",
    "serve": "serve -s build -p 3000",
    "build": "react-scripts build",
    "test": "NODE_ENV=test jest --watchAll=false"
  },
  "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"
    ]
  },
  "overrides": {
    "eslint": "8.51.0"
  }
}

ts配置：

{
  "compilerOptions": {
    "target": "ES6",
    "lib": [
      "dom",
      "dom.iterable",
      "ESNext"
    ],
    "types": [
      "node"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "ESNext",
    "moduleResolution":"node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx"
  },
  "include": [
    "src",
    "wwwroot/js/**/*.ts",
    "wwwroot/js/**/*.tsx"
  ]
}

我不确定此时我还能做什么，非常感谢这里的任何建议。

reactjs node.js typescript azure kudu
1个回答
0
投票

项目中的 

serve
包会出现此问题。要解决此错误，请使用 ES 模块（通过在 
"type": "module"
中添加 
package.json
）。

error

请参阅此指南以部署 React 应用程序。

请按照以下步骤解决此问题：

使用以下代码在项目的根目录下创建一个 

server.js
文件：

import express from  "express";
...
import path from  "path";
import { fileURLToPath } from  "url";
const  __filename = fileURLToPath(import.meta.url);
const  __dirname = path.dirname(__filename);
const  app = express();
const  PORT = process.env.PORT || 8080;
app.use(express.static(path.join(__dirname, "build")));
app.get("*", (req, res) => {
res.sendFile(path.join(__dirname, "build", "index.html"));

});
app.listen(PORT, () => {
console.log(`Server is running on port ${PORT}`);
});

使用 

npm run build
构建 React 应用程序。然后，安装并使用 
serve
进行快速设置：

npm install -g serve
serve -s build

更新

package.json
：

"scripts": {
  "start": "node server.js",
  "build": "react-scripts build"
}

在您的 

.engines
 中添加
package.json

字段 
"engines": {
  "node": "18.x"
}

确保 

"type": "module"
存在于您的 
package.json
中，并且所有使用 
import/export
的 JavaScript 文件都具有 
.js
或 
.mjs
扩展名。

更改

index.js
文件：

import App from  './App.js';
import reportWebVitals from  './reportWebVitals.js';

然后将您的应用程序部署到 Azure Web。

输出： Kudo

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.