Typescript模块没有导出的成员-react
Typescript module has no exported members - react
我正在开发一个react、redux Typescript应用程序。我有一个奇怪的情况,在一些更改后,其中一个模块停止导出其成员。
文件夹结构为:
src
|---- components
|---- containers
"components"文件夹包含.tsx文件,而包装.ts文件位于"containers"文件夹中。
NodeList.tsx模块如下所示:
import * as React from "react";
export const NodeList = (props) => (
<div id="NodeList">
<ul>
{props.items.map((item, i) => (
<li key={i} >
<span id={"Item_"+i}>{item}</span>
</li>
)
)}
</ul>
</div>
)
包装容器NodeListContainer是:
import { connect } from "react-redux";
import { Provider } from "react-redux";
import { Nodelist } from "../components/NodeList"
const nodesAsArrayOfType = (state, nodeType: string) => {
console.log("Going for nodes of type ", nodeType)
let a = state.data.model.nodes
let k = Object.keys(a);
let sub = k.filter((e) => {
return a[e].nodeType == nodeType
}).map((e) => a[e])
console.log("Got nodes ", sub)
return sub
}
const mapStateToProps = (state) => {
var list = nodesAsArrayOfType(state, state.UIstate.focusNodeType).map((e) => {return JSON.stringify(e)})
console.log("Returning ", list, list.length)
return {
items: list
}
}
const mapDispatchToProps = (dispatch) => {
return {
newTextValue: (e) => {dispatch({type: "ON_CHANGE", text: e.target.value})}
}
}
export const NodeListContainer = connect(
mapStateToProps,
mapDispatchToProps
)(NodeList)
上面NodeList的导入被标记为错误消息
ERROR in ./src/containers/NodeListContainer.ts
(4,10): error TS2305: Module '"MyProject/src/components/NodeList"' has no exported member 'Nodelist'.
有人能对这里可能发生的事情提供任何见解吗?
如果修复了拼写错误,代码应该可以工作。
代替
import { Nodelist } from "../components/NodeList"
你应该写:
import { NodeList } from "../components/NodeList"
// ^ capital L
如果有人仍然有这个问题,我发现我只从文件中导出了一个项目,所以正在更改
export default function App() {
...
};
至
export function App() {
...
}
似乎成功了!
另一件需要检查的事情是不明确/相似的文件名。
如果同一个包中有两个文件的名称仅因扩展名不同,也可能发生这种情况。例如,如果你有
folder
foo.tsx
foo.ts
当您进行以下导入时:
import { Something } from "./foo";
它只能处理其中一个文件中的项目。
这种情况下的解决方案是重命名其中一个文件以消除歧义。那么进口产品就会很好用。
避免在类似的项目范围/文件夹中使用两个不同的文件扩展名,如"js"answers"txs",否则会导致此类类型错误。
相关文章:
- React重新渲染但未显示正确的组件
- React组件等待所需道具进行渲染
- React中的数据集表示
- Webpack开发服务器和React服务器端渲染
- React Redux错误页面管理
- react.js中的密钥绑定
- 如何在react js中将值从一个组件发送到另一个组件
- React Native通过Navigator将用户输入数据传递到选项卡栏IOS中的组件
- React:按键的性能提升
- 如何在react js中从一个页面导航到另一个页面
- React组件-设置页面标题
- 为react组件传递道具的最佳方式
- 如何使用带有Preact的React路由器
- 使用Jest测试React Native应用程序
- 为什么我的点击事件没有使用 react js 触发
- React 15使用空字符串删除输入值
- react组件中的绑定方法
- 是否存在React Native“;WEB代码安全防护”;
- Typescript模块没有导出的成员-react
- 用成员函数扩展React.js存储数据结构