我得到以下信息,但我不知道为什么:无法读取未定义的属性“ B”
我有一个包含两个React组件A和B的模块。它们正在使用babel进行编译。 index.js
导出A和B。A从index.js
导入B。
这是模块结构:
.
├── lib
│ ├── component
│ │ ├── A
│ │ │ ├── A.js
│ │ │ └── index.js
│ │ ├── B
│ │ │ ├── B.js
│ │ │ └── index.js
│ │ └── index.js
│ └── index.js
├── package.json
├── src
│ └── component
│ ├── A
│ │ ├── A.js
│ │ └── index.js
│ ├── B
│ │ ├── B.js
│ │ └── index.js
│ └── index.js
└── yarn.lock
这里是A:
import React, { Component } from "react"
import { B } from "../"
class A extends Component {
render () {
return (
<div>A with <B /></div>
)
}
}
export default A
这里是根index.js
import { A } from "./A"
import { B } from "./B"
export {
A,
B
}
这是babelrc:
{
"presets": [
"@babel/env",
"@babel/react"
],
"plugins": [
"transform-class-properties",
"transform-react-constant-elements"
]
}
如果将A
导入语句更改为以下内容,它将起作用:
import React, { Component } from "react"
import { B } from "../B"
从我的next.js应用程序中,我从索引文件中导入A
组件,同时显示错误。
使用:
"next": "^6.1.1",
"react": "^16.4.2",
"react-dom": "^16.4.1",
"@babel/cli": "^7.0.0-beta.56",
"@babel/core": "^7.0.0-beta.56",
"@babel/preset-env": "^7.0.0-beta.56",
"@babel/preset-react": "^7.0.0-beta.56",
"babel-plugin-styled-components": "^1.5.1",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-react-constant-elements": "^6.23.0"
如果我直接使用下一个的A组件并跳过babel转译,错误消息就会消失。任何帮助将不胜感激。