Question

我正在开始一个新的react redux项目，并且正在考虑再次使用打字稿。我试过的最后一个版本是1.6，但是那时打字稿真的发展了。

我制作了一个小型PoC，我喜欢javascript中静态输入的想法，但它确实让我觉得我必须始终处理丢失或损坏的类型定义。最新的例子是材料-ui中的破碎类型定义。感觉就像我必须对抗编译器，而不是帮助我。

所以我的想法是使用es6和babel以及像流一样的可选方式添加typescript。我读到打字稿2.3能够通过@ ts-check评论来实现这一点。

那么它如何协同工作？我是否需要一些babel插件来摆脱我的.js文件中的类型定义，或者我是否必须使用.ts .tsx扩展名？

或者这是完全废话，我必须采用“完整打字稿”模式并且必须习惯吗？

说实话，我有点失落。

更新

Babel将支持下一版本7.0的打字稿。测试版已经开始测试了。据我所知，你现在可以使用babel作为转换器并添加babel-preset-typescript。然后，您可以在监视模式下使用typescript或仅使用VS Code错误报告。我想这将是我在不久的将来最喜欢的堆栈。

Answer 1

如果您安装了材料-ui @ next，它有自己的类型，您不需要安装@ types / material-ui。如果你这样做，他们会发生冲突，造成大量错误。然而@next目前beta.9当然正在积极开发中，并且出现了许多打字问题。我自己和其他人正在迅速在每个版本上发布问题，以确保该项目的类型是稳健的。

目前，如果您使用beta.8，我没有任何打字问题。此外，如果你使用打字稿，你不需要巴贝尔。 Typescript编译器将您的项目构建为您想要的任何规范。

一旦弄清楚它们是如何构建的，

Typescript很容易。在那之后，剩下的很简单。

对我来说，我使用.ts / .tsx扩展名和本地安装的Typescript。这是我的Tsconfig示例

{
    "extends": "./config/base.json",
    "compilerOptions": {
        "experimentalDecorators": true,
        "lib": [
            "es6",
            "dom",
            "es2015",
            "es2017"
        ],
        "typeRoots": [
            "node_modules/@types",
            "node_modules"
        ],
        "types": [
            "node", "jest", "lodash", "react",
            "react-dom", "react-redux", "redux-logger", "material-ui",
            "react-router-dom", "react-router-redux", "react-autosuggest",
            "redux", "binary-type-tree", "redux-form",
            "tedb", "react-tap-event-plugin", "redux-thunk",
            "react-hot-loader", "history", "material-ui-icons"
        ],
        "outDir": "dist"
    },
    "include": [
        "src",
        "node_modules/**/*.d.ts",
        "node_modules/@types/**/*.d.ts"
    ],
    "exclude": [
        "node_modules",
        "dist",
        "spec",
        "webpack"
    ]
}

和基地

{
  "compileOnSave": false,
  "compilerOptions": {
    "experimentalDecorators": true,
    "allowSyntheticDefaultImports": true,
    "target": "es2015",
    "module": "es2015",
    "moduleResolution": "node",
    "strict": true,
    "pretty": true,
    "jsx": "react",
    "sourceMap": true,
    "importHelpers": true,
    "removeComments": false,
    "noImplicitThis": true,
    "noImplicitAny": true,
    "noEmitOnError": true,
    "strictNullChecks": true
  }
}

我的某些类型需要在"types"中列出，我不确定是否仍然如此，但要求列出所有类型的类型。我希望这会有所帮助。 package.json "main"会指向"dist/index.js" "build": "rm -rf ./dist/* && tsc"和"types": "dist/index.d.ts"

的版本

这只是我的设置。但我希望它有助于找出一些问题。

我可以使用诸如flow之类的打字稿吗？

1 个答案: