导入不适用于tsconfig.json中的“模块”："ESNEXT“

Question

服务器端有以下代码：

import * as express from "express";

export class AppRouter {
  private static instance: express.Router;

  static getInstance(): express.Router {
    if (!AppRouter.instance) {
      AppRouter.instance = express.Router();
    }

    return AppRouter.instance;
  }
}

VSCODE编译器不会在上述代码上显示任何错误。但是，当我运行它时，它会显示以下错误：

import * as express from "express";
^^^^^^

SyntaxError: Cannot use import statement outside a module

当模块在tsconfig.json中被设置为tsconfig.json时，它工作得很好。

但出于某种原因，我需要使用ESNEXT进行模块设置。

这是我的tsconfig.json：

{
  "compilerOptions": {
    "target": "ESNEXT",
    "module": "ESNEXT",
    "allowJs": true,
    "jsx": "react",
    "sourceMap": true,
    "outDir": "dist",
    "moduleResolution": "node",
    "esModuleInterop": true,
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true
  },
  "include": [
    "src/**/*.ts", "src/**/*.tsx"
  ],
  "exclude": [
    "node_modules",
    ".vscode"
  ]
}

我该怎么解决这个问题？

增加？

package.json:

{
  "name": "APP",
  "version": "1.0.0",
  "main": "index.js",
  "type": "module",
  "scripts": {
    "dev": "NODE_ENV=development nodemon",
    "prod": "NODE_ENV=production ts-node ./src/server/main.ts"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@types/react": "16.8.19",
    "@types/react-dom": "16.8.4",
    "@types/react-redux": "^7.0.9",
    "@types/react-router-dom": "^5.1.3",
    "@types/react-router": "^5.1.3",
    "@types/webpack-env": "^1.14.1",
    "@types/body-parser": "^1.17.0",
    "@types/express": "^4.16.1",
    "@types/node": "^12.12.21",
    "babel-core": "^6.26.3",
    "babel-preset-stage-2": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-env": "^1.7.0",
    "babel-loader": "^7.1.4",
    "babel-plugin-universal-import": "^4.0.0",
    "babel-plugin-transform-async-to-promises": "^0.6.1",
    "babel-plugin-syntax-dynamic-import": "^6.18.0",
    "babel-plugin-async-to-promises": "^1.0.5",
    "react": "^16.3.2",
    "react-dom": "^16.3.2",
    "react-redux": "^7.0.3",
    "react-router": "^5.0.1",
    "react-router-dom": "^5.0.1",
    "react-universal-component": "^4.0.0",
    "redux": "^4.0.1",
    "redux-thunk": "^2.3.0",
    "serialize-javascript": "^2.1.0",
    "history": "^4.10.1",
    "redux-form": "^8.2.6",
    "react-helmet": "^5.2.1",
    "url-loader": "^1.0.1",
    "markdown-with-front-matter-loader": "^0.1.0",
    "iltorb": "^2.3.2",
    "front-matter-loader": "^0.2.0",
    "file-loader": "^1.1.11",
    "css-loader": "^0.28.11",
    "compression-webpack-plugin": "^1.1.11",
    "brotli-webpack-plugin": "^1.0.0",
    "html-webpack-plugin": "^3.2.0",
    "optimize-css-assets-webpack-plugin": "^4.0.1",
    "uglifyjs-webpack-plugin": "^1.2.5",
    "cors": "^2.7.1",
    "react-hot-loader": "^4.1.2",
    "extract-css-chunks-webpack-plugin": "^3.0.6",
    "webpack-hot-server-middleware": "^0.5.0",
    "express-static-gzip": "^0.3.2",
    "ts-loader": "^4.0.0",
    "webpack-flush-chunks": "^3.0.0-alpha.4",
    "webpack-hot-middleware": "^2.22.1",
    "webpack": "^4.8.3",
    "webpack-bundle-analyzer": "^2.11.1",
    "typescript": "^3.7.4",
    "webpack-dev-middleware": "^3.7.2",
    "ts-node": "^8.5.4",
    "express": "^4.17.1",
    "nodemon": "^1.19.4",
    "body-parser": "^1.19.0",
    "axios": "^0.16.2",
    "js-cookie": "^2.2.0",
    "react-scroll": "^1.7.14",
    "react-animate-on-scroll": "^2.1.5",
    "react-iframe": "^1.8.0",
    "react-fade-in": "^0.1.6",
    "react-loading": "^2.0.3",
    "rodal": "^1.6.3",
    "react-lottie": "^1.2.3",
    "react-google-login": "^5.0.2",
    "moment": "^2.24.0",
    "cross-fetch": "^2.1.1",
    "yaml-front-matter": "^4.0.0",
    "marked": "^0.3.19",
    "@types/cookie-session": "^2.0.37",
    "concurrently": "^4.1.0",
    "cookie-session": "^1.3.3",
    "reflect-metadata": "^0.1.13"
  },
  "devDependencies": {
    "babel-plugin-transform-object-rest-spread": "^6.26.0",
    "babel-plugin-transform-regenerator": "^6.26.0"
  }
}

nodemon.json:

{
    "watch": [
        "src",
        "config"
    ],
    "ext": "ts tsx js",
    "exec": "ts-node ./src/server/main.ts"
}

Answer 1

在本例中，错误显示是因为正在使用的ts-node版本不支持ES模块语法，正如正在讨论的这里。我从那张票上发现ts-node v8.10.0提供了实验支撑，所以更新它可能会使它工作起来。我不知道任何其他解决方案，但是您应该能够通过将.ts编译成.js来运行文件，并使用node而不是ts-node来运行它们。让我知道，否则，我很高兴再深入一点。

Answer 2

这对我有用。试着跑

ts-node --transpile-only --script-mode file_name.ts