如何解决 NodeJS 中的这个 no-unused-vars 错误？

Posted 2023-02-21

【中文标题】如何解决 NodeJS 中的这个 no-unused-vars 错误？

【英文标题】：how to solve this no-unused-vars error in NodeJS?

【发布时间】：2021-03-21 03:54:27

【问题描述】：

我正在使用 MERN 堆栈创建一个 todo 应用程序。我是 MERN 堆栈技术的新手，我需要您的帮助来解决这个错误。我已经为我的 app.js 文件和 todo.js 文件提供了代码。我可以' t 在互联网上的任何地方清楚地找到此错误的解决方案。 使用 npm start 命令运行节点 js 应用程序时出现此错误。

Compiled with warnings.

src\App.js
  Line 4:8:  'Todo' is defined but never used  no-unused-vars

Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.

App.js

import React from 'react';
import logo from './logo.svg';
import './App.css';
import Todo from './components/Todo.js';

function App() 
  return (
    <div className="App">
      <header className="App-header">
        <img src=logo className="App-logo"  />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <a
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          Learn React
        </a>
      </header>
    </div>
  );


export default App;

Todo.js

import React,  Component  from 'react'
import axios from 'axios';

 // eslint-disable-next-line

export class Todo extends Component 
    constructor(props) 
        super(props)
    
        this.state = 
             todos : [],
             item : ""
        
    

    changeHandler = (event) => 
        this.setState(item: event.target.value)
    

    clickHandler = (event) => 
        event.preventDefault()
        console.log(this.state.item)
        axios(
            method: 'post',
            url: 'http://localhost:3000/',
            data: 
              todo: this.state.item,
            
          );
        this.setState(item:'')
    

    componentDidMount() 
        axios.get('http://localhost:3000/').then((response) => 
            console.log(response.data.data)
            let data = [];
            console.log(response.data.data.length)
            for(var i =0; i < response.data.data.length; i++)
                data.push(response.data.data[i].todo)
            
            this.setState(todos: data)
        );
    
    componentDidUpdate() 
        axios.get('http://localhost:3000/').then((response) => 
            console.log(response.data.data)
            let data = [];
            console.log(response.data.data.length)
            for(var i =0; i < response.data.data.length; i++)
                data.push(response.data.data[i].todo)
            
            this.setState(todos: data)
        );
    
  
    render() 
        
        return (
            <div>
                <input type="text" onChange=this.changeHandler/>
                <button type="submit" onClick=this.clickHandler>add</button>
                <div>
                    <ul>this.state.todos.map((todo, index) => <li key=index>todo</li>)</ul>
                </div>
            </div>
        )
    


export default Todo

【参考方案1】：

您收到该警告是因为即使您在 App.js 文件中导入 Todo 文件，但您没有在任何地方使用它。尝试在 App.js 中使用它或删除导入（以防万一需要它）。那应该可以解决警告。 或者在 App.js 中的 import Todo.. 语句之前添加// eslint-disable-next-line

【讨论】：

我按照一篇文章制作了这个应用程序，也许我错过了一些东西，因为它们包含了 Todo 文件。所以不要说是什么导致了这个问题。请进一步指导我。

您是否尝试删除导入？只需尝试一次。看看你会得到什么。

它不见了，但问题是我没有得到待办事项列表应用程序输出

@VihangKale 尝试在 App.js 中的 import Todo 语句之前添加 // eslint-disable-next-line 。除此之外，一旦您在 App.js 代码中使用 Todo 文件，它将消失。您可能还会发现 ***.com/questions/42541559/… 有帮助

@VihangKale 看看你是否没有使用导入，那么无论如何保留它是没有意义的，通过使用导入你将摆脱警告。