错误：无法找到模块'node-jsdom

问题描述：

我有两个文件todosController.js和index.html。我试图访问一个元素，并在javascript控制台中查看它的输出。这里是代码：错误：无法找到模块'node-jsdom

<!--index.html:--> 
<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>TodosList</title> 
</head> 
<body> 
    <h1>Todos List</h1> 
    <button id="displayTodosButton">Display Todos</button> 
    <!--index.html is linked to javascript file todosController.js--> 
    <script src="todosController.js"></script> 
</body> 
</html>

下面是JavaScript代码：

//todosController.js 

var jsdom = require("node-jsdom"); 
var fs = require("fs"); 
var jquery = fs.readFileSync("./jquery.js", "utf-8"); 

jsdom.env({ 
url: "http://news.ycombinator.com/", 
src: [jquery], 
done: function (errors, window) { 
    var $ = window.$; 
    console.log("HN Links"); 
    $("td.title:not(:last) a").each(function() { 
     console.log(" -", $(this).text()); 
    }); 
} 
}); 
let markup = fs.readFileSync('foo.html'); 
let doc = jsdom(markup, {}); 

function showData() { 
    elem = doc.getElementById('TodosText').value; 
} 

showData();

我使用Webstorm作为IDE.I试图在以下一些问题的答案特别建议安装NPM jsdom但问题是还是一样。

以下是错误：

module.js:538 
    throw err; 
    ^

Error: Cannot find module 'node-jsdom' 
    at Function.Module._resolveFilename (module.js:536:15) 
    at Function.Module._load (module.js:466:25) 
    at Module.require (module.js:579:17) 
    at require (internal/module.js:11:18) 
    at Object.<anonymous> 
    (/Users/muhammadtayyabsaeed/WebstormProjects/Todo 
    List/js/todosController.js:89:13) 
    at Module._compile (module.js:635:30) 
    at Object.Module._extensions..js (module.js:646:10) 
    at Module.load (module.js:554:32) 
    at tryModuleLoad (module.js:497:12) 
    at Function.Module._load (module.js:489:3)

我很感激你的反应。

你在浏览器中运行代码的东西吗？ – Taurus

'js文件夹，里面有todosController.js.'你说你有js文件夹，但是我在'src'里看不到'？ –

与控制台，你的意思是浏览器控制台或js /节点控制台？ – marmeladze

答

请尽量创造WebStorm以下项目：

的package.json：

{ 
    "name": "node_dom", 
    "version": "0.0.1", 
    "dependencies": { 
    "jsdom": "^11.3.0" 
    } 
}

todosController.js

const jsdom = require("jsdom/lib/old-api.js"); 
const jsdom_hard = require("jsdom/lib/old-api.js").jsdom; 
const fs = require('fs'); 

jsdom.env(
    "http://news.ycombinator.com/", 
    ["http://code.jquery.com/jquery.js"], 
    function(err, window) { 
    const $ = window.$; 
    console.log("HN Links"); 
    $("td.title:not(:last) a").each(function() { 
     console.log(" -", $(this).text()); 
    }); 
    } 
); 

let markup = fs.readFileSync('foo.html'); 
let doc = jsdom_hard(markup, {}); 


function showData() { 
    elem = doc.getElementById('TodosText').innerHTML; 
    console.log("Element value: " + elem) 
} 

showData();

foo.html：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>TodosList</title> 
</head> 
<body> 
<div id="TodosText">Hello!!</div> 
</body> 
</html>

右键单击的package.json，选择Run "npm install"
一旦安装依赖关系，右键单击todosController。JS，选择Run

本应该做的

我在这一行收到一个错误'const jsdom = require（“jsdom/lib/old-api.js”）;' 以下是我遇到的以下问题。当我添加一些按钮来执行一些事件监听时，我没有得到输出 'let displayTodosButton = doc.getElementById（'displayTodosButton'）; console.log（displayTodosButton）;' 它不起作用。另外，当我在代码中放置一些声明函数时，它们在浏览器控制台中不提供任何输出，而在webstrom控制台中执行。当我在浏览器控制台中放置相同的方法声明时，它们会给出输出......它非常令人困惑...... – Tayyab

这里是链接到回购的地方，我只是把代码支持我的上述评论以供进一步说明：https：// github.com/MTayyabSaeed/todos-list-javascript ...我按照上面解释的方法做了同样的处理... – Tayyab

你在“require”行看到了什么错误？你为什么期望在浏览器控制台中看到任何东西？ 'console.log（displayTodosButton）'不是监听器，它只是输出HTMLElement – lena

答

我扭你的代码一点点，所以这里有云

<!DOCTYPE html> 
 
<html lang="en"> 
 

 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>TodosList</title> 
 
</head> 
 

 
<body> 
 
    <h1>Todos List</h1> 
 
    <input type="text" id="TodosText"> 
 
    <input type="button" id="displayTodosButton" value="Display Todos" onClick="showData();"> 
 

 
    <script> 
 
    function showData() { 
 
     elem = document.getElementById('TodosText').value; 
 
     console.log(elem); 
 
    } 
 
    </script> 
 

 
</body> 
 

 
</html>

在此示例中，我把这个脚本在HTML文件中，但随时为您希望使用。还添加了一个文本字段，并将按钮更改为一个简单的HTML和对其调用showData。

希望它有帮助！

我的代码在浏览器中工作，但不在webstrom中。所以你的解决方案不能帮助这个问题，因为我试图根据需要修改它。我不想在html中使用脚本。 – Tayyab

对不起@Tayyab，你是对的，我也没有注意到Webstorm！我的错。 – Jose

webstorm不运行代码，所以语句'代码在webstorm中不起作用“是没有意义的。似乎你正在用node.js运行你的代码，而不是在浏览器中加载它。 **在javascript文件右键菜单中运行**命令可以使用Node.js运行它。 **运行**命令在HTML文件右键菜单中打开浏览器中的应用程序 – lena

答

在你的JS的开头添加该代码并运行JS文件，而不是运行HTML（与你的JS文件到您的HTML文件的路径替换foo.html）：

var fs = require('fs'); 
var jsdom = require("jsdom").jsdom; 
var markup = fs.readFileSync('foo.html'); 
var doc = jsdom(markup, {});

然后尝试访问document作为doc而不是看看是否有效。

事情是，document只在浏览器环境中定义，而不是在WebStorm控制台中定义，这就是您的代码在Chrome中工作的原因（我不是WebStorm的专家，但我相信它在nodeJS中运行JS代码未定义document的环境）。

看看this线程（这也是我抢夺上述示例的地方）。

我收到此错误： module.js：529 throw err; ^ 错误：在Function.Module._resolveFilename找不到模块 'jsdom' （module.js：527：15）在Function.Module._load（module.js：476：23）在Module.require（ module.js：568：17） at require（internal/module.js：11：18） at Object。（Module.js：624：30）（在Module.js：635：10） at Module（（List/js/todosController.js：89：13） at Module._compile （module.js：545：32） at tryModuleLoad（module.js：508：12） at Function.Module._load（module.js：500：3） – Tayyab

然后，您需要包含[“jsdom” ]（https://www.npmjs.com/package/node-jsdom）节点模块。 – Taurus

我试图在我的Mac上安装，但安装时遇到了很多错误。所以现在安装过程中出现错误。然后我试图运行它，它没有奏效。然后，我将他们的代码包括进来，他们提出了类似的方式，但仍然没有运气。 @Taurus – Tayyab

错误：无法找到模块'node-jsdom

相关推荐