在 VSCode 或 Chrome 中使用 Typescript 创建 React App 来调试测试

Question

使用创建的应用程序 (https://github.com/Microsoft/TypeScript-React-Starter)

npm install -g create-react-app

create-react-app my-app --scripts-version=react-scripts-ts

我浏览了很多文章，似乎在兜圈子，但还没有找到如何调试默认的 app.test.tsx

Node 版本为 7.9.0 其他一切都应该是最新版本。

Answer 1

此问题现已修复。 https://github.com/Microsoft/TypeScript-React-Starter/issues/46

1. 安装节点 v8.5

2. 更新到最新版本的 Create-React-App （或将 react-scripts-ts 更新到 2.7）

3. 使用

配置 vscode 调试器

    {
        "version": "0.2.0",
        "configurations": [
          {
            "name": "Debug CRA Tests",
            "type": "node",
            "request": "launch",
            "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/react-scripts-ts",
            "runtimeArgs": [
              "--inspect-brk",
              "test"
            ],
            "args": [
              "--runInBand",
              "--no-cache",
              "--env=jsdom"
            ],
            "cwd": "${workspaceRoot}",
            "protocol": "inspector",
            "console": "integratedTerminal",
            "internalConsoleOptions": "neverOpen"
          }
        ]
      }

<!-- begin snippet: js hide: false console: true babel: false -->

4. 如果您使用的是 typescript 2.5，请将其添加到您的项目中 https://github.com/nicolaserny/create-react-app-typescript/blob/master/packages/react-scripts/template/tsconfig.test.json