javascript - ES6 : What does "import $ from ' jquery'"really means?

标签 javascript typescript ecmascript-6 atom-editor

起初我假设它只是意味着加载 jQuery 模块并在一个名为 $ 的变量中对其进行初始化。

但是,通过将 Atom 与 atom-typescript 一起使用,我收到一条错误消息,提示它“找不到模块‘jquery’”。尽管所有代码都在浏览器中运行,但看起来 atom-typescript 无法解决任何看起来像 import x from y 的问题。

现在,查看 ES6 文档,我发现您从模块中导入了一个类/函数。意思是完全不同的,例如这个是有道理的:

import { Component } from 'angular2/core';

但是在 jQuery 的情况下它意味着什么?

我可能在同一个问题中混合了不同的问题,但任何解释都会消除这种混淆,所以提前致谢 :)

最佳答案

声明import $ from jquery几乎相当于依赖注入(inject)。就像一个人会写 import React from 'react'使自己能够访问文件中的 React 库,因此可以编写 import $ from jquery . (以防它让你失望,使用美元符号是因为 jQuery 及其方法是使用美元(又名 jQuery)运算符访问的。

至于抛出的错误,可能有以下几种情况:

  1. 如果您在 package.json 文件中单独安装 jQuery 作为依赖项,并包含 <script>来自 jQuery CDN 的标签,将抛出此错误。如果您是通过 NPM 使用 jQuery,那么 import $ from jquery语法正确/必要。如果你打算通过 CDN 使用 jQuery(我会推荐),import声明是不必要的。 (因为您已经将该脚本标记包含在您的 index.html 中,所以您可以在整个应用程序范围内访问 jQuery 及其库)。但是,不要两者都做。

  2. 另请注意,在 import { Component } from 'angular2/core'; 的情况下声明,一些稍微不同的事情正在发生。即,根据 ( AMD specification 导入named export Component。在这种情况下,您可以将其视为仅导入较大组件的一部分当不需要整个库时,Angular2 核心库。

为了确定,请检查您是否确实通过 CDN 或将其作为 NPM 依赖项安装来访问 jQuery。

关于javascript - ES6 : What does "import $ from ' jquery'"really means?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40540403/

相关文章:

javascript - React-Redux 更改值的状态不会反射(reflect)在更改上

typescript - 从 Angular 2 typescript 中的复选框获取值(value)

javascript - 获取被点击的特定按钮的 ID。

typescript - Uncaught ReferenceError : firebase is not defined in Kotlin/JS project with Dukat generated declarations

javascript - 为每个对象创建唯一 ID

javascript - 在 React-Native 中将指定 HTML 标签之间的文本内容设为大写

javascript - 如何导出ES6模块并导入它

javascript - 使用 Google Charts(组合图表)在其自己的栏上垂直居中注释

javascript - svg 中的图像映射选择

javascript - TypeORM:如何查询与字符串数组输入的多对多关系以查找所有字符串都应存在于相关实体列中的实体?