ES6:"从' jquery'"中导入$真正意思?

时间:2016-11-11 02:51:18

标签: javascript typescript ecmascript-6 atom-editor

我首先假设它只是意味着,加载jQuery模块并在一个名为$的变量中初始化它。

然而,通过使用Atom和atom-typescript,我得到一个错误,说它"找不到模块' jquery'"。尽管所有代码都在浏览器中工作,但看起来atom-typescript无法解析任何类似于y的import x。

现在,看看ES6 doc,我发现你从一个模块导入了一个类/函数。意义完全不同,例如:

import { Component } from 'angular2/core';

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

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

1 个答案:

答案 0 :(得分:1)

声明import $ from jquery几乎相当于依赖注入。就像有人会写import React from 'react'来让自己访问文件中的React库一样,所以可以写import $ from jquery。 (如果它让你失望,使用美元符号是因为使用美元( a.k.a。 jQuery)运算符访问jQuery及其方法。

至于抛出的错误,可能有以下几点:

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

  2. 另请注意,在import { Component } from 'angular2/core';语句的情况下,会发生一些略有不同的情况。也就是说,正在导入命名导出 组件,按照AMD specification。在这种情况下,您可以将其视为仅导入部分当整个库不必要时,更大的Angular2核心库。

  3. 可以肯定的是,检查您是否已经通过CDN或将其安装为NPM依赖项来实际访问jQuery。