使用JavaScript npm包_Javascript_Node.js

使用JavaScript npm包

javascript node.js

使用JavaScript npm包,javascript,node.js,Javascript,Node.js,tl；dr：我来自Python背景-我基本上使用pip安装foo，然后使用Python解释器运行使用foo的代码。这将如何转化为JS的世界我正在尝试使用此软件包：并执行作者给出的这个简单代码示例- /** @jsx h **/ import { diff, h } from 'skatejs-dom-diff'; const source = <div><span>source</span></div>; const target = &l

tl；dr：我来自Python背景-我基本上使用

pip安装foo

，然后使用Python解释器运行使用

foo

的代码。这将如何转化为JS的世界

我正在尝试使用此软件包：

并执行作者给出的这个简单代码示例-

/** @jsx h **/
import { diff, h } from 'skatejs-dom-diff';

const source = <div><span>source</span></div>;
const target = <div><span>target</span></div>;
const instructions = diff(source, target);

当我试着调试这段代码时，我一直在钻Babel、JSX、ES6等的兔子洞，但没有真正的好处，因为我更困惑的是，我仍然无法理解如何运行这段JS代码。

这里尝试使用的是一种语法，这是一组超JavaScript。为了执行ES代码，您需要一个transpiler，比如将代码从EcmaScript转换为纯JavaScript，然后节点或浏览器就可以理解

但是，如果您不需要遵循面向对象的范例或EcmaScript的显著特性（这使JavaScript成为一种多范例语言），我建议您使用纯JavaScript

您可以查看这两种方法之间的主要区别

您可以访问本文来了解更多关于jsx以及如何使用它的信息

----编辑----

要修复代码，可以执行以下步骤：

打开cmd并将目录更改为您的项目

键入命令npm i-g browserify

键入命令

npm i-D babelify babelify-preset-2015

添加以下代码并将其另存为test.js

test.js

/** @jsx h **/
import { diff, h } from 'skatejs-dom-diff';

const source = h('div', h('span', 'source'));
const target = h('div', h( 'span' , 'target'));
const instructions = diff(source, target);
console.log(instructions);

键入命令

browserify test.js-o bundle.js-t[babelify--presets[es2015]]

创建一个index.html文件并向其中添加以下代码

index.html

<html>
<body>
<script src="bundle.js">
</script>
</body>
</html>

在浏览器中打开index.html并在控制台中检查输出（右键单击->检查->控制台）

多田！：）

如果您试图从浏览器中使用

npm

模块，可以查看。抱歉，您不能安装

npm

软件包并直接在浏览器中使用。注意。您不需要Browserify从浏览器中使用npm模块。我不需要任何与浏览器相关的东西。我只需要独立运行这个JS代码。这不可能吗？ECMAScript不是JavaScript的超集，而是JavaScript（和其他）实现的语言规范。我试图使用node运行固定代码，但遇到了另一个错误。很抱歉，我误解了你的意思。该库是在ES6中构建的。您必须有一个ES6 transpiler来翻译要在节点中运行的代码，而且该库是一个在浏览器中操作DOM元素的模块，因此它需要一个html文件，其中使用脚本标记调用编译的源代码。

<html>
<body>
<script src="bundle.js">
</script>
</body>
</html>