'已定义但从未使用 no-unused-vars'，已定义但从未使用 no-unused-vars

Question

我正在启动一个小型反应项目（初学者），当我将“应用程序”组件切割成许多小组件（例如“标题”）时，它不起作用。当我剪切标题时，错误就开始发生。并且说 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 src\components\App.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 中导入标头组件时将其导入为

import header_type from './header';

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

Answer 2

在

import header_type from './header';

header_type 应替换为“Header_type”（大写的 H）。 我猜类名应该以大写字母开头 ，这对我有用。