"已定义但从未使用过未使用的变量"，已定义但从未使用过未使用的变量

Question

我正在启动一个小型react项目(初学者)，当我将我的'App'组件分成许多小组件时，例如'header'，它不起作用。当我的头被割伤时，这个错误就开始发生了。并且说标题css也不加载。你可以在元素检查器中看到React组件是存在的，但是它不想加载与它相关的css。

// In App.js
import React from 'react';
import header_type from './header';

class App extends React.Component {
render() {
return (
<div className="window">
<div className="window-body">
<header_type/>
<div className='window_inner'>
<div className="column_left">
</div>
<div className="column_right">
</div>
</div>
</div>
</div>

)
}
}
export default App;

// In header.js
class header_type extends React.Component {
render() {
return (
<div className="window-header" >
</div>

)
}
}
export default header_type;

// In index.js
import React from 'react';
import ReactDOM from 'react-dom';
import App from '../src/components/App';
import '../src/style/window.css';
ReactDOM.render(
<App />, document.getElementById('root')
);

// error :
Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.
WARNING in srccomponentsApp.js
Line 2:10:  'header_type' is defined but never used  no-unused-vars
webpack compiled with 1 warning

提前感谢您的回答。祝你过得愉快。

Answer 1

上述代码中存在的一个问题是，您正在从header.js中导出默认组件，并将其导入到App.js中。

在App.js中导入header组件时，将其导入为import header_type from './header';

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export

Answer 2

更改header_type">Header_type";(大写的H)在class header_type extends React.Component行和代码中的其他地方。我猜类名应该以大写字母开头