我已经四处寻找解决这个问题的办法了。他们都建议在你的tsconfig中添加"jsx": "react"。json文件。我已经做到了。另一个是添加“include:[]”,我也这样做过。然而,当我试图编辑.tsxfiles时,我仍然得到错误。下面是我的tsconfig文件。
{
"compilerOptions": {
"module": "commonjs",
"target": "es5",
"allowJs": true,
"checkJs": false,
"jsx": "react",
"outDir": "./build",
"rootDir": "./lib",
"removeComments": true,
"noEmit": true,
"pretty": true,
"skipLibCheck": true,
"strict": true,
"moduleResolution": "node",
"esModuleInterop": true
},
"include": [
"./lib/**/*"
],
"exclude": [
"node_modules"
]
}
任何建议都会很有帮助。我使用babel 7编译所有的代码与env, react和typescript预设。如果你们需要更多的文件来帮助调试,请告诉我。
这个链接有助于解决这个问题:
https://staxmanade.com/2015/08/playing-with-typescript-and-jsx/
参考章节:
修复错误TS17004:除非提供了'——JSX '标志,否则不能使用JSX。
下一个错误对我来说是新的,但它有一定的意义,所以我将——jsx标志添加到tsc,并尝试tsc——jsx helloWorld。tsx,但看起来我错过了一个参数——jsx。
tsc—jsx helloWorld.tsx
'——jsx'的参数必须是'preserve'或'react'。
在当前的TypeScript 1.6迭代中,——jsx似乎有两个选项,分别是preserve或react。
Preserve将在输出中保留JSX。我认为这是为了让您可以使用JSX之类的工具来实际提供翻译。
react将删除jsx语法,并将其转换为纯javascript,因此在TSX文件中将成为react。createElement (" div ", null)。
通过传递react选项,这里是我们结束的地方:
tsc—jsx react helloWorld.tsx
tsx(11,14):错误TS2607: JSX元素类不支持属性,因为它没有“props”属性
helloWorld.tsx(11,44):错误TS2304:无法找到名称“mountNode”。
接下来我将处理最后一个错误,因为最初我不理解上面的JSX错误。
在我的例子中,问题是VSCode生成了一个空的tsconfig。Json文件,当然,它什么也没做。
我把这个添加到tsconfig。json from Typescript的React Page:
{
"compilerOptions": {
"outDir": "./dist/",
"sourceMap": true,
"noImplicitAny": true,
"module": "commonjs",
"target": "es6",
"jsx": "react"
}
}
...然后点击保存,VSCode从那里取出它。
编辑:
自从我最初发布这个答案以来,通用的tsconfig文件已经变得更广泛地可用。如果你想了解这些选项,我已经发布了一个更详细的版本作为主旨。
我必须把我的整个应用程序添加到include中。
我的tsconfig。Json是这样的:
{
"compilerOptions": {
"module": "commonjs",
"declaration": true,
"removeComments": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"allowSyntheticDefaultImports": true,
"target": "es6",
"sourceMap": true,
"outDir": "./dist",
"baseUrl": "./",
"incremental": true,
"jsx": "react",
"allowJs": true
},
"include": ["./"]
}