如何解决在运行cdk部署时无法在模块外使用导入语句的问题

Question

​

​

我有一个项目，是一个类型记录/js混合。它的结构如上文所示。如您所见，bin包含一个创建cdk堆栈的文件。lib文件夹包含一个包含所有cdk代码的文件，该文件创建了所有AWS资源。但是，这个文件夹也包含了很多js文件，这些文件也使用react。这是我在尝试运行cdk deploy时遇到的问题--我得到了错误SyntaxError: Cannot use import statement outside a module，是的，我已经阅读了关于这个错误的每一篇文章，而且在我的ts配置文件中添加"type": "module"并不是那么简单。(我已经尝试过了，并得到了错误TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" for .../bin/aws-cdk-namespace-deployment.ts，它对我大喊大叫的文件就在bin文件夹中。这是一个类型记录文件，绝对应该使用导入。以下是我的tsconfig：

{
  "compilerOptions": {
    "outDir": "./dist/",
    "baseUrl": ".",
    "target": "es2017",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": false,
    "forceConsistentCasingInFileNames": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "react",
    "downlevelIteration": true
  },
  "include": [
    "src/**/*"
  ]
}

这是我的package.json

{
  "name": "aws-cdk-namespace-deployment",
  "version": "0.1.0",
  "bin": {
    "aws-cdk-namespace-deployment": "bin/aws-cdk-namespace-deployment.ts"
  },
  "scripts": {
    "build": "tsc",
    "watch": "tsc -w",
    "test": "jest",
    "cdk": "cdk"
  },
  "devDependencies": {
    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
    "@babel/preset-react": "^7.18.6",
    "@babel/preset-typescript": "^7.18.6",
    "@babel/register": "^7.18.9",
    "@types/aws-lambda": "^8.10.102",
    "@types/jest": "^27.5.2",
    "@types/node": "10.17.27",
    "@types/prettier": "2.6.0",
    "aws-cdk": "^2.39.1",
    "aws-cdk-lib": "^2.50.0",
    "aws-cdk-webpack-lambda-function": "^1.0.0",
    "babel-plugin-styled-components": "^2.0.7",
    "babel-preset-airbnb": "^5.0.0",
    "better-sqlite3": "^7.6.2",
    "dotenv": "^16.0.2",
    "jest": "^27.5.1",
    "knex": "^2.3.0",
    "mock-aws-s3": "^4.0.2",
    "mysql": "^2.18.1",
    "mysql2": "^2.3.3",
    "nock": "^13.2.9",
    "oracledb": "^5.5.0",
    "pg": "^8.8.0",
    "pg-native": "^3.0.1",
    "pg-query-stream": "^4.2.4",
    "prop-types": "^15.8.1",
    "sqlite3": "^5.1.2",
    "tedious": "^15.1.0",
    "ts-jest": "^27.1.4",
    "ts-loader": "^9.4.1",
    "ts-node": "^10.9.1",
    "typescript": "^4.8.4",
    "webpack": "^5.75.0",
    "webpack-cli": "^4.10.0"
  },
  "dependencies": {
    "@aws-sdk/client-s3": "^3.163.0",
    "@aws-sdk/s3-request-presigner": "^3.204.0",
    "aws-sdk": "^2.1209.0",
    "axios": "^1.1.3",
    "babel": "^6.23.0",
    "constructs": "^10.0.0",
    "d3": "^7.6.1",
    "esbuild": "^0.15.12",
    "joi": "^17.6.2",
    "numeral": "^2.0.6",
    "proptypes": "^1.1.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-dom-server": "^0.0.1",
    "s3-zip": "^3.2.1",
    "source-map-support": "^0.5.21",
    "styled-components": "^5.3.6",
    "winston": "^3.8.2"
  },
  "babel": {
    "presets": [
      "@babel/preset-env",
      "@babel/preset-react"
    ],
    "plugins": [
      "babel-plugin-styled-components",
      "@babel/plugin-syntax-dynamic-import"
    ]
  }
}

同样，使用上面所示的应用程序结构，以及上面所示的tsconfig和package.json，当我运行npm run build && cdk deploy时，我会得到错误SyntaxError: Cannot use import statement outside a module --任何建议的帮助都将是非常感谢的。

Answer 1

您需要在处理过程中处理TS文件。下面是我如何使用tsx来完成我的工作

node ./node_modules/.bin/cdk --app='tsx ./src/cdk/myCDKStacks.ts'

如果需要的话，您可以创建一个bin文件--我只是像上面那样直接传递我的堆栈文件。myCDKStack.ts包含我所有堆栈的代码。