首页 > 解决方案 > 在新的反应项目中运行 npm start 命令时出现控制台错误

问题描述

我希望您帮我修复我遇到的一个错误,即每次我创建一个新项目以对命令做出反应,npx create-react-app app-name然后是一个 cd 到目录和一个npm start,我说一切都是正确的:编译成功!

You can now view cacas in the browser.

  Local:            http://localhost:3000
  On Your Network:  http://172.27.248.214:3000

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

在此处输入图像描述

然后我去浏览器,我给 f12 启动检查器,我遇到了以下错误:

第一个错误

Error handling response: SyntaxError: Unexpected token u in JSON at position 0
    at JSON.parse (<anonymous>)
    at chrome-extension://bmjmipppabdlpjccanalncobmbacckjn/js/content/content.js:60:21

根据错误是在这一行

data = JSON.parse(data.cs_template);

显示完整代码

document.addEventListener('DOMContentLoaded', function () {

    for (var i = 0; i < blacklist.length; i++) {
        if (location.href.search(blacklist[i]) > 0)
            return;
    }

    cStyle = document.createElement('style');
    cStyle.id = 'cs_cursor_css_no_hd';
    document.head.appendChild(cStyle);

    if (!document.getElementById('elem_ext')) {
        elem_ext = document.createElement('div');
        elem_ext.id = 'elem_ext';
        elem_ext.style.display = 'none';
        document.documentElement.appendChild(elem_ext);
    }

    chrome.storage.local.get('storage_data', function (data) {
        if (localStorage.hasOwnProperty('storage_data'))
            localStorage.removeItem('storage_data');
        localStorage.setItem('storage_data', data.storage_data);
        document.documentElement.dataset.csCursorMode = hd_mode;
        insert_cs_script();
    })


    chrome.storage.local.get('cs_template', function (data) {
        data = JSON.parse(data.cs_template);
        js = document.createElement('script');
        js.id = 'cs_cursor_template';
        js.innerHTML = data.template;
        document.head.appendChild(js);
    });



})

显示我上面已经写过的 图像在此处输入图像描述

第二个错误

Uncaught SyntaxError: Unexpected token u in JSON at position 0
    at JSON.parse (<anonymous>)
    at main.js:97

错误将我发送到这部分代码

var storage_data = (localStorage.hasOwnProperty('storage_data')) ? JSON.parse(localStorage.getItem('storage_data')) : {};

在此处输入图像描述

第三个错误

Uncaught ReferenceError: showCsCursorNonHD is not defined
    at <anonymous>:1:35

第三个错误告诉我这个

 cs_hd_mode = false;               showCsCursorNonHD();               hideCsCursor();   

     

在此处输入图像描述

这是一个新项目,没有任何变化

在此处输入图像描述

目录

在此处输入图像描述

在此处输入图像描述

我已经使用 WSL2 一年多了,大约一个月前,在 react 创建新项目时开始出现这些错误

标签: reactjswindows-subsystem-for-linuxwsl-2

解决方案


我相信问题是你试图调用JSON.parse(...)已经是 JS 对象的东西。你data在回调中chrome.storage.local.get('cs_template',...)已经是一个 JS 对象。我不确定您的数据结构是什么,但数据应该是cs_template可以访问的实际对象,就像data.cs_template在回调函数中一样。


推荐阅读