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

Question

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