使用 nodejs/npm start 在哪里查看 console.log 输出？

Posted 2023-02-21

技术标签:

【中文标题】使用 nodejs/npm start 在哪里查看 console.log 输出？【英文标题】：Where to view console.log output using nodejs/npm start? 【发布时间】：2019-11-23 01:46:59 【问题描述】：

反应/节点/使用 npm start 启动服务器非常新。使用 npm start 启动服务器工作并显示我的反应代码，但我需要做一些调试。但是，我的 console.logs 没有输出到浏览器控制台。之后，我想检查我的终端（我认为这是 node console.log 输出到的地方），但是由于我使用了 npm start，所以我启动应用程序的终端卡在了这个屏幕上：


Compiled successfully!

You can now view my-app in the browser.

  Local:            http://localhost:3000/
  On Your Network:  http://[ip_address_here]:3000/

Note that the development build is not optimized.
To create a production build, use npm run build.

因此，我无法在此屏幕上读取任何控制台输出。我觉得这应该是一个超级基本的修复，我可能只是忽略了一些非常明显的东西，但是有人可以在这里帮助我吗？谢谢。

编辑：我被要求分享一些代码，这里是：

这是我的 App.js 文件的 sn-p：


import React from 'react';

//quick class
class App extends React.Component 
    constructor(props)
        super(props);

        this.state = 
            testRows : null
        

        this.getTest = this.getTest.bind(this);
    

    //get some rows from my api using a local database with sqlite3
    async getTest()
        try
            console.log("hello?");
            const response = await fetch('http://localhost:3000/api/test');
            if(response.ok)
                const JSONresponse = response.json();
                console.log(JSOnresponse);
                this.setState(testRows : JSONresponse);
            
            else
                this.setState(testRows: "test error");
                console.log('There was an error with the fetch');
            
        
        catch(error)
            console.log(error);
        
    

    //render some text, a button, and the result
    render()
        let testResults;
        if(this.state.testRows)
            testResults = Object.keys(this.state.testRows).map((data) => 
                    return <h1>data.name</h1>
                
            )
        
        else
            testResults = "null";
        


        return(
            <div>
                <h2>Some testing going on here</h2>
                <button onClick=this.getTest>
                    Press me for test!
                </button>
                <h3>testResults</h3>
            </div>
        );
    


export default App;

这是我的 api.js 文件的 sn-p：


apiRouter.get('/test', (req, res, next) => 
    db.get('SELECT * FROM Test', (error, rows) => 
        if(error)
            console.log(error);
        
        else
            console.log("got the test");
            console.log(rows);
            res.send(rows);
        
    )
)

路由器已安装，其他所有代码都在代码的其他部分中，但那里的 console.logs 也没有显示在任何地方（开发工具控制台或终端）。

【问题讨论】：

直接从您的客户端代码内部记录将转到 Chrome DevTools 您在反应模块中登录的任何内容都应显示在浏览器开发工具控制台中。给我们看一个例子你能给我们看看代码吗？特别是，在您尝试 console.log 的地方。 apiRouter 是如何定义的？你能在页面上看到 testResults 吗？ 【参考方案1】：

据我了解，您有两段代码在不同的地方运行。为了执行代码，两者都应该被提供。

App.js 文件似乎是应该在浏览器上运行的 React 应用程序（前端）。要查看控制台消息，您应该：

打开终端并服务应用程序：npm start 打开浏览器访问指定的 URL 打开开发者工具（通常是 F12）