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

Question

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

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

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

import { Component } from 'angular2/core';

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

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

Answer 1

声明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。